HERE maps for JavaScript API: How to calculate route?

Viewed 1020

I wanna implement in my project option to draw route on the map using HERE maps api, I read documentation and saw few examples and if I implement it all global and push static route to calculate distance like that:

    const platform = configPlatform();
    const defaultLayers = configLayers();
    var markers = [];
    var map = new H.Map(
    document.getElementById('mapContainer'),
    defaultLayers.vector.normal.map,
    {
      zoom: 10,
    }
    );

    var mapEvents = new H.mapevents.MapEvents(map);
    var behavior = new H.mapevents.Behavior(mapEvents);
    var icon  = setCustomMarker();

    const lineString = new H.geo.LineString();
    var polyline;
    var routingService = platform.getRoutingService();
    var routingParameters = {
    'mode': 'fastest;car',
    'waypoint0': 'geo!50.1120423728813,8.68340740740811',
    'waypoint1': 'geo!52.5309916298853,13.3846220493377',
    'representation': 'display'
    };

    routingService.calculateRoute(routingParameters, success => {
    console.log(success);
    });

It works fine, but I wanna do everything in functions (instantiate platform must be global and it's ok). First of all I wanna by navigator configure center of map (current user position) and next by event listener give user possibility to add markers to map and it all works but if I wanna next push data to routing service and calculate route between markers and whole distance I get following error:

Uncaught (in promise) TypeError: c is not a function at eval(eval at (mapsjs-core.js:70), :64:238)

Even if I just call method routingService.calculateRoute() inside eventlistener I get the same error.It looks like something in calculateRoute function must be instantiate in time map loading because it works ok when I calculateRoute next to loading map but if I use that function I listener It doesn't work. Somebody had any idea how to make it possible to run this method in listener (instantiate globally routing service doesn't help) ??

2 Answers

I tried your code with little update in calculateRoute callback and all worked perfectly:

routingService.calculateRoute(routingParameters, success => {
    console.log(success);
});

If the problem persists, please attach a link to simple working example with this issue.

Recently I created simple jsfiddle example for adding routing waypoints on contextmenu (right-click) event callback, maybe it could also help you.

And I configure that the externals libs weren't problem. I could run the same code page without any custom code of twig and assets and one page deployed on lamp server works properly. Second one identical copy deployed on symfony server still had error in js console

Uncaught (in promise) TypeError: c is not a function at eval(eval at (mapsjs-core.js:70),"

If I try read error after reject by console log I get:

Error: [] https://route.ls.hereapi.com/routing/7.2/calculateroute.json?xnlp=CL_JSMv3.1.12.0&apikey=(my api key here)=fastest%3Bcar&waypoint0=geo!50.1120423728813%2C8.68340740740811&waypoint1=geo!52.5309916298853%2C13.3846220493377&representation=dragNDrop request failed at eval (eval at (mapsjs-core.js:70)

When I click into link I had a lot of numbers and on the end distance so the error response looks for me like success response. That's realy odd for me. I thought symfony server cannot ingerate in js on client side. Someone had any possibilities what is wrong ??

Related