javascript - 构建具有多个坐标的路线时,Nokia Here map 出现错误

标签 javascript polyline here-api

例如,我有 500 个路线坐标,我想使用此坐标从 A 点到 B 点构建路线

现在我使用了这段代码:

router = new nokia.maps.routing.Manager();

    // The function onRouteCalculated  will be called when a route was calculated
        var onRouteCalculated = function (observedRouter, key, value) {
            if (value == "finished") {
                var routes = observedRouter.getRoutes(),
                    container = new nokia.maps.map.Container(),
                    route = routes[0],
                    waypoints = route.waypoints,
                    i, length = waypoints.length;

                // Add route polyline to the container
                container.objects.add(new nokia.maps.map.Polyline(route.shape, {
                    pen : new nokia.maps.util.Pen({
                        lineWidth: 5,
                        strokeColor: "#AB7A8C"
                    })
                }));

                // Add container to the map
                map.objects.add(container);

                // Iterate through all waypoints and add them to the container
                for (i = 0; i < length; i++) {
                    //
                    container.objects.add(new nokia.maps.map.StandardMarker(waypoints[i].originalPosition, {
                        text: String.fromCharCode(65 + i) //65 is a char code for "A"
                    }));
                }
                //Zoom to the bounding box of the route
                map.zoomTo(container.getBoundingBox(), false, "default");
            } else if (value == "failed") {
                alert("The routing request failed.");
            }
        };

        /* We create on observer on router's "state" property so the above created
         * onRouteCalculated we be called once the route is calculated
         */
        router.addObserver("state", onRouteCalculated);

    // Create waypoints
        var waypoints = new nokia.maps.routing.WaypointParameterList();

        $.each(routesArr, function (key, value){
nokia.maps.geo.Coordinate(parseFloat(value[1]), parseFloat(value[0])));
                var Coords = value.split(' ');
                console.log(Coords);
                waypoints.addCoordinate(new nokia.maps.geo.Coordinate(parseFloat(Coords[1]), parseFloat(Coords[0])));
        })

        console.log(waypoints);

        /* Properties such as type, transportModes, options, trafficMode can be
         * specified as second parameter in performing the routing request.
         *
         * See for the mode options the "nokia.maps.routing.Mode" section in the developer's guide
         */
        var modes = [{
            type: "fastest",
            transportModes: ["car"],
            trafficMode: "disabled",
            options: ""
        }];

    // Trigger route calculation after the map emmits the "displayready" event
        map.addListener("displayready", function () {
            router.calculateRoute(waypoints, modes);
        }, false);

但调试器出现错误:

["32.0966977626384", "49.4231563713862"] functions.js:142
["32.0968187973202", "49.4231926231174"] functions.js:142
["32.0967591181696", "49.4231632026373"] functions.js:142
["32.0967998542191", "49.4231820200099"] functions.js:142
["32.0968651492448", "49.4232476922212"] functions.js:142
["32.0969191287012", "49.4233110594092"] functions.js:142
["32.0969724376054", "49.4233680982603"] functions.js:142
["32.0970814023466", "49.4234444154887"] functions.js:142
["32.0972258225382", "49.4235442020459"] functions.js:142
["32.0974480267913", "49.4237132650329"] functions.js:142
["32.0977787766904", "49.4239508081688"] functions.js:142
["32.0976077020467", "49.4238198828412"] functions.js:142
["32.0980493445248", "49.4241391076235"] functions.js:142
["32.0982283819766", "49.4242630759714"] functions.js:142
["32.0986557752193", "49.4245636510192"] functions.js:142
["32.0987762231679", "49.424653169745"] functions.js:142
["32.0984075032474", "49.4243849907531"] functions.js:142
["32.0988543425054", "49.4246631442098"] functions.js:142
["32.0988309569956", "49.4246686343564"] functions.js:142
["32.0988922287078", "49.4246461708559"] functions.js:142
["32.0989042148293", "49.4246334722726"] functions.js:142
["32.0989042148293", "49.4246334722726"] functions.js:142

 GET http://route.st.nlp.nokia.com/routing/6.2/calculateroute.json?routeattribut…ck=(function()%7Bnokia.maps.net.Request.callbacks%5B4%5D(5,arguments);%7D) 502 (BAD_GATEWAY) base.js:167
    Uncaught TypeError: Cannot read property 'error' of undefined 

我无法解决这个问题,有人能遇到这个问题吗?

最佳答案

如果您只是在 map 上画一条线,不需要路线,您需要 Polyline :

例如

// Set of initial geo coordinates to create the purple polyline
var points = [
  new nokia.maps.geo.Coordinate(50.1299, 8.5680),
  new nokia.maps.geo.Coordinate(50.0969, 8.4829),
  new nokia.maps.geo.Coordinate(50.0819, 8.4856),
  new nokia.maps.geo.Coordinate(50.0555, 8.4479)
];

// Transparent purple polyline
var polyline = new nokia.maps.map.Polyline(
  points,
  { 
    pen: {
      strokeColor: "#22CA", 
      lineWidth: 5
    }
  }
);

 map.objects.add(polyline);

当前您的示例正在尝试计算从 A 到 B 到 C 到 D .... 到第 500 点的驾驶指令,我怀疑这是否是您想要的。您可以定义的中间点的数量是有限制的,如果我记得的话,大约是 10 个。

您可以使用以下方式zoomTo路线:

map.zoomTo(polyline.getBoundingBox(), false, "default");

关于javascript - 构建具有多个坐标的路线时,Nokia Here map 出现错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24150231/

相关文章:

ios - 使用 MKPolyline 在 MKMapView 中绘制多组线

swift - MSDKUI 2.1.1更新后添加GuidanceManeuverMonitor时语音导航不工作

javascript - Highcharts - Bubblechart - 在绘图的顶部和底部添加填充

javascript - index.html 与任何路由不匹配-react-router-react js

android - 放大特定路线谷歌地图

javascript - 如何将隐藏属性 "draggable"传递给我的组件?

c++ - 如何在 Qt 中使用 HERE api 显示 map ?

javascript - json 对象中的 setState 给出未定义的 [React]

javascript - 如何修复错误; 'Error: Bootstrap tooltips require Tether (http://github.hubspot.com/tether/)'

javascript - 使用 JavaScript 创建元素时,SVG 折线不会显示点