チュートリアル3b

提供: svg2wiki
(版間での差分)
移動: 案内, 検索
(データを変換)
(チュートリアル3b SVGMapToolsを用いたタイル作成とその表示)
3行: 3行:
 
'''工事中'''
 
'''工事中'''
  
実際の動作は[http://svg2.mbsrv.net/devinfo/devkddi/tutorials/tutorial3b/tutorial4b.html こちら]をクリック。
+
実際の動作は[http://svg2.mbsrv.net/devinfo/devkddi/tutorials/tutorial3b/tutorial3b.html こちら]をクリック。
  
 
== タイリングされたコンテンツの準備 ==
 
== タイリングされたコンテンツの準備 ==

2023年4月11日 (火) 09:55時点における版

目次

チュートリアル3b SVGMapToolsを用いたタイル作成とその表示

工事中

実際の動作はこちらをクリック。

タイリングされたコンテンツの準備

  • この章では、svgMapToolsを用いて、shapefileからタイリングされた地図コンテンツを準備し、それを表示します。

そのため、svgMapToolsの設定を含むチュートリアルを先ず実施してください。

  • 本チュートリアルでは、国土地理院の地球地図 日本のデータ(ファイル形式:shapefile、ベクトル地理データ)を表示してみます。

SVGMapToolsの設定

ソースデータのダウンロード

データを変換

Shapefileから、SVGMapのタイリングされたコンテンツを生成します。

tutorial3b.html

基本的に、チュートリアル2bで使用したtutorial2b.htmlと同様です。

Container.svg

チュートリアル1と同様のCoastline.svgと重ね合わせて表示するビットマップイメージのbitmapImage.svgを読み込む。

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="122.9800817, -45.398095, 21.97626, 21.0533039" >
 <globalCoordinateSystem srsName="http://purl.org/crs/84" transform="matrix(1,0,0,-1,0,0)" />

<!-- 日本の海岸線データのSVGファイルを表示状態として読み込む -->
<animation xlink:href="Coastline.svg" x="-3000" y="-3000" width="6000" height="6000" title="Japan Coastline" visibility="visible"/>
<!-- ビットマップイメージのSVGファイルを表示状態として読み込む -->
<animation xlink:href="bitmapImage.svg" x="-3000" y="-3000" width="6000" height="6000" title="Bitmap Image SVG" visibility="visible"/>

</svg>

Coastline.svg

bitmapImage.svg

個人用ツール
名前空間

変種
操作
案内
ツール
Translate