Search code examples
bing-mapsbing-api

How to draw route in bing map from json response of snap to road api of bing


Bing snap to road api - https://learn.microsoft.com/en-us/bingmaps/rest-services/routes/snap-points-to-roads

How to project the response on bing map?


Solution

  • You have to convert the points array into an array of Location objects and then pass that into a polyline to render it on the map as line. For example:

    var coords = [];
    
    response.points.forEach(p => {
        coords.push(new Microsoft.Maps.Location(p.latitude, p.longitude));
    });
    
    //Create a polyline
    var line = new Microsoft.Maps.Polyline(coords, {
        strokeColor: 'red'
    });
    
    //Add the polyline to map
    map.entities.push(line);