チュートリアル9b
提供: svg2wiki
(版間での差分)
(→meshTileViewerB.html) |
(→チュートリアル9b WebApp Layer メッシュタイル(カスタムダイアログ)) |
||
1行: | 1行: | ||
= チュートリアル9b WebApp Layer メッシュタイル(カスタムダイアログ)= | = チュートリアル9b WebApp Layer メッシュタイル(カスタムダイアログ)= | ||
[[チュートリアル9]]に加えて、メッシュをクリックしたときに出現するダイアログをカスタマイズしてみます。 | [[チュートリアル9]]に加えて、メッシュをクリックしたときに出現するダイアログをカスタマイズしてみます。 | ||
+ | |||
+ | |||
+ | |||
+ | * 実際の動作は、[https://svgmap.org/devinfo/devkddi/tutorials/mesh2b/mesh2b.html こちら]をクリック。 | ||
+ | * [https://svgmap.org/devinfo/devkddi/tutorials/mesh2b/ ソースコードのディレクトリ] | ||
+ | |||
+ | |||
異なるのはレイヤーに紐付いたwebAppです。 | 異なるのはレイヤーに紐付いたwebAppです。 |
2022年2月15日 (火) 09:54時点における版
チュートリアル9b WebApp Layer メッシュタイル(カスタムダイアログ)
チュートリアル9に加えて、メッシュをクリックしたときに出現するダイアログをカスタマイズしてみます。
- 実際の動作は、こちらをクリック。
- ソースコードのディレクトリ
異なるのはレイヤーに紐付いたwebAppです。
meshTileViewerB.html
- onload=async function()
- svgMap.setShowPoiProperty( customShowPoiProperty, layerID);
- 紐付いたレイヤーのオブジェクトをヒットしたときに出現する処理に独自のコールバック関数(customShowPoiProperty)に指定する
- customShowPoiProperty
- ヒットしたオブジェクトのcontent属性にある市区町村コードをKeyにしてlgDictionaryを辞書引き、自治体名を求める
- 一つのメッシュに複数の自治体が属しているケースがある点に注意
- svgMap.showModal(html,400,180); 用意したhtmlをSVGMapフレームワークのモーダルダイアログに渡す
- ヒットしたオブジェクトのcontent属性にある市区町村コードをKeyにしてlgDictionaryを辞書引き、自治体名を求める
- svgMap.setShowPoiProperty( customShowPoiProperty, layerID);
- async function loadLGdictionary(){ // 自治体名辞書を作る
- lgDictionary={};//市区町村コードをKeyとした自治体名辞書
- function buildMeshTileSvg(meshs, sourceID){
- rect.setAttribute("content",meshNumb+","+meshs[meshNumb].join(" "));
- meshs[meshNumb] 市区町村コード
- rect.setAttribute("content",meshNumb+","+meshs[meshNumb].join(" "));