使用 react-mapbox-gl 的 fitBounds 定位到特定边界

Question

我想让地图重新定位到按钮点击事件的常量绑定。加载页面时，它会显示我得到正确计算的界限的界限。加载后，我需要导航到我绘制的标记。导航到几个标记后，需要飞到我第一个得到的原始边界。但它位于伦敦市。我不确定为什么它不重新定位到原始边界。

这是我的代码

<CustomMapbox
    showAll={this.state.showAll}
    center={this.state.center}
    fitBounds={this.state.bound}
    zoom={[8]}
    containerStyle={{
       height: "100%"
    }} onClick={this.onClickMap}
>
     <Marker
        locations={this.state.places}
        data={this.state.product}
        onClick={this.onClickPosition} 
     />

      { (this.state.selectedPoint ) && (this.state.showPopup) &&
         <Popup key={`${this.state.selectedPoint[0]}_${this.state.selectedPoint[1]}`} coordinates={this.state.selectedPoint}>
              <StyledPopup>
                <div>{this.state.selectedUPCDate}</div>
              </StyledPopup>
         </Popup>
                }
</CustomMapbox>

如您所见，我正在使用 CustomMapbox 组件和道具，例如 showAll、center、fitBounds 用于地图。 showAll 是否显示所有标记。当 showAll 为真时，需要显示所有标记，因此需要显示 fitBound 的区域。而当showAll为false时，需要显示中心点。

我通过 showAll 变量使 CustomMapbox 到 select 成为正确的道具。在 CustomMapbox 中，如果 showAll 为真，则 center 道具将被移除，否则，fitBounds 道具将被移除。问题是在加载页面时正确显示此区域，但在导航到特定中心后不显示。

有什么解决方案可以用 react-mapbox-gl 实现这个功能吗？

Answer 1

大家好！我自己解决了。使用 fitBounds 时，需要使用该边界的中心。它现在运行良好

不需要为 fitBounds 使用 showAll 标志只需要使用 fitBounds 及其 center 值

使用 react-mapbox-gl 的 fitBounds 定位到特定边界

Locate to specific bound by using fitBounds of react-mapbox-gl

mapbox

reactjs

react-map-gl