Ajax API オプションサービス リファレンス

class GBMap

地図を作成するためのクラスです。

Constructor
Constructor Description
GBMap(container, opts?) 地図のインスタンスを生成します。
地図表示用のdivタグのidをcontainerに設定します。
optsを利用した処理は行いません。

サンプル

<div id="map" style="width:200px;height:200px"></div>
var map = new GBMap(document.getElementById("map"));
map.setCenter(new GBLatLng(35.977771,140.224417), 20000);
Methods
Methods Return Value Description
getCenter() GBLatLng 表示領域の中心座標を取得します。
getBounds() GBLatLngBounds 表示領域を取得します。
getZoom() Number 現在のズームレベルを取得します。
setCenter(center, zoom?, type?) none centerzoomに指定した座標を地図の中心座標として変更します。
centerは中心座標のオブジェクトを設定します。
centerはGBLatLngのインスタンスとなります。
zoomは縮尺レベル値(10000、20000など)を設定します。
typeを利用した処理は行いません。
panTo(center) none centerに指定した座標を地図の中心座標として変更します。
centerはGBLatLngのインスタンスとなります。
指定した座標が現在の表示されている地図内であれば、滑らかなアニメーションで移動します。それ以外では、setCenter()とほぼ同じ動作をします。
addOverlay(overlay) none overlayに指定したシンボルやポリゴン等の表示オブジェクト(GBMarker、GBPolyline等)を地図内に追加します。
overlayの位置情報にGBDeviceXYを利用した場合、地図のスクロールや拡大・縮小に影響されないデバイス座標固定の図形を描画します。
removeOverlay(overlay) none overlayに指定したシンボルやポリゴン等の表示オブジェクト(GBMarker、GBPolyline等)を地図内から削除します。
clearAllMarker() none シンボルの表示オブジェクト(GBMarker)を一括で地図内から削除します。
getOperationMode() String 地図の操作状態を取得します。
NO_OP:なし
OP_PANTO:panto操作中
OP_ZOOM:ズーム操作中
OP_MOVE:8方向ボタン操作中
OP_DRAG:ドラッグ操作中
display8DirectionControl(disp) none 8方向ボタンの表示/非表示を制御します。
dispにtrueを指定すると表示され、falseを指定すると非表示となります。
デフォルト値はtrueとなります。
enable8DirectionControl(enable) none 8方向ボタンの使用可/不可を制御します。
enableにtrueを指定すると使用可となり、falseを指定すると使用不可となります。
デフォルト値はtrueとなります。
displayZoomControl(disp) none ズームボタンの表示/非表示を制御します。
dispにtrueを指定すると表示され、falseを指定すると非表示となります。
デフォルト値はtrueとなります。
enableZoomControl(enable) none ズームボタンの使用可/不可を制御します。
enableにtrueを指定すると使用可となり、falseを指定すると使用不可となります。
デフォルト値はtrueとなります。
getBoundsZoomLevel(bounds) Number boundsに指定した表示領域が地図表示内に表示できるズームレベルを取得します。
boundsはGBLatLngBoundsのインスタンスとなります。
enableMouseControl(enable) Number マウスを用いた地図操作機能の使用可/不可を制御します。
enableにtrueを指定すると使用可となり、falseを指定すると使用不可となります。
デフォルト値はtrueとなります。
addAppControl(img,func,x,y) String 自作の関数を呼ぶためのボタンを地図上に設置します。
imgは地図上に表示するボタンの画像URL、funcは呼び出す自作関数名、x・yはボタンを設置する座標となります。
座標はデバイス座標で指定します。
戻り値で、ボタンのid番号を取得します。
editAppControl(img,id,func) none addAppControl()で地図上に設置したボタンの画像、呼び出す自作関数を変更します。
imgは地図上に表示するボタンの画像URL、idはボタンのid番号、funcは呼び出す自作関数となります。
openInfoWindowHtml(point, content, opts?) none pointに与えられた座標にcontentのhtmlの内容を表示した情報ウィンドウを開きます。
pointはGBLatLngのインスタンスとなります。
optsを利用した処理は行いません。
closeInfoWindow() none 現在開いている情報ウィンドウを閉じます。
APIから開いた情報ウィンドウ、空間DBから開いた情報ウィンドウの区別なく閉じます。
setInfoWindowMoveMode (move) none 情報ウィンドウの移動可/不可を制御します。
moveにtrueを指定すると移動可となり、falseを指定すると移動不可となります。
デフォルト値はfalseとなります。
setZoom(zoomLevel) none 指定したzoomLevelへ地図の縮尺レベルを変更します。
displayScaleControl (disp) none スケールコントロールの表示/非表示を制御します。
dispにtrueを指定すると表示され、falseを指定すると非表示となります。
デフォルト値はtrueとなります。
enableScaleControl (enable) none スケールコントロールの使用可/不可を制御します。
enableにtrueを指定すると使用可となり、falseを指定すると使用不可となります。
デフォルト値はtrueとなります。
displayZoomLevel (disp) none 縮尺レベル値の表示/非表示を制御します。
dispにtrueを指定すると表示となり、falseを指定すると非表示となります。
デフォルト値はtrueとなります。
displayMapControl (disp) none 地図コントローラーの表示/非表示を制御します。
dispにtrueを指定すると表示となり、falseを指定すると非表示となります。
デフォルト値はtrueとなります。
changeControlDesign (color_type) none 地図コントローラーのデザインを変更します。
color_typeにtrueを指定する値によって地図コントローラーのデザインが変わります。
"white_circle"、"white_rectangle"、"black_circle"、"black_rectangle"の4種類を指定可能です。 デフォルト値は"white_circle"となります。
addThematicLayer (url, bounds, zoomRange) none 主題図ラスタを地図上に追加します。
明示的にズームレベル範囲を指定可能です。ズームレベル範囲を省略すると、全ズームレベルを追加対象とします。
urlは主題図ラスタURLを設定します。
boundsは主題図ラスタの表示領域を設定します。
zoomRangeは追加するズームレベル範囲を設定します(GBZoomLevelRange指定)。
※InternetExplorer6は非対応です。
getMapAreaSize () GBSize 地図の表示領域サイズ(ピクセル)を取得します。
removeThematicLayer (url) none 地図上の主題図ラスタを削除します。
urlは主題図ラスタURLを設定します。
※InternetExplorer6は非対応です。
getDispLayerIndex () String[] 現在のレイヤ重ね合わせの表示順序を取得します。表示レイヤは、配列先頭から階層的に重ね合わせて表示します。
既定値では、以下順で表示レイヤ名称を取得します。
 ・タイルラスタ(tileRasterLayer)
 ・主題図ラスタ(GBThematicLayer)
 ・API 図形レイヤ(figureLayer)
