ZDC.Marker

マーカを作成します。
マーカは重畳画像を重ねて表示することができます。

実装例
マーカを表示する
マーカを表示する(重畳画像有)
マーカに任意の画像を使う
マーカにCSSスプライトを使う
bindを利用してクリックしたマーカの緯度経度を表示する

コンストラクタ

ZDC.Marker(latlon, options)

引数 プロパティ タイプ デフォルト 説明
latlon - ZDC.LatLon - 緯度経度
options color number ZDC.MARKER_COLOR_ID_BLUE_S マーカのデザインをIDで指定
number number 重畳画像なし 重畳画像のデザインをIDで指定
offset ZDC.Pixel ZDC.Pixel(0, 0) (※1) マーカのオフセット値
contentOffset ZDC.Pixel ZDC.Pixel(0, 0) (※2) 重畳画像のオフセット値
propagation boolean false true:イベントが地図に伝播する
false:イベントが地図に伝播しない
custom object null 独自マーカ情報からなるオブジェクト

※1 ・・・ プロパティcolorがデフォルトまたはマーカIDを指定した場合、マーカの先端が指定した緯度経度を示します。
また、マーカに独自画像URLを指定した場合、指定した緯度経度が画像の左上になるように表示されます。
※2 ・・・ デフォルトの位置は重畳画像の左上がマーカの左上と一致します。

メソッド

void moveLatLon(latlon)

マーカの表示位置を設定します。
ただし、このメソッドを実行する前にZDC.MapクラスのaddWidgetを実行してください。

引数 タイプ 説明
latlon ZDC.LatLon 緯度経度

void setTitle(title)

マーカのタイトルを設定します。
実装例

引数 タイプ 説明
title string 文字列

void setZindex(zIndex)

z-indexを設定します。デフォルトのz-indexは100です。

引数 タイプ 説明
zIndex number スタイルのz-index

void hidden()

マーカを非表示にします。


void visible()

マーカを表示します。


ZDC.LatLon getLatLon()

マーカの緯度経度を取得します。

関連項目

customオブジェクト

プロパティ プロパティ タイプ デフォルト 説明
base(※1) src string - 独自画像URL
imgSize ZDC.WH 画像のサイズ 画像の表示サイズ
imgTL ZDC.TL ZDC.TL(0, 0) CSSスプライトを使用する際のイメージの描画始点
printSrc(※3) string srcで指定したURL 印刷画像URL
content(※2) src string - 重畳画像URL
imgSize ZDC.WH 画像のサイズ 画像の表示サイズ
imgTL ZDC.TL ZDC.TL(0, 0) CSSスプライトを使用する際のイメージの描画始点
printSrc(※3) string srcで指定したURL 印刷画像URL

※1)独自のマーカ画像情報からなるオブジェクト
※2)独自の重畳画像情報からなるオブジェクト
※3)印刷画像のサイズがimgSizeと異なる場合の動作は保障しません。また、印刷画像にCSSスプライトは使用できません。

マーカID

ID 説明 イメージ
ZDC.MARKER_COLOR_ID_BLUE_S ピン(青・小) mapicon-color6.gif
ZDC.MARKER_COLOR_ID_RED_S ピン(赤・小) mapicon-color5.gif
ZDC.MARKER_COLOR_ID_GREEN_S ピン(緑・小) mapicon-color7.gif
ZDC.MARKER_COLOR_ID_YELLOW_S ピン(黄色・小) mapicon-color8.gif
ZDC.MARKER_COLOR_ID_GRAY_S ピン(灰色・小) mapicon-color9.gif
ZDC.MARKER_COLOR_ID_BLUE_L ピン(青・大) mapicon-color1.gif
ZDC.MARKER_COLOR_ID_RED_L ピン(赤・大) mapicon-color0.gif
ZDC.MARKER_COLOR_ID_GREEN_L ピン(緑・大) mapicon-color2.gif
ZDC.MARKER_COLOR_ID_YELLOW_L ピン(黄色・大) mapicon-color3.gif
ZDC.MARKER_COLOR_ID_GRAY_L ピン(灰色・大) mapicon-color4.gif
ZDC.MARKER_COLOR_ID_INFO_WHITE_S 吹出し(白・小) mapicon-color26.gif
ZDC.MARKER_COLOR_ID_INFO_BLACK_S 吹出し(黒・小) mapicon-color27.gif
ZDC.MARKER_COLOR_ID_INFO_WHITE_M 吹出し(白・中) mapicon-color24.gif
ZDC.MARKER_COLOR_ID_INFO_BLACK_M 吹出し(黒・中) mapicon-color25.gif
ZDC.MARKER_COLOR_ID_INFO_WHITE_L 吹出し(白・大) mapicon-color22.gif
ZDC.MARKER_COLOR_ID_INFO_BLACK_L 吹出し(黒・大) mapicon-color23.gif
ZDC.MARKER_COLOR_ID_INFO_WHITE_LL 吹出し(白・特大) mapicon-color20.gif
ZDC.MARKER_COLOR_ID_INFO_BLACK_LL 吹出し(黒・特大) mapicon-color21.gif

重畳画像ID

ID 説明 イメージ
ZDC.MARKER_NUMBER_ID_STAR_S 星(小) mapicon-number100.gif
ZDC.MARKER_NUMBER_ID_STAR_L 星(大) mapicon-number0.gif
ZDC.MARKER_NUMBER_ID_1_S
~ZDC.MARKER_NUMBER_ID_30_S
数字(1・小)~数字(30・小) mapicon-number101.gifmapicon-number130.gif
ZDC.MARKER_NUMBER_ID_1_L
~ZDC.MARKER_NUMBER_ID_30_L
数字(1・大)~数字(30・大) mapicon-number1.gifmapicon-number30.gif