Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

[Bug] Map crashes on Android WebView

Aperta
  • Qualcosa non va?
#918 9 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 2 giorni

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
35/100
Tipo di issue
Bug
Chiarezza
Da chiarire
Stato di attività
Ferma
Stack tecnologico
android, react, typescript
Ambito
frontend, mobile-dev

Direzione di ricerca

Inizia ispezionando index.tsx:85 e la logica di useMapInstance() mostrata nell’issue, quindi riproduci il problema con un Android WebView, 150+ Advanced Markers e zoom ripetuti. Il risultato è raggiunto quando la mappa non riceve più coordinate non valide e non si blocca o va in crash durante gli aggiornamenti dei marker e le modifiche del centro.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

bug
Description

Hello Everyone,

Recently we moved to use react-google-maps library, and we are displaying around 120-200 Advanced Markers.
The logic is straightforward, we have an on-idle listener in the map -> we trigger a call to the backend -> backend respond with set of markers that we can use to create an Advanced Marker.

The Advanced Marker we create is an HTML component that might contain an svg with a text next to it and all wrapped inside a div tag

Once you zoom in and out multiple times and load the markers multiple times, randomly the map crashes and the whole webview crashes. in the console we see the following error:

setCenter: not a LatLng or LatLngLiteral with finite coordinates: in property lng: Infinity is not an accepted value

I saw similar logic in the component useMapInstance()

setTimeout(() => map.setCenter(map?.getCenter()!), 0);

So what it looks like is that the map is becoming undefined once we have the reuseMaps turned on but once I turned it off -> the map at some point reset to the initial center value.

I considered moving to visgl deck gl but couldn't add markers with HTMLElements there. (Should have more documentation to see if it's possible)

Steps to Reproduce

I'm working on creating a demo but you will require android studio to build the mobile app.
You need a simple webview in Android
Map component with 150+ Advanced Marker.
OnIdle listener that changes those Advanced markers.
zooming in and out will cause a grey area in the map and the whole web view become freezed.

https://github.com/user-attachments/assets/47596801-538c-4e6b-ba7f-f10dd1fcb886

Environment
  • Library version: 1.7.1
  • Google maps version: weekly
  • Browser and Version: 'Mozilla/5.0 (Linux; Android 15; 23078PND5G Build/AP3A.240617.008; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/144.0.7559.109 Mobile Safari/537.36'
  • OS: Android
Logs
InvalidValueError: setCenter: not a LatLng or LatLngLiteral with finite coordinates: in property lng: Infinity is not an accepted value
(anonymous) @ index.tsx:85
_.Fm @ main.js:176
_.Rm @ main.js:180
(anonymous) @ main.js:200
(anonymous) @ map.js:98
(anonymous) @ map.js:132
nh @ map.js:121
(anonymous) @ map.js:58
release @ map.js:127
Kn @ map.js:116
Ml @ common.js:178
Ml @ common.js:175
Mka @ common.js:64
Toa.qh._.Dq.Lm @ common.js:182
r @ index.tsx:85
Lingua principale
TypeScript
Stelle
1.9k
Fork
195
Merge medio
2g 11h
PR unite (30g)
14

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di visgl/react-google-maps

Tutte le issue di visgl/react-google-maps

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.