2022年2月15日 (火) 09:54時点における版

チュートリアル9b WebApp Layer メッシュタイル(カスタムダイアログ)

チュートリアル9に加えて、メッシュをクリックしたときに出現するダイアログをカスタマイズしてみます。

異なるのはレイヤーに紐付いたwebAppです。

onload=async function()
- svgMap.setShowPoiProperty( customShowPoiProperty, layerID);
  - 紐付いたレイヤーのオブジェクトをヒットしたときに出現する処理に独自のコールバック関数(customShowPoiProperty)に指定する
  - customShowPoiProperty
    - ヒットしたオブジェクトのcontent属性にある市区町村コードをKeyにしてlgDictionaryを辞書引き、自治体名を求める
      - 一つのメッシュに複数の自治体が属しているケースがある点に注意
    - svgMap.showModal(html,400,180); 用意したhtmlをSVGMapフレームワークのモーダルダイアログに渡す
async function loadLGdictionary(){ // 自治体名辞書を作る
- lgDictionary={};//市区町村コードをKeyとした自治体名辞書
function buildMeshTileSvg(meshs, sourceID){
- rect.setAttribute("content",meshNumb+","+meshs[meshNumb].join(" "));
  - meshs[meshNumb] 市区町村コード

@@ 1行目: / 1行目: @@
 = チュートリアル9b WebApp Layer メッシュタイル(カスタムダイアログ)=
 [[チュートリアル9]]に加えて、メッシュをクリックしたときに出現するダイアログをカスタマイズしてみます。
+* 実際の動作は、[https://svgmap.org/devinfo/devkddi/tutorials/mesh2b/mesh2b.html こちら]をクリック。
+* [https://svgmap.org/devinfo/devkddi/tutorials/mesh2b/ ソースコードのディレクトリ]
 異なるのはレイヤーに紐付いたwebAppです。