setDispLayerIndex (layers) none レイヤ重ね合わせの表示順序を変更します。
※getDispLayerIndex の配列入れ替えで表示順序を指定します
layersは表示レイヤ名称の配列を設定します。
getTileRasterLayerManager () TileRasterLayerManager タイルラスタを制御するインスタンスを取得します。
getGBFigureLayerManager () GBFigureLayerManager API 図形を制御するインスタンスを取得します。
getThematicLayerManager () ThematicLayerManager 主題図ラスタを制御するインスタンスを取得します。
※InternetExplorer6は非対応です。
resize (width, height) none 指定幅・高さに合わせて、地図の表示領域を更新します。
widthは表示領域の幅を設定します。
heightは表示領域の高さを設定します。
getScaleArray () String[] 地図の縮尺レベル一覧を取得します。
var map = new GBMap(document.getElementById("map")); 
map.setCenter(new GBLatLng(35.977771,140.224417), 20000); 
//地図描画されている中心座標(緯度経度)を返します。
var latlng=map.getCenter();
map.setCenter(new GBLatLng(35.977771,140.224417), 20000);
//地図描画されている表示範囲(南西と北東の緯度経度)を返します。
var bounds=map.getBounds();
map.setCenter(new GBLatLng(35.977771,140.224417), 20000);
//地図描画されている表示縮尺レベルを返します。
var level=map.getZoom();
var map = new GBMap(document.getElementById("map"));
//指定された座標(緯度経度)を中心に、地図を描画します。
map.setCenter(new GBLatLng(35.977771,140.224417), 20000);
var latlng=map.getCenter();
//指定された座標(緯度経度)が中心になるように、スムース移動します。
map.panTo(latlng);
var point=new GBLatLng(35.977771,140.224417);
var marker=new GBMarker(point)
//マーカーを追加
map.addOverlay(marker);
var marker=new GBMarker(point)
map.addOverlay(marker);
//クリックでマーカーを削除します。
GBEvent.addListener(marker, "click", function() {
map.removeOverlay(marker);
});
//マーカーを一括削除します。
map.clearAllMarker();
var map = new GBMap(document.getElementById("map"));
//地図移動を、何もしていない状態なら、alertを表示します。
if(map.getOperationMode() == "NO_OP"){
alert("NO OPERATION!!");
}
//8方向ボタンを非表示にします。
map.display8DirectionControl(false);
//8方向ボタンを使用不可にします。
map.enable8DirectionControl(false);
//ズームボタンを非表示にします。
map.displayZoomControl(false);
//ズームボタンを使用不可にします。
map.enableZoomControl(false);
var bounds = new GBLatLngBounds();
var points=[new GBLatLng(35.657845, 139.744323), 
new GBLatLng (35.977771,140.224417), new GBLatLng (35.659588, 139.746469)];
bounds.extendPoints(points);
//boundsに指定された描画範囲が全て描画されるズームレベルを返します。
var level=map.getBoundsZoomLevel(bounds);
//マウスを用いた地図操作機能を使用不可にします。
map.enableMouseControl(false);
//指定の場所に、アプリケーションボタンを配備します。
var id=map.addAppControl("http://localhost/ajax/sample.jpg",
func(){alert("test")},100,100);
//配備したアプリケーションボタンを変更します。
map.editAppControl("http://localhost/ajax/sample.jpg",id,func(){alert("test")});
map.setCenter(new GBLatLng(35.977771,140.224417), 20000);
//地図の中心に情報ウィンドウが表示されます
map.openInfoWindowHtml(map.getCenter(),"test");
//現在表示されている情報ウィンドウを閉じます。
map.closeInfoWindow();
//情報ウィンドウの移動を可能にします。
map.setInfoWindowMoveMode(true);
map.setCenter(new GBLatLng(35.977771,140.224417), 10000);
//縮尺1/10000レベルで描画していた地図を、縮尺1/20000レベルの地図にズームアウトします。
map.setZoom(20000);
//スケールコントロールを非表示にします。
map.displayScaleControl(false);
//スケールコントロールを使用不可にします。
map.enableScaleControl(false);
//縮尺レベル値を非表示にします。
map.displayZoomLevel(false);
//地図コントローラーを非表示にします。
map.displayMapControl(false);
//地図コントローラーのデザインを変更します。
map.changeControlDesign("black_rectangle");
//主題図ラスタを追加/削除します。
if(isAddFlg) {
  //主題図ラスタを追加
  var bounds = new GBLatLngBounds(new GBLatLng(35.66680926, 139.7454961), 
                                  new GBLatLng(35.66904908, 139.7482957));
  map.addThematicLayer("./img/thematicMap001.png", 
                       bounds, 
                       new GBZoomLevelRange(2500, 10000));
} else {
  //主題図ラスタを削除
  map.removeThematicLayer("./img/thematicMap001.png");
}
//レイヤ重ね合わせ順序の反転します。
var layers = map.getDispLayerIndex();
map.setDispLayerIndex(layers.reverse());
//指定幅・高さに合わせて、地図の表示領域を更新します。
map.resize('800px', '500px');
//地図の縮尺レベル一覧を取得します。
var aryScale = map.getScaleArray();
Events
Events Arguments Description
click overlay, latlng 地図がクリックされたときのイベント
moveend none 地図を移動終了した際のイベント
zoomend none 地図の縮尺レベルを変更終了した際のイベント
infowindowopen none 情報ウィンドウが開いた際のイベント
infowindowclose none 情報ウィンドウが閉じた際のイベント
infowindowdisplay none 情報ウィンドウ原点が地図範囲外になり、情報ウィンドウが表示になった際のイベント
infowindowhidden none 情報ウィンドウ原点が地図範囲外になり、情報ウィンドウが非表示になった際のイベント
//地図をクリックすると、アラートダイアログが表示されます。
GBEvent.addListener(map,'click',function(){alert("クリック")});
//地図移動のイベントが終了すると、アラートダイアログが表示されます。
GBEvent.addListener(map,'moveend',function(){alert("移動終了")});
//ズームイベントが終了すると、アラートダイアログが表示されます。
GBEvent.addListener(map,'zoomend',function(){alert("縮尺レベル変更終了")});
//情報ウィンドウが開くと、アラートダイアログが表示されます。
GBEvent.addListener(map,'infowindowopen',function(){alert("情報ウィンドウ開く")});
//情報ウィンドウが閉じると、アラートダイアログが表示されます。
GBEvent.addListener(map,'infowindowclose',function(){alert("情報ウィンドウ閉じる")});
//情報ウィンドウが表示になると、アラートダイアログが表示されます。
GBEvent.addListener(map,'infowindowdisplay',function(){alert("情報ウィンドウ表示")});
//情報ウィンドウが非表示になると、アラートダイアログが表示されます。
GBEvent.addListener(map,'infowindowhidden',function(){alert("情報ウィンドウ非表示")});

