Mapboxのベースマップで地図開発を効率化

Mapboxは最近、Mapbox Standard Styleをリリースしました。美しい3Dベースマップの導入に加え、このスタイルは、スタイルの維持に必要な技術的な負担と地図作成の専門知識を軽減します。その結果、地図を構築するための合理化された、より効率的な方法が実現します。さらに、Mapboxは、変更を伴うリスクのある手動アップグレードなしに、最新の地図データとデザインのアップデートをスタイルに配信できるようになりました。この機能を最大限に活用するには、いくつかの重要な概念を理解する必要があります。

基図：改善された基盤

新しいMapbox Maps SDKsにより、「ベースマップ」という概念を確立しています。Mapbox Standardは、このパラダイムに従う最初のものです。ベースマップは、地図エクスペリエンスを構築するための、常に最新の視覚的なキャンバスを提供します。これには、自然の地形、道路、建物、ランドマークなど、地図上で見たいすべての要素が含まれています。また、当社の地図作成者が刷新した魅力的で現代的なデザインを備えており、そのベースマップの上に独自のロケーションエクスペリエンスを追加するためのインターフェイスが改善されています。

インポート：コピーの代わりにスタイルを構成

インポートは、Mapbox Standardのようなベースマップとカスタムレイヤーをまとめます。このシステムにより、単一の長いレイヤーリストを持つモノリシックなスタイルの複雑さが軽減され、ベースマップを常に最新の状態に保つことができます。 

次のスタイルドキュメントは、参照されているスタイルとそれに関連するリソースをロードし、layers配列で指定されたレイヤーとともにレンダリングします。

{
  "version": 8,
  "imports": [
    {
      "id": "basemap",
      "url": "mapbox://styles/mapbox/standard"
    }
  ],
  "layers": [
    // Your layers here
  ]
}

ベースマップのインポートに加えて、独自のスタイルをインポートすることもできます。ここでは、「オーバーレイ」という用語を、単独では使用できないスタイルを指すために使用していますが、ベースマップと一緒に使用することを目的としています。スタイルドキュメントは次のようになります。

{
  "version": 8,
  "imports": [
    {
      "id": "basemap",
      "url": "mapbox://styles/mapbox/standard"
    },
    {
      "id": "water-levels",
      "url": "mapbox://styles/kkaefer/clgsj2qnlra7x3gd81yu5t3yg"
    }
  ]
}

スロット：データを地図の上に重ねるだけでなく、地図の中にも追加

複数のパーツからスタイルを作成できるようになったので、レイヤーが正しい場所に表示されるようにする方法が必要です。スロットは、カスタムデータを追加するために最適化された、ベースマップ内の明確に定義されたプレースホルダーです。以前は、120以上のレイヤーのリストを調べて、カスタムレイヤーを正確にどこに配置するかを決定する必要がありました。ランタイムスタイリングを使用してアプリに新しいレイヤーを動的に追加する場合は、さらに複雑でした。ベースマップから適切なレイヤーを特定し、関数引数として使用する必要があったためです。これらの参照レイヤーの名前が変更または削除され、実装が中断されることがありました。

スロットを使用すると、スタイル内の正しい位置にレイヤーを直接配置できます。ランタイムスタイリングを使用する場合は、同じスロット名を使用できます。スロットはスタイルの公式APIの一部になったため、ベースマップが更新されても、引き続き動作することを期待できます。

{
  "imports": [
    {
      "id": "basemap",
      "url": "mapbox://styles/mapbox/standard"
    }
  ],
  "sources": {
    "geojson": {
      "type": "geojson",
      "data": { /* ... */ }
    }
  },
  "layers": [
    {
      "id": "area",
      "type": "symbol",
      "source": "geojson",
      "slot": "top",
      "layout": {
        "text-field": ["get", "name"],
        "text-size": 30,
        "text-font": ["DIN Pro Bold", "Arial Unicode MS Bold"]
      },
      "paint": {
        "text-color": "black",
        "text-halo-color": "white",
        "text-halo-width": 3
      }
    }
  ]
}

インポートされたスタイルをカスタムレイヤーと組み合わせると、新しいMaps SDKは、カスタムレイヤーがラベルを覆い隠さないようにするなど、目的の位置でベースマップにレイヤーを織り込みます。

