React-Mapbox-GL не корректирует карту в Fitbounds - PullRequest
0 голосов
/ 03 мая 2020

Я использую response-mapbox-gl для рендеринга карты. Я передаю данные о местоположении (props.places) динамически и обновляю карту, чтобы они отображались как объекты на карте.

 const places = props.places
 const _places = useMemo(() =>
        places.map(({ ...otherProps }) => {
            return <Feature key={otherProps._id} coordinates={otherProps.location.coordinates} />
        }), [places])

Я также пытаюсь настроить границы, чтобы показать все места.

    const [bbox, setBox] = useState(new mapboxgl.LngLatBounds())
    useMemo(() => {
        let coordinatesArray = []
        places.forEach(element => { coordinatesArray.push(element.location.coordinates) })
        const geoJsonFeatures = {
            type: 'FeatureCollection',
            features: [{
                type: 'Feature',
                properties: {},
                geometry: {
                    type: "Polygon",
                    coordinates: [coordinatesArray]
                }
            }]
        }     
        let lngLatBox = turf.bbox(geoJsonFeatures)
        let sw = [lngLatBox[0], lngLatBox[1]]
        let ne = [lngLatBox[2], lngLatBox[3]]
        let fitboundsObj = [sw, ne]
        setBox(fitboundsObj)
    }, [places])

Мой функциональный компонент возвращает следующее ...

   return (
        <Map
            // style="mapbox://styles/mapbox/streets-v11"
            style="mapbox://styles/kobstr/cj0itw9ku003l2smnu8wbz94o"
            center={[mapOptions.lng, mapOptions.lat]}
            // zoom={[mapOptions.zoom]}
            pitch={[60]}
            fitBounds={bbox}
            interactive={false}
            containerStyle={{
                height: '100vh',
                width: '100%'
            }}
            onMove={(_, event) => {
                movingMap(event)
            }}
        >
            <Layer type="circle" id="point" paint={{
                "circle-radius": 5,
                "circle-color": "#ff0000"
            }}>
                {_places}
            </Layer>
        </Map>
    );

Проблема заключается в том, что в то время, как обновляются значения функций ({_places}) и BBox, карта не хочет чтобы приспособиться к новому BBox на Fitbounds, даже если он показывает новые функции.

Я также заметил, что когда я go возвращаюсь и перезагружаю страницу с новым набором мест, карта корректируя свои границы соответствующим образом. Это просто не происходит, когда пропускают новый набор мест и показывают новые функции.

Если бы у кого-то были какие-то идеи о том, что происходит, это было бы здорово. спасибо ..

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...