ImageLayer

画像レイヤーのクラス

Constructor

new ZDC.ImageLayer(urlTemplate, optionsopt)

画像レイヤーを作成します。
zIndex(重なり順)のdefault値は100。

Parameters

名前 説明
urlTemplate
string
画像レイヤーのURLテンプレート
テンプレート内で指定された以下の文字列は、ライブラリーが適切な値に置き換えてURLを生成し、画像配信サーバーから画像を取得します。
画像取得のリクエストの際に、キャッシュ抑制を目的としてクエリストリングの末尾にタイムスタンプを自動的に付与します。

XYZの場合

  • {z}:XYZのURLの'z'(ズームのレベル)
  • {x}:XYZのURLの'x'(経度方向のタイル番号)
  • {y}:XYZのURLの'y'(緯度方向のタイル番号)
'https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png'
→ 'https://cyberjapandata.gsi.go.jp/xyz/std/4/3/2.png?zwgl_ts=1719454397105'
などのURLで画像を取得します。
→ 本APIでは例えばレベルz=4のデータは3.5以上4.5未満の範囲で描画します。


WMSの場合

CRS(WMS1.3.0ではない場合SRS)の設定はWebメルカトル(EPSG:3857)を呼び出してください。
  • {west}:WMSのURLの'bbox'の1番目の値(西端の経度)
  • {south}:WMSのURLの'bbox'の2番目の値(南端の緯度)
  • {east}:WMSのURLの'bbox'の3番目の値(東端の経度)
  • {north}:WMSのURLの'bbox'の4番目の値(北端の緯度)
'https://gbank.gsj.jp/ows/volcanoes_00001?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&BBOX={west},{south},{east},{north}&CRS=EPSG:3857&WIDTH=&HEIGHT=&LAYERS=geo_A&STYLES=&FORMAT=image/png'
→ 'https://gbank.gsj.jp/ows/volcanoes_00001?SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&BBOX=14543826.245877054,3703221.146360217,14551164.200592432,3710559.1010755976&CRS=EPSG:3857&WIDTH=1998&HEIGHT=1998&LAYERS=geo_A&STYLES=&FORMAT=image/png&zwgl_ts=1719454397105'
などのURLで画像を取得します。

※指定するURLのクエリパラメータにwidthとheightを指定する場合は、optionsのsplitにtrueを指定してください。
options(optional)
Object
default {}
オプション設定
名前 説明
opacity(optional)
number
default 1.0
不透明度
0.0~1.0の実数指定
0
透明
1
不透明
propagation(optional)
boolean
default false
イベントの地図伝搬フラグ
このウィジェット上で起きたイベントをMapにも伝搬させます。
  • true

    Mapのイベントが発生する

  • false

    Mapのイベントが発生しない

split(optional)
boolean
default false
WMSリクエストラスター分割有無フラグ
WMSのみ有効となります。
  • true

    自動的に分割したWMSリクエストラスターを重畳(リクエストパラメータのwidth,heightの値を使用)

  • false

    地図画面上の解像度またはresolutionで指定した解像度で取得したラスターを重畳

resolution(optional)
integer
リクエストタイルの解像度
WMSのみ有効となります。
split=false時のみ有効
指定されない場合は地図画面上の解像度でリクエストします。
minZoom(optional)
number
default 3
リクエストする最小ズームレベル
maxZoom(optional)
number
default 22
リクエストする最大ズームレベル
maxNativeZoom(optional)
number
画像レイヤーのURLテンプレートがXYZの場合のみ有効
MapズームレベルがmaxNativeZoomよりも大きい場合にmaxNativeZoomで取得されるタイルで以降のズームレベルを描画します。
draw(optional)
string
default'high'
アンダーレイ描画オプション
  • 'high'

    背景図の上

  • 'middle'

    背景図の注記と図形の間

  • 'low'

    背景図の下

reduceRequests(optional)
boolean
default false
画像レイヤーリクエスト数低減フラグ
  • true

    画像レイヤーの読み込みをidleイベント発生後のみ行う

  • false

    画像レイヤーの読み込みを地図スクロール・地図サイズ・拡縮・傾き・回転の変更の度に行う

requestHeader
Object
default null
リクエストヘッダ
画像リクエスト時に付与するリクエストヘッダをオブジェクトで指定します。
指定したオブジェクトのkey:valueの内容を、リクエスト時にHTTPヘッダとして送信します。

※オブジェクトのkey,valueともに、String型の指定のみ可能
※JavaScriptAPIの処理内で以下処理を行う
・指定された文字列はISO-8859-1で構成されたものとして扱う
・文字数の制限や接頭辞付与は行わず、指定された文字列をそのままリクエストヘッダとして送信する
・リクエストの事前に、ブラウザによるCORSのPreflightリクエストを行う
※リクエスト先の画像配信サーバーでは上記仕様を前提としたCORSのPreflightリクエストへの応答が必要

指定例)
{ "key": "value", "foo": "bar" }

Methods

show()

表示します。

hide()

非表示にすることができます。

setUrlTemplate(urlTemplate)

画像レイヤーのURLテンプレートを設定します。

Parameters
urlTemplate(string)
URLテンプレート
setZIndex(zIndex)

重なりの順序を設定します。値が同一の図形との重なり順は保証されません。

図形クラス間でのみ有効です。ウィジェットとの重なり順序は保証されません。
図形クラス:Polygon,Polyline,Oval,GroundOverlay,ImageLayer,GLLabel
ウィジェットクラス:Popup,Marker,UserWidget,MarkerCluster,StataicUserWidget

Parameters
zIndex(number) default 100
重なり順
大きい数字であれば手前、小さい場合は奥に配置されます。
Throws
zIndexが0以下の場合、エラーとなります。
setOptions(options)

オプションを設定します。

Parameters
options(Object)
オプション設定。constructorのoptionsと同じ。
addEventListener(eventName, listener)

イベントリスナーを登録します。

Parameters
eventName(string)
イベントの種類を表す文字列。
Map Eventsを参照(マウス操作イベントとタッチ操作イベントのみ対応)
listener(function)
登録するイベントリスナー。
イベントリスナーの引数はMap Eventsを参照して下さい。
Example
imagelayer.addEventListener('click', function(type, latLng, point) {
// 処理
});
removeEventListener(eventName, listener)

登録したイベントリスナーを削除します。

Parameters
eventName(string)
イベントの種類を表す文字列
listener(function)
削除するイベントリスナー
getId()

idを取得します。

Returns
Type:string
idを返却します。
reset()

キャッシュをリセットし画像レイヤーを再描画します。