我正在使用 MapQuest Leaflet Api 绘制一条包含多个站点的路线(自定义标记)。一切都快完成了。我得到一条路线多个标记和一条折线。
我有两个问题
- 如何绘制点击时的优化路线
按钮路线优化的代码是这样的
dir = MQ.routing.directions(); dir.optimizedRoute({ locations: [ '33.703507, 73.053702', '33.714328, 73.050625', '33.730497, 73.077898', '33.732863, 73.088078' ] });
下面给出了我的代码
<script>
window.onload = function () {
var map,
dir;
var custom_icon,
marker;
map = L.map('map', {
layers: MQ.mapLayer(),
center: [40.045049, -105.961737],
zoom: 7
});
dir = MQ.routing.directions();
dir.route({
locations: [
'33.703507, 73.053702',
'33.714328, 73.050625',
'33.730497, 73.077898',
'33.732863, 73.088078'
],
options: { avoids: ['toll road'] }
});
CustomRouteLayer = MQ.Routing.RouteLayer.extend({
createStopMarker: function (location, stopNumber) {
custom_icon = L.divIcon({
iconSize: [26, 36],
popupAnchor: [0, -18],
html: '<span class="notification">' + stopNumber + '</span>'
});
marker = L.marker(location.latLng, { icon: custom_icon }).bindPopup(location.adminArea5 + ' ' + location.adminArea3).openPopup().addTo(map);
marker.on('click', onMarkerClick);
return marker;
}
});
map.addLayer(new CustomRouteLayer({
directions: dir,
fitBounds: true,
draggable: false,
ribbonOptions: {
draggable: false,
ribbonDisplay: { color: '#CC0000', opacity: 0.3 },
widths: [15, 15, 15, 15, 14, 13, 12, 12, 12, 11, 11, 11, 11, 12, 13, 14, 15]
}
}));
}
</script>
<body style='border:0; margin: 0'>
<div id='map' style='position: absolute; top: 0; bottom: 0; width: 100%;'></div>
</body>
请帮忙。谢谢:)
最佳答案
该按钮将调用其中包含 MQ.routing.directions.optimizedRoute() 代码的函数。
function optimize() {
dir = MQ.routing.directions();
dir.optimizedRoute({
locations: [
'syracuse ny',
'springfield ma',
'ithaca ny',
'hartford ct'
]
});
map.addLayer(MQ.routing.routeLayer({
directions: dir,
fitBounds: true
}));
}
要获取里程，请使用成功事件获取整个路线响应。
dir = MQ.routing.directions()
.on('success', function(data) {
console.log(data.route.distance);
});
关于javascript - MapQuest Leaflet Api - 获取时间和距离的优化路径，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/36003736/