作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试编写一个脚本来获取用户的地理位置 - 如果他们启用了它,并绘制到预定义目的地的路线。如果他们没有启用地理定位,它应该只绘制预定义的位置。该脚本不起作用,但您应该能够通过查看代码来很好地了解我正在尝试做的事情。我在正确的轨道上吗?任何人都可以发现为什么它不起作用吗?
<script type="text/javascript">
$(function (){
var dest = "Unit 20, Tallaght Business Centre, Whitestown Road, Tallaght Business Park, Ireland";
if(geolocEnabled()){
getLocation();
}else{
plotMarker(dest);
}
//check if geolocation enabled
function geolocEnabled(){
return navigator.geolocation;
}
//plot marker for VRF office
function plotMarker(dest){
$('#map').gmap3(
{ action: 'addMarker',
address: dest,
map:{
center: true,
zoom: 14
},
marker:{
options:{
draggable: false
}
}
}
);
}
//get user's location
function getLocation(){
$('#map').gmap3(
{ action : 'geoLatLng',
callback : function(latLng){
if (latLng){
plotRoute(latLng, dest);
return;
} else {
alert("Unable to determine your location. Enable geolocation services and try again, or consult the map for our location.");
plotMarker(dest);
}
}
});
}
//plot route
function plotRoute(latLng, dest){
$('#map').gmap3(
{ action:'getRoute',
options:{
origin: latLng,
destination: dest,
travelMode: google.maps.DirectionsTravelMode.DRIVING
},
callback: function(results){
if (!results) return;
$(this).gmap3(
{ action:'init',
zoom: 7,
mapTypeId: google.maps.MapTypeId.ROADMAP,
streetViewControl: true,
center: [53.337433,-6.2661]
},
{ action:'addDirectionsRenderer',
panelID: 'directions-panel',
options:{
preserveViewport: true,
draggable: false,
directions:results
}
}
);
}
}
);
}
});
</script>
非常感谢所有帮助。
编辑:当我运行脚本时,我什至没有在浏览器中收到地理定位警告。
编辑:我从 getLocation 中删除了 {timeout: 10000},它现在进入警报状态。脚本已更新。
最佳答案
地理定位是一个异步过程,当 getLocation()
完成时,结果还不可用。
在 $.gmap3.geoLatLng
的回调中调用 plotRoute()
并提供预期的参数(latLng,dest)
关于javascript - 谷歌地图/gmap3 - 从用户的地理位置绘制到已知目的地的路线 - 需要帮助,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12004744/
leaflet:一个开源并且对移动端友好的交互式地图 JavaScript 库 中文文档: https://leafletjs.cn/reference.html 官网(英文): ht
我是一名优秀的程序员,十分优秀!