ページトップへ

class GBMarker

地図上の指定位置にシンボルをおきます。 GBMapのaddOverlay()メソッドの引数として指定します。
地図にGBMarkerを追加すると、情報ウインドウはこのシンボルを通じて開くことも可能となります。

Constructor
Constructor Description
GBMarker(point, icon?, insert?) シンボルのインスタンスを生成します。
独自のアイコンも設定可能です。
pointに設定した座標にiconオブジェクトを設定します。
iconを設定しない場合は、デフォルトアイコンでシンボル表示されます。
insertを利用した処理は行いません。

サンプル

var point=new GBLatLng(35.977771,140.224417);
var marker=new GBMarker(point)
map.addOverlay(marker);
Methods
Methods Return Value Description
openInfoWindowHtml(content, opts?) none シンボルの上にcontentのhtmlの内容を表示した情報ウィンドウを開きます。
optsを利用した処理は行いません。
setStyle(style) none styleに設定したスタイルをシンボルのインスタンスに反映します。
styleはGBStyleのインスタンスとなります。
getStyle() GBStyle シンボルのインスタンスに設定されているスタイルを取得します。
changeNormalStyle() none setStyle()で設定した通常時のスタイルに変更します。
changeEmphasisStyle() none setStyle()で設定した強調時のスタイルに変更します。
getLatLng() GBLatLng インスタンスが保持する座標を取得します。

サンプル

var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
//マーカークリックで情報ウインドウを開きます
GBEvent.addListener(marker, "click", function() {
  marker.openInfoWindowHtml('test');
  });
var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
var style=new GBStyle();
style.normal.image="http://localhost/ajax/sample.jpg"
style.normal.iconSize=new GBSize(20,20);
//マーカーにスタイル属性をセットします。
marker.setStyle(style);
var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
//マーカーにセットされているスタイル属性を取得します。
var style=marker.getStyle();
var style=new GBStyle();
style.normal.image="http://localhost/ajax/sample.jpg"
marker.setStyle(style);
//マーカーのスタイル属性を標準用スタイル属性に変更します。
marker.changeNormalStyle();
var style=new GBStyle();
style.emphasis.image="http://localhost/ajax/sample.jpg"
marker.setStyle(style);
//マーカーのスタイル属性を強調用スタイル属性に変更します。
marker.changeEmphasisStyle();
//マーカーの保持する座標を取得します。
marker.getLatLng();
Events
Events Arguments Description
click overlay, latlng シンボルがクリックされたときのイベント
singlerightclick overlay, latlng シンボルが右クリックされたときのイベント

サンプル

var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
//マーカークリックで情報ウインドウを開きます
GBEvent.addListener(marker, "click", function() {
  marker.openInfoWindowHtml('test');
});

ページトップへ

class GBIcon

地図の上のGBMarker を表示するのに使用する画像を指定します。

Constructor
Constructor Description
GBIcon(copy?, image?) アイコンのインスタンスを生成します。
imageに画像URLを設定することで、好きな画像を設定することができます。
imageに設定しなかった場合は、デフォルト画像が設定されます。
copyを利用した処理は行いません。

サンプル

//マーカーとして表示するアイコンの画像をセットします。
var icon=new GBIcon(,"http://localhost/ajax/sample.jpg");
var marker=new GBMarker(new GBLatLng(35.977771,140.224417),icon);
map.addOverlay(marker);
Properties
Properties Type Description
image String アイコンとして表示する画像URLを示します。
iconSize GBSize アイコンの表示サイズを示します。

サンプル

//マーカーとして表示するアイコンの画像をセットします。
var icon=new GBIcon();
icon.image = "http://localhost/ajax/sample.jpg";

ページトップへ

class GBSize

地図上の矩形の横幅・縦幅をピクセルで保持します。

Constructor
Constructor Description
GBSize(width, height) サイズのインスタンスを生成します。
width・heightを設定することで、横幅・縦幅を設定することができます。

サンプル

//マーカーとして表示するアイコンのサイズをセットします。
var size=new GBSize(20,20);
var icon=new GBIcon();
icon.iconSize=size;
var marker = new GBMarker(new GBLatLng(35.97777,140.2244),icon);
map.addOverlay(marker);
Properties
Properties Type Description
width String 横幅を示します。
height String 縦幅を示します。

ページトップへ

class GBLatLng

緯度経度の度単位以下を10進の小数点として表現した値を保持します。

