Loading rotate.png and scale.png by require() is with the new version of webpack (5) not possible anymore.
I suggest therefore to use new URL(), so the mode is still compatible with the latest frameworks like Angular 12.
My webpage shakes alot in certain ratio of web browser.
It does not happen on Microsoft Edge.
It does not happen when I just add ReactMapGL component.
But it happens when I put ReactMapGL inside DeckGL.
My webpage shakes alot in certain ratio of web browser. It does not happen on Microsoft Edge. It does not happen when I just add ReactMapGL component. But it happens when I put ReactMapGL inside DeckGL.
Hello, I'm not sure if this issue belongs in this repo or deck.gl, let me know if you'd rather have over there.
I'm using react-map-gl with deck.gl, and when I try to use the NavigationControl in my setup, the deck.gl canvas has a higher z-index than the map, and therefor blocks mouse events to the NavigationControl. I haven't seen examples of deck.gl using NavigationContol, so I'm not sure it's at all possible.
In the resulting HTML the deck.gl canvas and the react-map-gl StaticMap are in separate stacking contexts (each having position: absoulte set), with deck.gl (naturally) staying on top. That makes increasing the z-index of the NavigationControl not sufficient.
One possible solution coule be to make NavigationControl a sibling of DeckGL, but it can't since it depends on having viewport in its context. Is there any other way to do it?
I had an idea, since I'm already managing viewState myself, to pass it directly on to NavigationControl. Would you accept a PR that would open up that possibility (and using the context when it's not being passed as props)? It should be a pretty simple change with the addition of only a couple of lines.
That's not how hooks work. visible is evaluated when it's used, in your case, only when the component was rendered the first time (useState(initialState)). You need to construct a new layer instance whenever visible changes.
Hi, I want to ask some question. So if I need to update data inside GeoJSONLayer, I need to re-create new GeoJSONLayer ? . Because I did't get any documentation about how to update data in React.
First of all thanks for all the work you have been doing through the years with Mapbox. I know you're always open for feedback and suggestions, so here I go...
One of the features I've been missing a lot is the possibility to have popups with altitude for my fill-extrusions and my 3D models, so I finally implemented my own version using THREE.CSS2DObject, but honestly it's only a workaround that could be made within popup class that is the proper place.
To implement these custom popups with altitude, it required to create a new CSS2DRenderer instance and call it's render method on the render member of a CustomLayerInterface new layer. Then, create a CSS2DObjetc, add the HTML inside and set position.
This is how it works using the default sample for 3D buildings adding a queryRenderedFeatures call on click to filter the extrusions at the point clicked, and then creating two popups in the same LngLat position, but one using the custom approach including altitude and the other one using the standard popup class. I use feature.properties.height of the clicked extrusion to create one of these custom popups. Position is quite stable on any camera pitch/zoom/bearing combination. I use a converter to project the LngLat + Alt coordinates to position properly.
As far as I understand, the main difference (apart from the input of a third parameter for altitude) is the calculation of the css translate values for offsetedPos.x and offsetedPos.y final pixels done in _update member, but I could be wrong. I'm aware this could be a major change for popup but I think it deserves the effort now that your maps are now supporting 3D models and fill-extrusions.