Function setContextMenu

コンテキストメニューを設定する — 詳細な使用例

地図上で右クリック（または長押し）したときに表示されるコンテキストメニューを設定します。 new GIA.value.ContextMenu(items, options?) でインスタンスを作成し setContextMenu に渡します。 clearContextMenu でコンテキストメニューを削除できます。

ContextMenuItem

プロパティ	型	説明
text	string	メニューに表示するテキスト
onselect	(e: ContextMenuEvent) => void	メニュー項目選択時のコールバック

ContextMenuEvent のフィールド:

• e.position — クリックした地点の LatLng
• e.native — 元の MouseEvent

ContextMenuOptions（第2引数・任意）

プロパティ	型	デフォルト	説明
hideWhenZoomChange	boolean	true	ズームレベル変更時にメニューを非表示にするか

Note

• 設定できるコンテキストメニューは1件のみです。再設定すると上書きされます。
• clearContextMenu でコンテキストメニューを完全に削除できます。

Warning

• コンストラクタの第1引数は 配列（ContextMenuItem[]）です。オブジェクト形式は誤りです。
• 各項目のキーは text / onselect です。label / onClick は存在しません。
• onselect の引数 e から e.position で LatLng を取得してください。

Example: 右クリック時に「ここを中心に表示」メニューを表示する

import * as GIA from '@ntj/gaia';

map.setContextMenu(new GIA.value.ContextMenu([
  {
    text: 'ここを中心に表示',
    onselect(e) {
      map.setCenter(e.position);
    },
  },
  {
    text: 'この位置をコピー',
    onselect(e) {
      navigator.clipboard.writeText(`${e.position.lat},${e.position.lng}`);
    },
  },
]));

// 後から削除
map.clearContextMenu();
Copy

See

• setContextMenu
• clearContextMenu