Maplat Coreでマーカーの画像を変更する（ピン単位）

Maplat Advent Calendar 8日目は、Maplat Coreでマーカーの画像を変更する方法です。
まずは、ピン単位でマーカー画像を置き換える方法です。
今日の動くものはここで確認できます。 => CodeSandBox Maplat Advent Calendar day 8

今日のベースは静的POI指定の6日目のコードをベースに改造しますが、動的定義でも同じ設定を動的に追加すれば動作します。

まずは、置換え用ピン画像であるところのparts/blue_marker.pngとparts/red_marker.pngを追加しましょう。
続いて、今日はピン単位でのマーカー指定方法ということで、ピン毎にマーカーが変わっているのをわかりやすくするため、POIを一つ追加しました。

poi.json

{
  "main": {
    "pois": [
      {
        "id": "castle",
        "lat": 36.243881,
        "lng": 139.543517,
        "name": "館林城",
        "icon": "parts/blue_marker.png",
        "selected_icon": "parts/red_marker.png"
      },
      {
        "id": "shrine",
        "lat": 36.25163,
        "lng": 139.528562,
        "name": "愛宕神社"
      }
    ]
  }
}

見ていただいて分かる通り、1つ目のPOIにicon属性及びselected_icon属性が指定されていますが、これにより、1つ目のPOIのみマーカー画像が差し変わります。

明日は、POIレイヤー全体でマーカー画像を差し替える方法について説明します。