mapkit-js - 如何在苹果 mapkit JS 中在完整地图上添加图层

Question

我正在尝试在网络上自定义我的苹果地图（Mapkit JS）。我知道您可以设置地图colorScheme（浅色或深色）。但是有没有更好的方法来定制更多颜色呢？

Answer 1

是的，您可以使用 aPolygonOverlay并为其设置自定义颜色。然后您的地图将以您想要的颜色显示。

// init mapkit
mapkit.init({...});

// init map
const map = new mapkit.Map("mapId", {
  colorScheme: mapkit.Map.ColorSchemes.Light, // mapkit.Map.ColorSchemes.Dark
});

// polygon points
const points = [
  [89.9,90],
  [89.9,0.1],
  [89.9,-90],
  [89.9,-179.999],
  [0,-179.999],
  [-89.9,-179.999],
  [-89.9,-90],
  [-89.9,0.1],
  [-89.9,90],
  [-89.9,179.999],
  [0,179.999],
  [89.9,179.999]
];

// Map the coordinate points to Coordinates:
const coordinates = points.map((point) => new mapkit.Coordinate(point[0], point[1]));
const polygon = new mapkit.PolygonOverlay(coordinates, {
  style: new mapkit.Style({
    lineWidth: 0,
    strokeColor: "transparent", // you can define HEX values as you wish
    fillColor: "#F00F00", // red overlay
  }),
  selected: true
})

// add overlay over the whole map
map.addOverlay(polygon);