Constructor
Constructor Description
GBLatLng(lat, lng, unbounded?) 緯度経度を保持するインスタンスを生成します。
lat,lngは世界測地系の緯度経度を設定します。
unboundedを利用した処理は行いません。

サンプル

//座標(緯度経度)をセットします。
var latlng=new GBLatLng(35.977771,140.224417);
map.setCenter(latlng,20000);
Methods
Methods Return Value Description
lat() Number 緯度を取得します。
lng() Number 経度を取得します。

サンプル

var latlng=new GBLatLng(35.977771,140.224417);
//指定された座標(緯度経度)を取得します。
var lat=latlng.lat();
var lng=latlng.lng();
Properties
Properties Type Description
x Number 緯度を取得します。
y Number 経度を取得します。

ページトップへ

class GBLatLngBounds

地図上の矩形の南西の座標と北東の座標を緯度経度で保持します。

Constructor
Constructor Description
GBLatLngBounds(sw?, ne?) 矩形のインスタンスを生成します。
swは、南西の緯度経度を設定します。
neは、北東の緯度経度を設定します。
座標系は世界測地系の緯度経度をします。
sw,neはGBLatLngのインスタンスとなります。
Methods
Methods Return Value Description
getSouthWest() GBLatLng 南西の世界測地系の緯度経度を取得します。
getNorthEast() GBLatLng 北東の世界測地系の緯度経度を取得します。
extendPoints(points) none pointsに設定した座標配列をすべて含む 南西・北東の世界測地系の緯度経度を設定します。
pointsはGBLatLngのインスタンスの配列となります。

サンプル

var point1 = new GBLatLng(35.65872,139.7454);
var point2 = new GBLatLng(35.65975,139.7632);
var bounds = new GBLatLngBounds(point1,point2);
//南西・北東の座標(緯度経度)を取得します。
var sw = bounds.getSouthWest();
var ne = bounds.getNorthEast();
var bounds = new GBLatLngBounds();
var points=[new GBLatLng(35.657845, 139.744323), 
new GBLatLng (35.977771,140.224417), new GBLatLng (35.659588, 139.746469)];
//boundsに指定された描画範囲が全て描画されるズームレベルを返します。
bounds.extendPoints(points);
var level=map.getBoundsZoomLevel(bounds);

ページトップへ

class GBEvent

地図上の矩形の南西の座標と北東の座標を緯度経度で保持します。

Static Methods
Static Methods Return Value Description
addListener(source, event, handler) listener 表示オブジェクト(シンボル・ライン等のインスタンス)にイベントを追加します。
sourceは表示オブジェクト(GBMarker、GBPolyline等)を設定します。
eventは各表示オブジェクトで設定可能なイベントを設定します。
handlerはイベント発生後に処理する自作関数を設定します。
removeListener(listener) none addListener()によって登録されたlistenerを削除します。
listenerはaddListener()の戻り値を設定します。

サンプル

var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
//マーカークリックで情報ウインドウを開きます
GBEvent.addListener(marker, "click", function() {
  marker.openInfoWindowHtml('test');
});
var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
//マーカークリックで情報ウインドウを開きます
var listener = GBEvent.addListener(marker, "click", function() {
  marker.openInfoWindowHtml('test');
});
setTimeout(function(){
  //10秒後にイベントが削除されます。
  GBEvent.removeListener(listener);
},10000);

ページトップへ

class GBPolyline

地図上にラインを描画します。

Constructor
Constructor Description
GBPolyline(points, color?, weight?, opacity?) ラインのインスタンスを生成します。
pointsにラインのノードにあたる座標配列を設定します。
colorにラインの線色を設定します。
weightにラインの線幅を設定します。
opacityにラインの透過度を設定します。
color,weight,opacityを設定しなかった場合は、デフォルト表示が設定されます。
※ 線幅の描画単位は、ピクセル(px)のみとします。
※ 透過度は、0~1の範囲で設定します。

サンプル

var points=[new GBLatLng(35.657845, 139.744323), 
new GBLatLng (35.977771,140.224417), new GBLatLng (35.659588, 139.746469)];
var polyline = new GBPolyline(points,"#00FF00",3,0.5);
map.addOverlay(polyline);
Methods
Methods Return Value Description
openInfoWindowHtml(content, opts?) none ラインの上にcontentのhtmlの内容を表示した情報ウィンドウを開きます。
optsを利用した処理は行いません。
setStyle(style) none styleに設定したスタイルをラインのインスタンスに反映します。
styleはGBStyleのインスタンスとなります。
getStyle() GBStyle ラインのインスタンスに設定されているスタイルを取得します。
changeNormalStyle() none setStyle()で設定した通常時のスタイルに変更します。
changeEmphasisStyle() none setStyle()で設定した強調時のスタイルに変更します。

サンプル

var points=[new GBLatLng(35.657845, 139.744323), 
new GBLatLng (35.977771,140.224417), new GBLatLng (35.659588, 139.746469)];
var polyline = new GBPolyline(points,"#00FF00",3,0.5);
map.addOverlay(polyline);
//ラインをクリックで情報ウインドウを開きます
GBEvent.addListener(polyline, "click", function() {
  polyline.openInfoWindowHtml('test');
});
var polyline = new GBPolyline(points,"#00FF00",3,0.5);
map.addOverlay(polyline);
var style=new GBStyle();
style.normal.strokeColor="#FF0000";
style.normal.strokeWidth=2;
style.normal.strokeOpacity=1;
//ラインにスタイル属性をセットします。
polyline.setStyle(style);
var polyline = new GBPolyline(points,"#00FF00",3,0.5);
map.addOverlay(polyline);
//ラインにセットされているスタイル属性を取得します。
var style=polyline.getStyle();
var style=new GBStyle();
style.normal.strokeColor="#0000FF";
polyline.setStyle(style);
//ラインのスタイル属性を標準用スタイル属性に変更します。
polyline.changeNormalStyle();
var style=new GBStyle();
style.emphasis.strokeColor="#666666";
polyline.setStyle(style);
//ラインのスタイル属性を強調用スタイル属性に変更します。
polyline.changeEmphasisStyle();
Events
Events Arguments Description
click overlay, latlng ラインがクリックされたときのイベント
singlerightclick overlay, latlng ラインが右クリックされたときのイベント

