如何解决默认情况下,如何加载设置为用户位置的经度和纬度的React-map-gl?
我想使用默认视口值设置为用户位置来渲染地图。目前,下面的代码用于普通渲染,单击时,在地图上有“定位我”按钮。 有没有办法让它默认点击?
<ReactMapGL
mapBoxApiAccesstoken={mapBoxApiKey}
mapStyle="mapBox://styles/mapBox/streets-v11"
{...viewport}
{...mapStyle}
onViewportChange={this.handle_view}
>
<GeolocateControl
positionoptions={{ enableHighAccuracy: true }}
trackUserLocation={true}
/>
</ReactMapGL>
解决方法
遵循以下答案:https://stackoverflow.com/a/59870917/14403123
useEffect(() => {
navigator.geolocation.getCurrentPosition(pos => {
setViewport({
...viewport,latitude: pos.coords.latitude,longitude: pos.coords.longitude
});
});
},[]);
显示完整代码:https://codesandbox.io/s/intelligent-albattani-f596t?file=/src/App.js的codesandbox。但是,由于我缺少令牌,它不会显示地图。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。