Mapbox-gl-js Directions插件仅返回同时呼叫时最后一次呼叫的指示

时间:2017-04-17 08:46:29

标签: javascript mapbox-gl-js

我正在尝试使用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"被称为一个接一个,而不等待先前呼叫的结果。

我假设它会返回每个排队回调的相应路线,但它会返回所有回调回报中最后一个输入的路线。

我在这里做错了什么?

0 个答案:

没有答案