サンプル

var polyline = new GBPolyline(points,"#00FF00",3,0.5);
map.addOverlay(polyline);
//ラインクリックで情報ウインドウを開きます
GBEvent.addListener(polyline, "click", function() {
  polyline.openInfoWindowHtml('test');
});
var marker=new GBMarker(new GBLatLng(35.977771,140.224417));
map.addOverlay(marker);
//ライン右クリックで情報ウインドウを開きます
GBEvent.addListener(polyline, "singlerightclick", function() {
  polyline.openInfoWindowHtml('rightclick');
});

ページトップへ

class GBPolygon

地図上に多角形を描画します。

Constructor
Constructor Description
GBPolygon(points, strokeColor?, strokeWeight?, strokeOpacity?, fillColor?, fillOpacity?) ポリゴンのインスタンスを生成します。
pointsにポリゴンのノードにあたる座標配列を設定します。
strokeColorにポリゴンの線色を設定します。
strokeWeightにポリゴンの線幅を設定します。
strokeOpacityにポリゴンの線色透過度を設定します。
fillColorにポリゴンの塗り潰し色を設定します。
fillOpacityにポリゴンの塗り潰し色透過度を設定します。
strokeColor,strokeWeight, strokeOpacity,fillColor, fillOpacityを設定しなかった場合は、デフォルト表示が設定されます。
※ 線幅の描画単位は、ピクセル(px)のみとします。
※ 透過度は、0~1の範囲で設定します。

サンプル

var points=[new GBLatLng(35.657845, 139.744323), 
new GBLatLng (35.977771,140.224417), new GBLatLng (35.659588, 139.746469)];
var polygon = new GBPolygon(points,"#000000",2,1,"#FF0000",1);
map.addOverlay(polygon);
Methods
Methods Return Value Description
openInfoWindowHtml(content, opts?) none ポリゴンの上にcontentのhtmlの内容を表示した情報ウィンドウを開きます。
optsを利用した処理は行いません。
setStyle(style) none styleに設定したスタイルをポリゴンのインスタンスに反映します。
styleはGBStyleのインスタンスとなります。
getStyle() GBStyle ポリゴンのインスタンスに設定されているスタイルを取得します。
changeNormalStyle() none setStyle()で設定した通常時のスタイルに変更します。
changeEmphasisStyle() none setStyle()で設定した強調時のスタイルに変更します。

サンプル

var points=[new GBLatLng(35.657845, 139.744323), 
new GBLatLng (35.977771,140.224417), new GBLatLng (35.659588, 139.746469)];
var polygon = new GBPolygon(points,"#000000",2,1,"#FF0000",1);
map.addOverlay(polygon);
//ポリゴンをクリックで情報ウインドウを開きます
GBEvent.addListener(polygon, "click", function() {
  polygon.openInfoWindowHtml('test');
});
var polygon = new GBPolygon(points,"#000000",2,1,"#FF0000",1);
map.addOverlay(polygon);
var style=new GBStyle();
style.normal.strokeColor="#FF0000";
style.normal.strokeWidth=2;
style.normal.strokeOpacity=1;
//ポリゴンにスタイル属性をセットします。
polygon.setStyle(style);
var polygon = new GBPolygon(points,"#000000",2,1,"#FF0000",1);
map.addOverlay(polygon);
//ポリゴンにセットされているスタイル属性を取得します。
var style=polygon.getStyle();
var style=new GBStyle();
style.normal.strokeColor="#0000FF";
polygon.setStyle(style);
//ポリゴンのスタイル属性を標準用スタイル属性に変更します。
polygon.changeNormalStyle();
var style=new GBStyle();
style.emphasis.strokeColor="#666666";
polygon.setStyle(style);
//ポリゴンのスタイル属性を強調用スタイル属性に変更します。
polygon.changeEmphasisStyle();
Events
Events Arguments Description
click overlay, latlng ポリゴンがクリックされたときのイベント
singlerightclick overlay, latlng ポリゴンが右クリックされたときのイベント

ページトップへ

class GBText

地図上の指定位置にテキストを描画します。

Constructor
Constructor Description
GBText(point, text, style?) テキストのインスタンスを生成します。
pointにテキストを表示する座標を設定します。
textに表示する文字列を設定します。
地図のライセンスを表示する場合は、textに「%MAP_LICENSE%」を含めてください。
styleに設定したスタイルをテキストのインスタンスに反映します。

サンプル

var text = new GBText(new GBLatLng(35.657845, 139.744323), 'テスト',
                      'color:#FF0000;font-size:12');
map.addOverlay(text);
// 地図のライセンスを表示する
var text = new GBText(new GBLatLng(35.657845, 139.744323), 'AjaxAPIオプションサービス-%MAP_LICENSE%',
                      'color:#0000FF;font-size:16');
map.addOverlay(text);
// デバイス座標固定のテキストを追加する
var devicePos = new GBDeviceXY(250, 150);
var deviceText = new GBText(devicePos, 'AjaxAPIオプションサービス', 'color:#0000FF;font-size:16');
map.addOverlay(deviceText);
Methods
Methods Return Value Description
openInfoWindowHtml(content, opts?) none テキストの上にcontentのhtmlの内容を表示した情報ウィンドウを開きます。
optsを利用した処理は行いません。
setStyle(style) none styleに設定したスタイルをテキストのインスタンスに反映します。
styleはGBStyleのインスタンスとなります。
getStyle() GBStyle テキストのインスタンスに設定されているスタイルを取得します。
changeNormalStyle() none setStyle()で設定した通常時のスタイルに変更します。
changeEmphasisStyle() none setStyle()で設定した強調時のスタイルに変更します。

サンプル

