Azure Maps モジュール

メモ

Dynamics 365 Commerce の小売関連グループは、Yammer から Viva Engage に移行しました。新しいViva Engage コミュニティにアクセスできない場合は、追加するフォーム (https://aka.ms/JoinD365commerceVivaEngageCommunity) に入力し、最新のディスカッションに参加してください。

この記事では、Microsoft Dynamics 365 Commerce で Azure Maps モジュールを構成する方法について説明します。

Azure Maps モジュールは、Azure Maps マップコントロールを使用してレンダリングされる対話型マップ上のストアの場所を示します。 Azure Maps API キーが必要であり、コマース本社の共有パラメーターページに追加する必要があります。 Azure Maps モジュールには、道路、航空写真、ストリートサイドなどのさまざまなビューが用意されており、ユーザーはマップの場所を表示するために選択できます。 Azure Maps モジュールでは、ズームインやズームアウト、ユーザーの位置の使用などの操作も可能です。

Azure Maps モジュールは、ストアセレクターモジュールと連携して、マップにレンダリングする必要がある店舗の地理的な場所を決定します。ストアセレクターモジュールとAzure Mapsモジュールは、ユーザーがサイトページ上のいずれかのモジュールでストアを選択したときに対話します。 Azure Maps モジュールは、ストアセレクターモジュールとの対話以外のシナリオに合わせてカスタマイズおよび拡張できます。

メモ

Azure Maps モジュールは、Dynamics 365 Commerce バージョン 10.0.45 リリース時点で使用できます。

次の図は、ストアの場所ページで使用されるAzure Maps モジュールの例を示しています。

店舗セレクターモジュールの例。

モジュールプロパティ

プロパティ名	値	内容
ヘッダー	テキスト	モジュールのヘッダー。
押しピンオプション: サイズ	数値	押しピンのサイズを指定します。
押しピンオプション: 既定のアイコン色	文字列	マップ上の押しピンシンボル色のテキストまたは 16 進値。
押しピンオプション: 選択アイコンの色	文字列	マップ上の選択された押しピンシンボル色のテキストまたは 16 進値。
インデックスの表示	True または False	このプロパティを True に設定すると場、店舗を示すすべての押しピン記号にインデックスが表示されます。このインデックスは、店舗セレクターモジュールが表示するリストビューのインデックスと一致します。

サイトのコンテンツセキュリティポリシー (CSP) ディレクティブに許可されたマッピング URLを追加する

Azure Maps モジュールがAzure Mapsと対話するには、サイトのコンテンツセキュリティポリシー (CSP) ごとに次のマッピング URL が許可されていることを確認する必要があります。この設定は、Commerce サイトビルダーで、さまざまなサイト CSP ディレクティブ (img-src など) に許可された URL を追加することによって実行されます。詳細については、コンテンツセキュリティポリシーを参照してください。

child-src ディレクティブに "blob:" を追加します。
connect-src ディレクティブに https://atlas.microsoft.com/ と https://js.monitor.azure.com/ を追加します。
font-src ディレクティブに https://atlas.microsoft.com/ を追加します。
script-src ディレクティブに https://atlas.microsoft.com/ を追加します。
style-src ディレクティブに https://atlas.microsoft.com/ を追加します。