我想获取当前地图的边界,以便我可以使用Overpass API搜索这些边界。
对于传单我知道方法只是map.getBounds(),但我不知道如何在react-leaflet中实现它。
class SimpleExample extends React.Component {
constructor() {
super();
this.state = {
lat: 51.505,
lng: -0.09,
zoom: 13,
};
}
componentDidMount() {
console.log(this.refs.map.getBounds())
}
render() {
const position = [this.state.lat, this.state.lng];
return (
<Map center={position} zoom={this.state.zoom} ref='map'>
<TileLayer
attribution='© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'
/>
</Map>
);
}
}
这是我尝试过的。错误说this.refs.map.getBounds
不是函数。
答案 0 :(得分:8)
尝试this.refs.map.leafletElement.getBounds
。
您可以直接访问组件创建的Leaflet元素 在此组件中使用this.leafletElement。这个传单元素 通常在componentWillMount()中创建,但Map除外 只能在容器之后创建的组件 呈现。
这是一种说法,它们将传单对象作为leafletElement
属性存储在其组件对象上。