如何解决在mapbox中打开地图获取用户位置
伙计们,一旦具有mapbox地图的组件被渲染,我如何在mapbox中获得用户位置。
我在他们的文档中看到他们提供了类似的选项
this.map.addControl(
new mapboxgl.GeolocateControl({
positionOptions: {
enableHighAccuracy: true,},trackUserLocation: true,}),);
在按一下位置符号后,它会显示我当前的位置,但是我有什么办法可以初始化?无需单击位置按钮,地图应显示用户位置
解决方法
您应该将map.flyTo()方法与mapbox中的map.on('load')结合使用。
map.on('load',function () {
map.flyTo({
center: [
-74.5 + (Math.random() - 0.5) * 10,// Example data
40 + (Math.random() - 0.5) * 10 // Example data
],essential: true // this animation is considered essential with respect to prefers-reduced-motion
});
}
您注意到,要使用flyTo功能,您需要用户的坐标。
您可以通过两种方法获得它们:
1。用户已授权浏览器位置->使用浏览器位置
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
coordinates = [position.coords.latitude,position.coords.longitude];
});
}
2。用户未授权浏览器位置->使用IP地理位置API
您可以使用Abstract之类的IP地理位置api来获取访问者的位置:
$.getJSON("https://ipgeolocation.abstractapi.com/v1/?api_key=**********",function(data) {
console.log(data.longitude);
console.log(data.latitude);
coordinates = [data.longitude,data.latitude]
})
然后可以加载上面编写的map.on('load')函数,并粘贴“中心”键的坐标。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。