AX - マップ
概要
AX - マップ は、Experience Sites ページ上で Salesforce レコードをインタラクティブな位置マーカーとして表示する Experience Cloud コンポーネントです。
住所フィールドまたは緯度/経度座標に基づいて、ポータルユーザーに場所を表示するために使用します。たとえば、近隣のサービス拠点、顧客サイト、店舗検索結果、イベント会場などです。ユーザーはマーカーをクリックしてレコードの詳細を確認し、レコードへ移動できます。Experience Builder で標準オブジェクトまたはカスタムオブジェクトのいずれからでも位置データを取得できます。
店舗検索、サービスエリアの地図、イベント会場検索、顧客近接ビュー、またはポータルユーザーが地理データを視覚化する必要があるあらゆる場面に最適です。
Avonni Map は リアクティブデータコンポーネントです
はじめに
この簡単なチュートリアルで、Map コンポーネントの基本を学び、ユースケースの作成を始めましょう。
チュートリアル
Avonni Map を使用して Experience Cloud にレコードを表示する方法を学びます。
マップの設定
設定プロセス、特に Data Source と Data Mappings のセクションを理解することは、このコンポーネントを効果的に使用するうえで重要です。
データソースの設定
Data Source セクションでは、Avonni Map を Salesforce データに接続します。方法は 2 つあります。
手動データソース
データを手動でデータテーブルに入力します。
動的でないデータ、テスト、デモに最適です。
クエリ
クエリを作成して、Salesforce データでテーブルを自動的に埋めます。
動的、リアルタイム、大規模なデータセットに適しています。
データマッピングの設定
Data Mappings セクションでは、フィールドのマッピング方法を指定することで Map コンポーネントを有効化できます。これには、Data Source 設定の位置座標などのフィールドを、関連するマップ属性に対応付ける作業が含まれます。
Avonni Map とのデータモデル共有
Salesforce のデータ共有ルールの遵守:
組織設定の尊重: Avonni コンポーネントは、Salesforce 組織の既存のデータ共有設定とアクセス設定に完全に準拠しています。
干渉しない方針: これらのコンポーネントは、あらかじめ設定されたデータ共有ルールをいかなる形でも変更または影響しません。
制御された表示とアクセス: Avonni コンポーネントを通じてレコードを表示・操作できるかどうかは、組織で定義された共有設定とユーザー権限によって管理されます
特に場所をマッピングする場合は、Data Mappings を正しく設定するために Location セクションに重点を置く必要があります。その理由は次のとおりです。
データマッピングの設定: Map コンポーネントが正しい情報を表示するには、Salesforce のデータフィールドを対応する位置ラベルにマッピングする必要があります。たとえば、番地を含む Salesforce フィールドを Map コンポーネントの 'street' ラベルに、都市名を 'city' ラベルに、というように対応付けます。
正確性の重要性: 正確なマッピングは非常に重要です。間違った Salesforce フィールドを位置ラベルに割り当てると、Map コンポーネントに誤った情報が表示される可能性があります。たとえば、'city' フィールドを誤って 'postal code' ラベルにマッピングすると、マップ上にはまったく別の都市、場合によっては別の国の場所が表示されることがあります。
フィルター
Filters 属性では、マップコンポーネントに表示されるマーカーを絞り込むために、フィルター対象の特定のフィールドを選択できます。
その他の設定
リストビュー
この機能では、場所の一覧を表示または非表示にできます。使用可能な値は visible、hidden、または auto です。既定値は auto で、複数のマーカーがある場合にのみ一覧を表示します。
ズームレベル
マップコンポーネントでは、ズームレベルを調整して世界全体から個々の建物まで、さまざまな範囲に焦点を当てることができます。ズームレベルを設定しない場合、マップは自動的に調整され、配置したすべてのマーカーが表示されます。
プロパティパネルには、ズームを手動で設定するオプションがあります。ズームレベルの範囲は、デスクトップブラウザーでは 1 から 22、モバイルデバイスでは 1 から 20 です。
各ズームレベルで一般的に何が表示されるかを簡単に示します。
レベル 1: 世界全体
レベル 5: 大陸または大きな陸地
レベル 10: 都市
レベル 15: 通りレベルの詳細
レベル 20: 個々の建物
Google Maps API のドキュメントの ズームレベル を参照して、より詳しい情報を確認してください。
Map コンポーネントの UI 動作
これらの設定を使うと、ユーザーがマップとどのように操作するかを制御でき、より洗練されて集中しやすいユーザー体験を提供できます。特定のズームやドラッグ機能を無効にすることから、検索バーやフッターのような便利な機能を追加することまで、各設定には明確な目的があります。
ドラッグを無効化
クリック＆ドラッグによるマップの移動を防ぎ、固定位置に保ちます。
ズームコントロールを非表示
ズームイン/ズームアウトのコントロールを削除し、マップのズームレベルを一定に保ちます。
スクロールホイールでのズームを無効化
マウスホイールによるズームイン/ズームアウトを停止し、安定したズームレベルを確保します。
ダブルクリックによるズームを無効化
マップをダブルクリックしてもズームインしないようにし、固定ズームレベルを維持します。
デフォルト UI を無効化
ストリートビュー切り替えなどの標準的なマップインターフェース要素を削除し、よりすっきりとした表示にします。
フッターを表示
マップ上にフッターを表示し、マップデータの出典や凡例などの追加情報を示します。
検索可能
マップに検索バーを追加し、ユーザーが特定の場所や地点を簡単に見つけてズームインできるようにします。
マップの中心位置
マップ上に複数のマーカーがある場合、すべてのマーカーの中央付近にある中心点を自動的にフォーカスします。この点は、それぞれの位置に基づいて計算されます。
Interactions
Map コンポーネントには、「選択時」インタラクションがあります。この機能では、ユーザーがマップマーカーをクリックしたときに実行するアクションを指定できます。
画面上に短いポップアップ通知を表示し、地図マーカーをクリックした後にすばやいフィードバックや情報を提供します。
ユーザーをサイト内の別ページまたは URL にリダイレクトし、クリックした場所に関するより詳細な情報へ誘導します。
アラートメッセージを含むモーダルウィンドウを開き、選択した場所に関する重要な情報や警告を表示します。
確認ダイアログボックスを起動し、イベント参加のように追加のユーザー確認が必要な操作に使用します。
Salesforce Flow を実行するダイアログを開き、クリックした場所に関連するワークフローやプロセスを開始します。
設定
リストタイトル
マップリストのタイトルを設定します。
リストビュー
この機能は、ユーザーがマップ上の場所や項目の詳細な一覧を確認するのに特に便利です。
自動: 最適な表示を自動的に判定します。
表示: リストビューを常に表示したままにします。
非表示: リストビューを非表示にします。
ズームレベル
ズームレベルの範囲は、デスクトップブラウザーでは 1 から 22、モバイルデバイスでは 1 から 20 です。
各ズームレベルで一般的に何が表示されるかを簡単に示します。
レベル 1: 世界全体
レベル 5: 大陸または大きな陸地
レベル 10: 都市
レベル 15: 通りレベルの詳細
レベル 20: 個々の建物
ドラッグを無効化
ユーザーがマップビューをドラッグできないようにします。
ズームコントロールを非表示
マップからズームイン/ズームアウトのコントロールを削除します
スクロールホイールでのズームを無効化
マウスのスクロールホイールによるズームをオフにします
ダブルクリックを無効化
ダブルクリックでマップがズームインしないようにします
デフォルト UI を無効化
よりすっきりした見た目にするため、標準の Google Maps インターフェースを削除します
フッターを表示
Map コンポーネントにフッターセクションを追加します
検索可能
マップ内で検索機能を有効化します
データソース
手動: マップマーカーを手動で追加します。
クエリ: データマッピング付きの Salesforce データを使用して、マーカーを自動配置します
マップの中心位置
マップの初期中心点を指定します
フィルタリングオプション
ポップオーバーとして表示されるマップのフィルターを設定します
検索オプション
プレースホルダー: 入力前に検索バーに表示されるテキスト。
位置: 検索バーの位置として、左、右、中央、または全幅から選択します
サイズ
幅と高さ: マップコンポーネントの寸法を指定します。
"オーバーフローとは、コンテナの境界を超えたコンテンツがどのように処理または表示されるかを指します。レイアウトコンポーネント内のコンテンツが、割り当てられた寸法（高さと幅）に収まらないほど大きい場合、overflow 設定によって余分なコンテンツがどうなるかが決まります。
オーバーフロー: オーバーフローしたコンテンツの管理方法を制御します。
ユースケース例
例 1: リアクティブなアカウントマップ
ユーザーの選択に即座に応答するインタラクティブなマップで、アカウントデータを活用しましょう。Map コンポーネントを Accounts Data Table に接続すると、担当者が任意のアカウントレコードをクリックした瞬間に、正確な請求先住所を表示できます。
達成できること
コンテキスト対応マッピング: データテーブルで担当者が選択した内容に基づいて、選択されたアカウントの請求先住所を表示するように、マップが自動更新されます
効率化されたアカウントナビゲーション: 担当者はページを離れることなく、視覚的にアカウントを見つけられます
始める前に
Accounts Data Table コンポーネント: API 名が
AccountsTable
設定方法
例 2: 顧客注文の追跡
顧客に、注文が現在どこにあるのかをリアルタイムで可視化しましょう。Order オブジェクトから地理位置データを直接マッピングすることで、顧客に常に状況を知らせる、透明で直感的な追跡体験を構築できます。
達成できること
注文のライブ可視化: 顧客は、注文の現在位置がインタラクティブなマップ上に表示されるのを確認できます
透明性による信頼: 明確で視覚的な追跡体験により、サポート問い合わせが減り、顧客満足度が向上します
始める前に
カスタムのジオロケーションフィールド: リアルタイム追跡座標を保存するために、Order オブジェクト上にカスタムのジオロケーションフィールドが作成されていることを確認します
設定方法
最終更新
役に立ちましたか？