チュートリアル13

提供: svg2wiki
2022年2月17日 (木) 05:11時点におけるAdmin (トーク | 投稿記録)による版

移動: 案内, 検索

目次

チュートリアル13 WebApp Layer WMS 伸縮スクロールに応じた表示

WMS(Web Map Service)を使って、表示している領域の地図を伸縮スクロールに応じて表示する機能を持つレイヤーをWebApp Layerとして実装します。WMSとしてはチュートリアル12に引き続きGEBCO Web Serviceを使用します。

wms2.html

これまでと特に変わったところはありません。

Container.svg

これまでと特に変わったところはありません。

wms_dynamic.svg

  • data-controller="wmsController.html" このレイヤーにWebApp("wmsController.html)を紐付けています
    • WebAppではWMSのコンテンツを表示するためのDOM操作を行っています。
  • image要素はダミーです(xlink:href属性がないので表示されない)
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="120,-50,30,30" data-controller="wmsController.html#exec=appearOnLayerLoad">
 <globalCoordinateSystem srsName="http://purl.org/crs/84" transform="matrix(1,0,0,-1,0,0)"/>
 <image id="wmsImage" preserveAspectRatio="none" opacity="0.5" />
</svg>

wmsController.html

個人用ツール
名前空間

変種
操作
案内
ツール
Translate