チュートリアル9b
提供: svg2wiki
(版間での差分)
(→meshTileViewerB.html) |
(→meshTileViewerB.html) |
||
7行: | 7行: | ||
*onload=async function() | *onload=async function() | ||
**[[解説書#setShowPoiProperty|svgMap.setShowPoiProperty]]( customShowPoiProperty, layerID); | **[[解説書#setShowPoiProperty|svgMap.setShowPoiProperty]]( customShowPoiProperty, layerID); | ||
− | *** | + | ***紐付いたレイヤーのオブジェクトをヒットしたときに出現する処理に独自のコールバック関数(customShowPoiProperty)に指定する |
− | **async function loadLGdictionary(){ // 自治体名辞書を作る | + | ***customShowPoiProperty |
+ | ****ヒットしたオブジェクトのcontent属性にある市区町村コードをKeyにしてlgDictionaryを辞書引き、自治体名を求める | ||
+ | *****一つのメッシュに複数の自治体が属しているケースがある点に注意 | ||
+ | ****svgMap.showModal(html,400,180); 用意したhtmlをSVGMapフレームワークのモーダルダイアログに渡す | ||
+ | *async function loadLGdictionary(){ // 自治体名辞書を作る | ||
+ | **lgDictionary={};//市区町村コードをKeyとした自治体名辞書 | ||
*function buildMeshTileSvg(meshs, sourceID){ | *function buildMeshTileSvg(meshs, sourceID){ | ||
**rect.setAttribute("content",meshNumb+","+meshs[meshNumb].join(" ")); | **rect.setAttribute("content",meshNumb+","+meshs[meshNumb].join(" ")); | ||
+ | ***meshs[meshNumb] 市区町村コード |
2022年2月10日 (木) 09:13時点における版
チュートリアル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(" "));