我正在尝试使用mapbox-gl-js Directions API插件(https://github.com/mapbox/mapbox-gl-js)检索多条路线的路线。
以下代码请求路线并在地图上绘制。
var mapBoxDrawDrivingPath = function(routeArray, day)
{
var colorArray = ['#4286f4' , '#7312bc' , '#11bc2e' , '#80bc11', '#bc2411'];
//var stringDay = day.toString(16);
var rand = Math.floor((Math.random() * 5));
var lineColor = colorArray[rand] ;
console.log("Day : " + day + " " + lineColor);
console.log(routeArray[0]);
var MapBoxDir = new MapboxDirections({accessToken: mapboxgl.accessToken });
map.panTo(routeArray[0]);
MapBoxDir.setOrigin(routeArray[0]);
MapBoxDir.setDestination(routeArray[routeArray.length -1]);
MapBoxDir.on('route', function(e) {
//the following function is altered to return "lng,lat" instead of "lat,lng"
var routeGeometry = polyLineDecode(e.route[0].geometry);
map.addLayer(
{
"id": "route"+day,
"type": "line",
"source": {
"type": "geojson",
"data": {
"type": "Feature",
"properties": {},
"geometry": {
"type": "LineString",
"coordinates": routeGeometry
//routeGeometry
}
}
},
"layout": {
"line-join": "round",
"line-cap": "round"
},
"paint": {
"line-color": lineColor,
"line-width": 4
}
});
});
}
使用不同的坐标集多次调用上述函数。由于方向的结果是回调时的非阻塞行为,因此函数" mapBoxDrawDrivingPath"被称为一个接一个,而不等待先前呼叫的结果。
我假设它会返回每个排队回调的相应路线,但它会返回所有回调回报中最后一个输入的路线。
我在这里做错了什么?