当社の新しいStandard Styleは、3つのスロットを定義します。bottom、middle、およびtop。

• ボトム:パス、建物、モデル、ラベルの下の領域をハイライトします。 
• ミドル:パスや道路の上、建物やモデル、ラベルの下をカバーしたり、線を追加したりする。
• top: POIレイヤーより上位、PlaceおよびTransitラベルより下位に位置データを配置します。これにより、Mapbox POIレイヤーを表示し、PlaceおよびTransitラベルとの衝突を回避しながら、カスタムシンボルラベルレイヤーの優先順位付けが可能になります。

カスタムレイヤーにスロットが指定されていない場合、そのレイヤーはレイヤーリストの最上部に配置され、他のすべてのレイヤーと比較して最も高い衝突優先度を持つ場所が提供されます。

以下の地図には、指定されたスロットに挿入された次のカスタムレイヤーがあります。

• 駐車禁止区域レイヤーは、"slot": "bottom"に設定されています
• ルート線レイヤーは、"slot": "middle"に設定されています
• 駐車禁止標識レイヤーは、"slot": "top"に設定されています
• puckとdestination pinについては、「slot」は指定されていません。これらのアイコンは、スタイル内の既存のすべてのレイヤーの上に配置されます。

構成：要件に合わせてデザインを調整

最後に、構成オプションを使用すると、インポートされたスタイルのさまざまな側面をカスタマイズできます。スタイルは、パブリックスキーマで構成オプションを宣言できるようになりました。これらは、スタイルをインポートするときに設定するか、クライアントで実行時に変更できます。個々のレイヤーは、構成された値に基づいて外観を変更するために構成オプションを使用できます。構成オプションは、スタイルのパブリックAPIの一部でもあります。

新しいMapbox Standardスタイルには、次の構成オプションがあります。

• showPlaceLabels: 国名、州、都市、地区などの地名を表示するかどうか。
• showRoadLabels: 道路名を表示するかどうか。
• showPointOfInterestLabels: 店舗、カフェ、レストランなどのPOIを表示するかどうか。
• showTransitLabels: バス、電車、または地下鉄の駅のラベルを表示するかどうか。
• ライトプリセット:4つの照明オプションを提供します、 夜明け, 正午, 夕暮れそして 夜.
• フォント:マップ全体でカスタムフォントを選択できます。

これにより、ベースマップのカスタマイズの力がクライアントにもたらされます。Mapbox Standard が一般的に利用可能になると、Studio でベースマップをカスタマイズし、スタイルとして保存できます。クライアント側でこれらの変更を行うこともできます。構成オプションはスタイルによって定義され、時間の経過とともに拡張できます。

例として、以下のlightPresetの構成オプションであるdawn、noon、dusk、nightをご覧ください。

この例では、ランドマークと交通機関のラベルをオフにしました。

{
  "showPointOfInterestLabels": false,
  "showTransitLabels": false,
  "showPlaceLabels": true,
  "showRoadLabels": true
}

アップグレードなしでベースマップを更新

新しいベースマップ、カスタムデータレイヤーを挿入するための最適化されたスロット、および制御された構成オプションにより、さらに強力な機能が実現しました。Mapboxはベースマップへの更新をプッシュできるようになりました。新しいデータ機能、視覚的な改善、および新しい構成オプションは、変更を中断するリスクのある手動更新なしに、スタイルでアクセスできるようになります。

すべてをまとめて

ベースマップ、インポート、およびスロットは、Mapboxを使用したマップの構築方法を合理化すると同時に、強力な可能性とワールドクラスのマップエクスペリエンスを提供します。Mapbox Standardを使用して、この新しいパラダイムを試してみることをお勧めします。

Mapbox Standardは現在、最新バージョンのMaps SDKsのプレリリース版で利用可能です。これらの最新バージョンへの移行方法については、Webマップの場合はGL JS v3移行ガイド、iOSおよびAndroidの場合はMobile Maps SDKs v11移行ガイドをご覧ください。

Mapboxの使用を開始するには、Mapboxアカウントにサインアップし、上記の移行ガイドで最新バージョンに関する情報を参照してください。