1

我正在使用以下代码片段尝试使用 mapbox-gl v0.50.0 从 uber react-map-gl: 4.0.2 访问 MapBox API。

 import MapGL from 'react-map-gl';
 export default class App extends Component 
 {
   constructor(props) {
    super(props);
   this.mapRef= React.createRef();
   }
   componentDidMount() 
   {
      let data = this.mapRef.getMap().getBounds(); <----
   } 
   render() {
    <MapGL
    {...viewport}
    width="100%"
    height="100%"
    mapStyle={MapStyle}
    onViewportChange={this._updateViewport}
    ref={map => this.mapRef = map}
    mapboxApiAccessToken={TOKEN} >
   }
 }

如果我尝试访问任何其他方法,例如 getStyle/getSource 和其他方法,则会引发错误“不是函数”和“无法读取未定义的属性'版本'”。我做错了什么还是不是所有的 MapBox Api 方法都不能通过 getMap() 方法使用?

谢谢

4

2 回答 2

0

如果您可以map正确获取对象,则应公开所有功能,包括getStyle. getSource对我也不起作用,可能是使用 mapStyle 不算作来源?不确定最后一点。

于 2018-12-08T00:04:30.593 回答
0

我用它来获取初始地图边界。

    getMapBoundaries = () => {
    // Get map boundaries
    const myMap = this.mapRef.getMap(); 
    console.log(myMap.getBounds());
    const mapBoundaries = myMap.getBounds();
    this.setState({ mapBoundaries })
  }

  componentDidMount = () => this.getMapBoundaries();

我还注意到“react-map-gl”的导入应该是

import ReactMapGL from 'react-map-gl';

为什么会出错?看来您没有在 componentDidMount 方法中使用返回函数。

于 2018-12-08T16:48:31.107 回答