var text = new GBText(new GBLatLng(35.657845, 139.744323),
"テスト",'color:#FF0000;font-size:12');
map.addOverlay(text);
//テキストをクリックで情報ウインドウを開きます
GBEvent.addListener(text, "click", function() {
  polygon.openInfoWindowHtml('test');
});
var text = new GBText(new GBLatLng(35.657845, 139.744323),
"テスト",'color:#FF0000;font-size:12');
map.addOverlay(text);
var style=new GBStyle();
style.normal.style="color:#FF0000";
//テキストにスタイル属性をセットします。
text.setStyle(style);
var text = new GBText(new GBLatLng(35.657845, 139.744323),
"テスト",'color:#FF0000;font-size:12');
map.addOverlay(text);
//テキストにセットされているスタイル属性を取得します。
var style=text.getStyle();
var style=new GBStyle();
style.normal.style="color:#0000FF";
text.setStyle(style);
//テキストのスタイル属性を標準用スタイル属性に変更します。
text.changeNormalStyle();
Events
Events Arguments Description
click overlay, latlng テキストがクリックされたときのイベント
singlerightclick overlay, latlng テキストが右クリックされたときのイベント

ページトップへ

class GBStyle

GBMaker、GBPolyline、GBPolygon、GBTextの表示スタイルを保持します。

Constructor
Constructor Description
GBStyle() スタイルのインスタンスを生成します。
Properties
Properties Description
normal.image GBMarkerオブジェクトのスタイル変更プロパティです。
通常時、ポイントを表示する際のイメージ画像を示します。
デフォルト値:"http://ホスト名/ajax_gis/symbol/default_icon.gif"
normal.iconSize GBMarkerオブジェクトのスタイル変更プロパティです。
通常時、ポイントを表示する際の表示サイズを示します。
デフォルト値:GBSize(16,16)
normal.borderWidth GBMarkerオブジェクトのスタイル変更プロパティです。
通常時、ポイントを表示する際の枠線の太さを示します。
normal.borderColor GBMarkerオブジェクトのスタイル変更プロパティです。
通常時、ポイントを表示する際の枠線の色を示します。
normal.borderStyle GBMarkerオブジェクトのスタイル変更プロパティです。
通常時、ポイントを表示する際の枠線のスタイルを示します。
デフォルト値:none
emphasis.image GBMarkerオブジェクトのスタイル変更プロパティです。
強調時、ポイントを表示する際のイメージ画像を示します。
デフォルト値:"http://ホスト名/ajax_gis/symbol/default_emphasis_icon.gif"
emphasis.iconSize GBMarkerオブジェクトのスタイル変更プロパティです。
強調時、ポイントを表示する際の表示サイズを示します。
デフォルト値:GBSize(20,20)
emphasis.borderWidth GBMarkerオブジェクトのスタイル変更プロパティです。
強調時、ポイントを表示する際の枠線の太さを示します。
デフォルト値:5
emphasis.borderColor GBMarkerオブジェクトのスタイル変更プロパティです。
強調時、ポイントを表示する際の枠線の色を示します。
デフォルト値:#00FF00
emphasis.borderStyle GBMarkerオブジェクトのスタイル変更プロパティです。
強調時、ポイントを表示する際の枠線のスタイルを示します。
デフォルト値:solid
normal.strokeColor GBPolyline・GBPolygonオブジェクトのスタイル変更プロパティです。
通常時、ライン・ポリゴンを表示する際のストロークの色を示します。
デフォルト値:#000000
normal.strokeWeight GBPolyline・GBPolygonオブジェクトのスタイル変更プロパティです。
通常時、ライン・ポリゴンを表示する際のストロークの太さを示します。
デフォルト値:1
normal.strokeOpacity GBPolyline・GBPolygonオブジェクトのスタイル変更プロパティです。
通常時、ライン・ポリゴンを表示する際のストロークの透過度を示します。
※ 透過度は、0~1の範囲で設定します。
デフォルト値:1
emphasis.strokeColor GBPolyline・GBPolygonオブジェクトのスタイル変更プロパティです。
強調時、ライン・ポリゴンを表示する際のストロークの色を示します。
デフォルト値:#FF0000
emphasis.strokeWeight GBPolyline・GBPolygonオブジェクトのスタイル変更プロパティです。
強調時、ライン・ポリゴンを表示する際のストロークの太さを示します。
デフォルト値:5
emphasis.strokeOpacity GBPolyline・GBPolygonオブジェクトのスタイル変更プロパティです。
強調時、ライン・ポリゴンを表示する際のストロークの透過度を示します。
※ 透過度は、0~1の範囲で設定します。
デフォルト値:1
normal.fillColor GBPolygonオブジェクトのスタイル変更プロパティです。
通常時、ポリゴンを表示する際の塗りつぶしの色を示します。
デフォルト値:#FFFFFF
normal.fillOpacity GBPolygonオブジェクトのスタイル変更プロパティです。
通常時、ポリゴンを表示する際の塗りつぶしの透過度を示します。
※ 透過度は、0~1の範囲で設定します。
デフォルト値:1
emphasis.fillColor GBPolygonオブジェクトのスタイル変更プロパティです。
強調時、ポリゴンを表示する際の塗りつぶしの色を示します。
デフォルト値:#0000FF
emphasis.fillOpacity GBPolygonオブジェクトのスタイル変更プロパティです。
強調時、ポリゴンを表示する際の塗りつぶしの透過度を示します。
※ 透過度は、0~1の範囲で設定します。
デフォルト値:1
normal.style GBTextオブジェクトのスタイル変更プロパティです。
通常時、テキストを表示する際のスタイルを示します。
デフォルト値:FONT-WEIGHT:500; COLOR:#000000; FONT-FAMILY:serif;
emphasis.style GBTextオブジェクトのスタイル変更プロパティです。
強調時、テキストを表示する際のスタイルを示します。
デフォルト値:FONT-WEIGHT:900; COLOR:#FF0000; FONT-FAMILY:serif;

ページトップへ

class GBGUI

地図上に自由にドラッグできるダイアログを生成します。

Constructor
Constructor Description
GBGUI(map, id?) ダイアログのインスタンスを生成します。
アプリケーションを載せるベースパネルが生成されます。
mapにGBMap()のインスタンスを設定します。
idに、ダイアログを管理する任意の番号を指定します。
※ ダイアログを複数同時に表示しない場合は、省略可能です。

