visgl / visgl/react-google-maps

[Bug]地图使用MapControl在iphone12 系统14.2.1上会报错

Open
#532 4 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

google maps issue wontfix
Dominant language
TypeScript
Stars
1.9k
Forks
193
Avg merge
3d 16h
Merged PRs (30d)
13

Description

Description

521726279207_ pic

Steps to Reproduce
import React, { useCallback, useMemo } from 'react'
import { useState, useEffect, FC, useRef, createRef, useContext, useReducer } from 'react'

import { APIProvider, useMap, Map, ControlPosition, RenderingType, MapControl, MapProps } from '@vis.gl/react-google-maps';
import './index.scss'
// import { getConfig } from '../../../../utils/google';
// const googleMapKey = getConfig.google.apiKey;
// const mapId = getConfig.google.mapId;

const googleMapKey = "testMapKey";
const mapId = "testId";

const Index: FC = () => {

    const mapProps: MapProps = {
        defaultCenter: {
            lat: 24.7136,
            lng: 46.6753,
        },
        disableDoubleClickZoom: false,
        mapId: mapId,
        mapTypeControl: false,
        minZoom: 5,
        maxZoom: 17,
        zoom: 10,
        style: {
            position: 'absolute',
            minHeight: "100vh",
            width: "100%"
        },
        renderingType: RenderingType.UNINITIALIZED,
    };
    return (
        <div className='index'>
            <APIProvider apiKey={googleMapKey}>
            <Map {...mapProps}>
                <MapControl position={ControlPosition.CENTER}>
                    <div style={{
                        background: 'red'
                    }}>
                        .. any component here will be added to the control-containers of the
                        google map instance ..
                    </div>
                </MapControl>
            </Map>
        </APIProvider>
        </div>
    )
}

export default Index

It's just the normal official demo code, without any additional rendering, and then the above error is reported. Systems equal to or higher than iOS 15 will not have this error.

(original text) 就是正常的官方demo代码,没有其他渲染,然后就报上面的错误了。大于等于ios 15的系统都不会有这个报错。
Environment
  • Library version: 最新
  • Google maps version: weekly
  • Browser and Version: 跟随ios 系统14.2.1的
  • OS: 14.2.1
Logs

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the provided TypeScript example with MapControl on an iPhone running iOS 14.2.1 and the weekly Google Maps version, then compare it with iOS 15 or later. Inspect the MapControl rendering path and its interaction with the Google Maps control containers; done means the demo renders without the reported error on the affected iOS version.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.