mapkit.PolylineOverlay

A polyline is a shape made up of one or more connected line segments defined by a set of points. The first and last points do not connect to each other.

The longitude of all points should be within a 360º degree range. Depending on how you specify the longitude, a line between Tokyo and Los Angeles created with a mapkit.PolylineOverlay may take a different route. Specifying a longitude of -118º for Los Angeles and 140º for Tokyo will result in a very long line spanning 258º. Specifying a longitude of 242º (i.e., -118 + 360) for Los Angeles and 140º for Tokyo will result in a shorter line spanning 98º. If the range of longitudes is larger than 360º, the result of the rendering is undefined.

All style properties apply to polyline overlays except fillColor, fillOpacity, and fillRule. Properties that don't apply are ignored. mapkit.PolylineOverlay doesn't implement methods of its own. For more information, see the base object, mapkit.Overlay.

The following example shows a polyline object added to the map.

var points = [ [10, 1], [5, 6], [1, 1] ];
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);