チュートリアル10

提供: svg2wiki
(版間での差分)
移動: 案内, 検索
(ページの作成:「= チュートリアル10 WebApp Layer WebApp Layer メッシュデータのビットイメージ化= メッシュデータ(グリッドデータ)は[[チュートリ...」)

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

チュートリアル10 WebApp Layer WebApp Layer メッシュデータのビットイメージ化

メッシュデータ(グリッドデータ)はラスターデータとも呼ばれるように、Webコンテンツとして使われるビットイメージデータとほぼ同等です。そこでメッシュデータを動的にビットイメージコンテンツ(PNG形式)化し地図画面上に表示するWebAppを構築してみます。性能面でのメリットがあります。

特徴的なコードはレイヤーに紐付いたwebAppにあります。

使用するデータ

地理院が公開するジオイド高データ(TEXTデータ)を使用します。

このデータの詳細な仕様は上記サイトで配布されているパッケージ内に記載されていますが、基本的にはテキストのRaster形式です。


meshTileViewerB.html

  • 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] 市区町村コード
個人用ツール
名前空間

変種
操作
案内
ツール
Translate