ガイドAPIリファレンス
ガイド

屋内地図をWebアプリケーションに追加する方法

インタラクティブなアプリケーションを作成するためのクラスとメソッドを含むHERE Maps API for JavaScriptを使用すると、Webベースのアプリケーションやサービスを構築できます。HEREの地図とサービスを屋内地図と組み合わせて、独自のサービスを構築することができます。

詳細とコードサンプルについては、「HERE Maps API for Javascript開発者ガイド」を参照してください。

HERE Maps API for JavascriptでIndoor Mapを使用する

HERE Maps API for Javascriptで屋内地図を使用するには、次の情報が必要です。

  • APIキー
  • Indoor Map ID
  • 任意:コレクションカタログHRN

APIキーおよびコレクションカタログHRN (オプション) は、施設サービスクラスをインスタンス化する際に、オプションタイプで設定します。Indoor Map IDは、特定の屋内地図にアクセスするためにloadVenueを呼び出す際に必要になります。

📘

HERE Maps API for JavaScript - Get Started documentation](HERE Maps API for JavaScript - 利用開始ドキュメント) で説明されているように、同じAPIキーは、プラットフォームクラスをインスタンス化する際に使用されます。

パラメーターを次のように設定します。

  • APIキー - デフォルトの地図コレクションアプリ用に発行されたAPIキーを使用します。 APIキーを作成するには、次の手順に従います。
    • HEREアカウントを使用してHEREプラットフォームにサインインします。
    • ランチャーから[アクセスマネージャー]を開きます。
    • [アプリ]タブを選択します。
    • [Show All apps](すべてのアプリを表示) を選択して、デフォルトの地図コレクションアプリを見つけます。デフォルトのマップコレクションアプリが表示されない場合は、HERE営業担当にご連絡のうえ、アクセス権を取得してください。
    • このアプリのAPIキーを作成します。APIキーを作成するには、すべてのアプリとリソースに対して管理権限が有効になっている組織管理者またはリソース管理者である必要があります。
  • 屋内地図ID - loadVenueに設定します。詳細については、下記「Indoor Mapの検出」を参照してください。
  • コレクションカタログHRN (任意)
    • 標準の屋内地図設定を使用する場合は、hrnを明示的に設定する必要はありません。HERE Maps API for Javascriptがこれを処理します。ただし、問題が発生したり、屋内地図を読み込むカタログを明示的に設定したりする必要がある場合は、hrnパラメーターを使用します。
    • hrnパラメーターを使用するには、HEREプラットフォームのランチャーからDataを選択し、コレクションを検索して、屋内ポータルのフロントページまたはHEREプラットフォームから、デフォルトの屋内地図コレクションカタログHRNを見つけます。デフォルトのコレクションカタログHRNをコピーします。
📘

hrnパラメーターを明示的に指定しない場合は、H.venues.Service2.Optionsのパラメーターtokenにプロジェクトスコープのトークンを指定する必要があります。詳細については、ドキュメントを参照してください。

HERE Maps API for Javascriptの屋内地図の詳細については、「HERE Maps API for Javascriptドキュメント」の「屋内地図の統合」トピックを参照してください。

Indoor Mapsの検出

  • Indoor Map UUIDを屋内ポータルからコピーし、数値の最後の部分を先頭のゼロなしで選択して、Indoor Map IDを取得できます。「概念」を参照してください。
  • 施設サービスクラスgetMapInfoListメソッドを使用し、アクセス可能な屋内地図を一覧表示します。

ベースマップを背景に追加する

ベースマップを追加して背景で表示する場合は、HERE Vector Tileサービスをプロジェクトにリンクする必要があります。HERE Vector Tileサービスをプロジェクトにリンクするには次の手順に従います。

  1. HEREアカウントを使用してHEREプラットフォームにサインインします。
  2. ランチャーから[プロジェクトマネージャー]を開きます。
  3. [Indoor Mapsプロジェクト]を選択します。
  4. [リソース]タブから[サービス]を選択します。
  5. [サービスをリンク]をクリックします。
  6. HERE Vector Tileサービスを検索し、プロジェクトにリンクします。
📘

背景地図を使用すると、追加費用が発生する可能性があります。

HERE Maps API for JavascriptのHERE Indoor Mapリソース

プロジェクトの例はGitHubから入手できます。