サンプル

var map = new GBMap(document.getElementById("map"));
map.setCenter(new GBLatLng(35.977771,140.224417), 20000);
//ダイアログのインスタンスを生成します。
var gui = new GBGUI(map);
Methods
Methods Return Value Description
getControlPanel_Id() String ベースパネルのid番号を取得します。
getControlBody_Id() String ベースパネルのBODY部のid番号を取得します。
formatContent(controlBody_id) none ベースパネルのBODY部に表示されたコンテンツを削除します。
ontrolBody_idは、getControlBody_Id()の戻り値を指定します。
setTitle(titleName) none ベースパネルのタイトルバーにタイトル名を設定します。
titleNameにタイトル名を設定します。
デフォルト値は、"無題"がセットされます。
disableCloseButton(visible) none ベースパネルに設置している『閉じる』ボタンを表示/非表示を制御します。
visibleにtrueを指定すると表示され、falseを指定すると非表示となります。
デフォルト値はfalseになります。
setCloseButtonEvent(func) none 『閉じる』ボタンをクリックした際の処理を設定します。
funcには自作関数名を設定します。
※ 登録できる処理は、一つの関数のみとなります。
viewContent(x,y) none ベースパネルを地図上に表示します。
x,yにベースパネルの左上の座標を設定します。
※ xy座標は、デバイス座標で設定します。
closePanel() none ベースパネルを非表示にします。

サンプル

var gui = new GBGUI(map);
//ベースパネルのIDパネルを取得します。
var id = gui.getControlPanel_Id();
var gui = new GBGUI(map);
//ベースパネルのBODY部分のIDパネルを取得します。
var id = gui.getControlBody_Id();
var gui = new GBGUI(map);
var id = gui.getControlBody_Id();
//ベースパネルのBODY部分のコンテンツを消去します。
gui.formatContent(id);
var gui = new GBGUI(map);
//ベースパネルのタイトルを設定します。
gui.setTitle("タイトル");
var gui = new GBGUI(map);
//ベースパネルの「×」ボタンを表示にします
gui.disableCloseButton(true);
var gui = new GBGUI(map);
//ベースパネルの「×」ボタンを押下した際のイベントを設定します。
gui.setCloseButtonEvent(function(){alert("テスト");};);
var gui = new GBGUI(map);
//ベースパネルを地図上の設定した座標地点(デバイス座標)に表示します。
gui.viewContent(100,100);
var gui = new GBGUI(map);
//ダイアログを非表示にします。
gui.setCloseButtonEvent(function(){gui.closePanel()})

ページトップへ

class GBZoomLevelRange

ズームレベル範囲を保持するクラスです。

Constructor
Constructor Description
GBZoomLevelRange(minZoomLevel,maxZoomLevel) ズーム範囲を保持するするインスタンスを生成します。
minZoomLevelに最小ズームレベルを設定します。
maxZoomLevelに最大ズームレベルを設定します。

サンプル

var point1 = new GBLatLng(35.6665852, 139.7424163);
var point2 = new GBLatLng(35.66927299, 139.745776);
var bounds = new GBLatLngBounds(point1, point2);
var zoomRange = new GBZoomLevelRange(2500, 10000);
map.addThematicLayer("./img/thematicMap.png", bounds, zoomRange);

ページトップへ

class GBZoLayer

AjaxAPIオプションサービス上のレイヤの名称と表示状態を保持します。
コンストラクタは利用せず、オブジェクトリテラルを利用してインスタンス化します。

Constructor
Constructor Description
GBZoomLevelRange(minZoomLevel,maxZoomLevel) ズーム範囲を保持するするインスタンスを生成します。
minZoomLevelに最小ズームレベルを設定します。
maxZoomLevelに最大ズームレベルを設定します。
Properties
Properties Type Description
Name String レイヤ名称を保持します
Visible Boolean レイヤの表示状態を保持します
true:表示
false:非表示

ページトップへ

class TileRasterLayerManager

AjaxAPIオプションサービスのタイルラスタ管理クラスです。

Constructor
Constructor Description
公開されません
Methods
Methods Return Value Description
getLayerControl () TileRasterLayerControl タイルラスタのレイヤ制御を行うインスタンスを取得します。

サンプル

//タイルラスタのレイヤ制御インスタンスを取得します。
map.getTileRasterLayerManager().getLayerControl();

ページトップへ

class TileRasterLayerControl

タイルラスタのレイヤ制御を行うクラスです。

Constructor
Constructor Description
公開されません
Methods
Methods Return Value Description
changeVisibleLayer (name, zoomLevel, visible) none タイルラスタの表示状態を制御します。
nameにタイルラスタ名称を設定します。
zoomLevelにズームレベルを設定します。
visibleにtrueを指定すると表示され、falseを指定すると非表示となります。
changeVisibleAllLayer (zoomLevel, visible) none 全タイルラスタの表示状態を制御します。
zoomLevelにズームレベルを設定します。
visibleにtrueを指定すると表示され、falseを指定すると非表示となります。
getDispLayerIndex (zoomLevel) String[] タイルラスタ重ね合わせの表示順序を取得します。タイルラスタは、配列先頭から階層的に重ね合わせて表示します。
zoomLevelにズームレベルを設定します。
setDispLayerIndex (zoomLevel, layers) none タイルラスタ重ね合わせの表示順序を変更します。
zoomLevelにズームレベルを設定します。
layersにタイルラスタ名称の配列を設定します。
※ TileRasterLayerControl.getDispLayerIndex() の配列入れ替えで表示順序を指定します

サンプル

//タイルラスタの表示状態を制御します。
var control = map.getTileRasterLayerManager().getLayerControl();
if(isAllFlg) {
  control.changeVisibleAllLayer(map.getZoom(), visible);        //全タイルラスタ
} else {
  control.changeVisibleLayer(tileName, map.getZoom(), visible); //指定タイルラスタ
}
//タイルラスタの表示順序を反転します。
var control = map.getTileRasterLayerManager().getLayerControl();
var layers = control.getDispLayerIndex(map.getZoom());      //現在のタイルラスタ名称を取得
control.setDispLayerIndex(map.getZoom(), layers.reverse()); //表示順序を反転

