Jquery 使用MapQuest Directions API从用户地理位置创建路由
我正在尝试创建一条从用户当前位置到他选择的目标的路线。问题是,我不知道如何将用户的纬度/经度输入到我的路由函数中,该函数如下所示:Jquery 使用MapQuest Directions API从用户地理位置创建路由,jquery,routing,geolocation,leaflet,mapquest,Jquery,Routing,Geolocation,Leaflet,Mapquest,我正在尝试创建一条从用户当前位置到他选择的目标的路线。问题是,我不知道如何将用户的纬度/经度输入到我的路由函数中,该函数如下所示: getRoute = function(){ dir = MQ.routing.directions() .on('success', function(data) { //does some stuff with the routes data/directions. not important here
getRoute = function(){
dir = MQ.routing.directions()
.on('success', function(data) {
//does some stuff with the routes data/directions. not important here
});
dir.route({
locations: [
{ latLng: { lat: USER LAT HERE, lng: USER LNG HERE } },
{ latLng: { lat: (poiCoordinates.lat), lng: (poiCoordinates.lng) } }
],
options: {
//not important as well
}
});
mqroute = MQ.routing.routeLayer({
directions: dir,
}).addTo(map);
};
getRoute = function(position){
userLatitude = position.coords.latitude;
userLongitude = position.coords.longitude;
dir = MQ.routing.directions()
.on('success', function(data) {
//does some stuff with the routes data/directions. not important here
});
dir.route({
locations: [
{ latLng: { lat: userLatitude, lng: userLongitude } },
{ latLng: { lat: (poiCoordinates.lat), lng: (poiCoordinates.lng) } }
],
options: {
//not important as well
}
});
mqroute = MQ.routing.routeLayer({
directions: dir,
}).addTo(map);
};
当用户选择一个兴趣点(例如餐厅)并单击“查找路线”按钮时,将调用上述函数。我可以访问一个函数,但不知道如何将它们组合起来,并将用户的地理位置设置到上面的getRoute函数中。有什么建议吗?干杯 这只是一个示例,我不知道您是否有用。
使用地理定位,您可以找到传递给getRoute函数的用户纬度和经度
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
getRoute = function(latitude,longitude){
//.........
console.log(latitude,longitude)
dir.route({
locations: [
{ latLng: { lat: latitude, lng: longitude } },
{ latLng: { lat: (poiCoordinates.lat), lng: (poiCoordinates.lng) } }
],
});
//.......
};
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(success,error);
}else{alert("Geolacion not supported")};
function success(pos) {
var latx=pos.coords.latitude;
var longx=pos.coords.longitude;
getRoute(latx,longx)
};
function error(pos) {
alert('error')
};
});
</script>
$(文档).ready(函数(){
getRoute=函数(纬度、经度){
//.........
console.log(纬度、经度)
直达路线({
地点:[
{latLng:{lat:纬度,lng:经度},
{latLng:{lat:(poicordinates.lat),lng:(poicordinates.lng)}
],
});
//.......
};
if(导航器.地理位置){
navigator.geolocation.getCurrentPosition(成功,错误);
}else{alert(“不支持Geolacion”)};
功能成功(pos){
var latx=位置坐标纬度;
var longx=位置坐标经度;
getRoute(latx、longx)
};
功能错误(pos){
警报('错误')
};
});
这是为我做的:
单击“查找从我的位置到目标位置的路线按钮”调用此功能:
createRoute = function(){
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(getRoute);
} else {
alert("Geolocation not supported");
}
};
修改后的getRoute函数如下所示:
getRoute = function(){
dir = MQ.routing.directions()
.on('success', function(data) {
//does some stuff with the routes data/directions. not important here
});
dir.route({
locations: [
{ latLng: { lat: USER LAT HERE, lng: USER LNG HERE } },
{ latLng: { lat: (poiCoordinates.lat), lng: (poiCoordinates.lng) } }
],
options: {
//not important as well
}
});
mqroute = MQ.routing.routeLayer({
directions: dir,
}).addTo(map);
};
getRoute = function(position){
userLatitude = position.coords.latitude;
userLongitude = position.coords.longitude;
dir = MQ.routing.directions()
.on('success', function(data) {
//does some stuff with the routes data/directions. not important here
});
dir.route({
locations: [
{ latLng: { lat: userLatitude, lng: userLongitude } },
{ latLng: { lat: (poiCoordinates.lat), lng: (poiCoordinates.lng) } }
],
options: {
//not important as well
}
});
mqroute = MQ.routing.routeLayer({
directions: dir,
}).addTo(map);
};