mapkit JS：如何绘制多坐标折线

Question

I am trying to draw polyline on apple map with mapkit js. Unable to show anything on map.

My project is consist of many location on the map. All the markers are there on the map, clicking on the one marker will open the info-window and draw a polyline on the map itself.

map = new mapkit.Map("map");
function plottrailsCompound(data,map){
    if(data.reststatus.status == "OK"){
        if(annotations){
            map.removeAnnotations(annotations); 
            annotations = [];
        }
        var landmarkAnnotationCallout = {
            calloutElementForAnnotation: function(annotation) {
            var cccDiv = calloutForLandmarkAnnotation(annotation,map);
            return cccDiv;
            },
            calloutAppearanceAnimationForAnnotation: function(annotation) {
            return "scale-and-fadein .4s 0 1 normal cubic-bezier(8, 1, 0, 1.5)";
            }
        };
    }
}
function calloutForLandmarkAnnotation(data,map){
    DrawPolyLine(map);
}
function DrawPolyLine(map){
    var points = [[37.73438, -119.56517], [37.73435, -119.56513], [37.73431, -119.56509]];
    var coords = points.map(function(point) {
        return new mapkit.Coordinate(point[0], point[1]);
    });
    var style = new mapkit.Style({
        lineWidth: 2,
        lineJoin: "round",
        lineDash: [8, 4],
        strokeColor: "#F0F"
    });
    var polyline = new mapkit.PolylineOverlay(coords, { style: style });
    map.addOverlay(polyline);
}

I am drawing my info window in calloutForLandmarkAnnotation , which i am not showing over here. DrawPolyLine function has points variable and it has three coordinates but in actual i have more than this. Some has around 100's of coordinates. Please let me know if any other info you guys need to solve this.

Answer 1

map.addOverlay() adds the polyline to the map, but to take the user to where you added the polyline, you will need to also call this function:

map.showItems(polyline);