ページトップへ

class GBFigureLayerManager

GeoBroserのAPI 図形の管理クラスです。

Constructor
Constructor Description
公開されません
Methods
Methods Return Value Description
getLayerControl () GBFigureLayerControl API 図形のレイヤ制御を行うインスタンスを取得します。

ページトップへ

class GBFigureLayerControl

API 図形のレイヤ制御を行うクラスです。クラスです。

Constructor
Constructor Description
公開されません
Methods
Methods Return Value Description
getLayer (layerName) GBLayer 指定したAPI図形のレイヤ表示状態を取得します。
layerNameにレイヤ名称を設定します。
※ GBFigureLayerControl.getLayerList() で取得したレイヤの名称を指定します
getLayerList () GBLayer[] 全API図形のレイヤ表示状態を取得します
changeLayerList (aryLayer) none 各API図形のレイヤの表示順と表示状態に変更します。
aryLayerにGBLayerの配列を設定します。
※ GBFigureLayerControl.getLayerList() で取得したレイヤをすべて指定してください。
※ aryLayerの配列インデックス順に表示するため、インデックスが大きい程上位に表示されます

サンプル

//API図形のレイヤ制御インスタンスを取得します。
map.getGBFigureLayerManager().getLayerControl();

ページトップへ

class ThematicLayerManager

主題図ラスタの管理クラスです。
※InternetExplorer6は非対応です。

Constructor
Constructor Description
公開されません
Methods
Methods Return Value Description
getLayerControl () GBFigureLayerControl 主題図ラスタのレイヤ制御を行うインスタンスを取得します。
getThematicLayerList () String[] 現在利用中の主題図ラスタのリスト情報を取得します。

サンプル

//主題図ラスタの表示状態を制御します。
map.getThematicLayerManager().getLayerControl();

ページトップへ

class ThematicLayerControl

タイルラスタのレイヤ制御を行うクラスです。
※InternetExplorer6は非対応です。

Constructor
Constructor Description
公開されません
Methods
Methods Return Value Description
changeVisibleLayer (mapID, visible) none 主題図ラスタの表示状態を制御します。
mapIDに主題図ラスタのユニークキーを設定します。
※ ThematicLayerManager.getThematicLayerList() で取得した主題図ラスタのユニークキーを指定します
visibleにtrueを指定すると表示され、falseを指定すると非表示となります。
changeVisibleAllLayer (visible) none 全主題図ラスタの表示状態を制御します。
visibleにtrueを指定すると表示され、falseを指定すると非表示となります。
setDispLayerIndex (layers) none 主題図ラスタの表示順序を変更します。
layersに主題図ラスタのリストを設定します。
※ ThematicLayerManager.getThematicLayerList() の配列入れ替えで表示順序を指定します

サンプル

//主題図ラスタの表示状態を制御します。
var control = map.getThematicLayerManager().getLayerControl();
if(isAllFlg) {
  control.changeVisibleAllLayer(visible);           //全API図形
} else {
  control.changeVisibleLayer(name, visible);        //指定API図形
}
//主題図ラスタの表示順序を反転します。
var control = map.getThematicLayerManager().getLayerControl();
var layers = map.getThematicLayerManager().getThematicLayerList();  //主題図ラスタのリストを取得
control.setDispLayerIndex(layers.reverse());                        //表示順序を反転

ページトップへ

class GBUserFunctionControl

GBMapにイベントを追加します。

Constructor
Constructor Description
GBUserFunctionControl(map) GBMapのイベントを管理するインスタンスを生成します。
mapにGBMap()のインスタンスを設定します。
Methods
Methods Return Value Description
init() none GBUserFunctionControlの初期化を行います。
※ 初期化を行うと、地図コントローラーとマウスを用いた地図操作機能に禁則がかかります。
dispose() none GBUserFunctionControlの解放を行います。
※ 解放を行うと、地図コントローラーとマウスを用いた地図操作機能の禁則が解除されます。
addMouseEvent(event, handler) Boolean GBMapにイベントを登録します。
eventは登録するイベント名称を設定します。
handlerはイベント発生後に処理する自作関数を設定します。
deleteMouseEvent(event, clickFunc) Boolean GBMapに登録したイベントを削除します。
eventは削除するイベント名称を設定します。
handlerは削除対象となる自作関数を設定します。

サンプル

// イベント関数の定義
var clickFunc = function(){ alert("イベント発生"); };
// 初期化を行う
var eventObj = new GBUserFunctionControl(map);
eventObj.init();
// クリックイベントを登録する
eventObj.addMouseEvent("click", clickFunc);
// クリックイベントを削除する
eventObj.deleteMouseEvent("click", clickFunc);
// 解放する
eventObj.dispose();
Events
Events Description
click GBMap上でクリックしたときのイベント
singlerightclick GBMap上で右クリックしたときのイベント
dblclick GBMap上でダブルクリックしたときのイベント
mousedown GBMap上でマウスを押し下げたときのイベント
mouseup GBMap上でマウスを押し上げたときのイベント
mousemove GBMap上でマウスを移動したときのイベント
mouseover GBMap上にマウスが重なったときのイベント
mouseout GBMap上からマウスが外れたときのイベント

ページトップへ

class GBDeviceXY

AjaxAPIオプションサービス上のデバイス座標を管理します。
本クラスはGBTextでのみ利用可能です。

Constructor
Constructor Description
GBDeviceXY(x, y) デバイス座標を保持するインスタンスを生成します。
x, yはAjaxAPIオプションサービス上のデバイス座標を管理します。

サンプル

// デバイス座標固定のテキストを追加する
var devicePos = new GBDeviceXY(250, 150);
var deviceText = new GBText(devicePos, "AjaxAPIオプションサービス", 'color:#0000FF;font-size:16');
map.addOverlay(deviceText);

ページトップへ