visgl / visgl/react-google-maps
[Bug] Could not find a 3d context
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.9k
- Forks
- 193
- Avg merge
- 3d 16h
- Merged PRs (30d)
- 13
Description
Description
Sometimes when loading the map, we encounter this error:
I did some googling around and found that it could be because of the browser's hardware acceleration being turned off.
I did turn it on, restarted my browser but still encountered this same error sometimes.
I'm not sure if this dependency with 3d context is for supporting deck.gl, but if it is, is there a way I can exclude that so I don't get this error anymore?
EDIT: Turns out vector maps require Web GL (Hardware acceleration) to be switched on for the browser. The google maps documentation also mentions that it automatically falls back to a Raster map if for some reason a Vector map cannot be rendered. So, if a user has their hardware acceleration off, the map is gonna fallback to a raster map.
I've seen this happening sometimes when we test our service on some VDIs with hardware acceleration off.
I think that the library (if handling) is not handling this fallback scenario well because when I see this happening, I'm sometimes returned an empty map with nothing on it. Like a blank off-white screen with nothing on it.
Steps to Reproduce
Try rendering a map view with some markers keeping hardware acceleration off in your browser settings. You need a map id with Vector (tilt, rotation) enabled in order to check the scenario well. The map might load sometimes well, and also give an error in console saying "Attempted to load vector, but falling back to raster" (something along these lines). And sometimes, after you refresh, it'll simply fail and return an error without falling back to Raster.
Environment
- Library version: "@vis.gl/react-google-maps": "^0.5.4"
- Google maps version: weekly
- Browser and Version: Chrome: 122.0.6261.128 (Official Build) (64-bit)
- OS: Windows
Logs
No response
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue by rendering a map with markers while browser hardware acceleration is disabled and a vector-enabled map ID is used. Compare successful raster fallback, the blank map, and the “Could not find a 3d context” error, then trace the map-loading path to determine whether fallback failures are handled. Done means the map reliably renders or reports a clear supported failure instead of showing a blank view.
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
- Needs clarification
- Newbie friendliness
- 30/100