VEShapeLayer.AddShape メソッド
1 つの VEShape クラス オブジェクト、または VEShape オブジェクトの配列を、レイヤに追加します。
構文
VEShapeLayer.AddShape(shape);
パラメータ
パラメータ | 説明 |
---|---|
shape |
追加する VEShape オブジェクト、または追加する VEShape オブジェクトの配列です (必須)。 |
解説
shape パラメータには、単一のプッシュピン、折れ線、または多角形を指定するか、プッシュピンの配列を指定することができます。このメソッドを呼び出す前に、VEShapeLayer をマップに追加する必要があります。そうしない場合、シェイプは 1 つずつ追加されます。マップが 3D モードの場合、シェイプは 1 つずつ追加されます。マップが再描画された場合、シェイプは 1 つずつ追加されます。同じ内部識別子を持つシェイプがレイヤ内に既に存在する場合、このメソッドは例外をスローします。
例
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.1"></script>
<script type="text/javascript">
var map = null;
var links = "次の情報を表示する:<a href='#' onClick='ShapeLayerInfo(0)'>ベース レイヤ</a><br/>";
var title = null;
var layer = null;
var selIndex = 0;
var index = 0;
var shapes = "";
var shapeID = null;
function GetMap()
{
map = new VEMap('myMap');
// SetDashboardSize は LoadMap より前に呼び出す必要があります。
map.SetDashboardSize("tiny");
map.LoadMap();
// 複数のシェイプ レイヤを作成します。
// インデックス値を使用して複数のリンクを作成します。
// クリックされたときに、シェイプ情報に関するメッセージを表示します。
for (var i = 1; i < 4; i++)
{
layer = "layer" + i;
layer = new VEShapeLayer();
layer.SetTitle("ShapeLayer" + i);
layer.SetDescription("これは ShapeLayer" + i + " です。");
title = layer.GetTitle();
map.AddShapeLayer(layer);
links += "次の情報を表示する:" +
"<a href='#' onClick='ShapeLayerInfo(" + i + ")'>" +
title + "</a><br/>";
}
// ベース レイヤのタイトルと説明を追加します。
baseLayer = map.GetShapeLayerByIndex(0);
baseLayer.SetTitle("ベース レイヤ");
baseLayer.SetDescription(
"これはベース レイヤです。 " +
"インデックスは常に 0 であり、削除することはできません。");
// リンクを追加します。
divInfo.innerHTML = links;
AddShapes();
IndexChanged(0);
}
// 各レイヤにシェイプを追加します。
function AddShapes()
{
var points = new Array(
new VELatLong(45.01188,-111.06687),
new VELatLong(45.01534,-104.06324),
new VELatLong(41.01929,-104.06),
new VELatLong(41.003,-111.05878)
);
for (var i = 0; i < 4; i++)
{
shape = new VEShape(VEShapeType.Pushpin, points[i]);
layer = map.GetShapeLayerByIndex(i);
shape.SetDescription("これはプッシュピン " + i + " です。");
shape.SetTitle("プッシュピン " + i);
layer.AddShape(shape);
}
map.SetMapView(points);
}
// リンクがクリックされたときに、各レイヤの情報を表示します。
function ShapeLayerInfo(index)
{
var layer = map.GetShapeLayerByIndex(index);
var count = layer.GetShapeCount();
alert("タイトル:" + layer.GetTitle() + "\nインデックス: " +
index + "\n説明:" + layer.GetDescription() +
"\nシェイプ数:" + count);
}
// 選択されたインデックスのレイヤを非表示にします。
function HideLayer()
{
layer = map.GetShapeLayerByIndex(selIndex);
if(layer.IsVisible())
{
layer.Hide();
}
}
// レイヤをすべて非表示にします。
function HideAllLayers()
{
map.HideAllShapeLayers();
}
// レイヤをすべて表示します。
function ShowAllLayers()
{
map.ShowAllShapeLayers();
}
// 選択されたインデックスのレイヤを再表示します。
function ShowLayer()
{
layer = map.GetShapeLayerByIndex(selIndex);
if(!layer.IsVisible())
{
layer.Show();
}
}
// 選択されたインデックスのレイヤの中央にシェイプを追加します。
function AddShapeToLayer()
{
var center = new VELatLong();
center = map.GetCenter();
shape = new VEShape(VEShapeType.Pushpin, center);
shape.SetTitle("追加された新規シェイプ");
layer = map.GetShapeLayerByIndex(selIndex);
layer.AddShape(shape);
AdjustView();
IndexChanged(selIndex);
}
// 選択されたインデックスのレイヤ内にあるすべてのシェイプを削除します。
function DeleteAllShapes()
{
layer = map.GetShapeLayerByIndex(selIndex);
layer.DeleteAllShapes();
IndexChanged(selIndex);
}
// 選択されたレイヤ内で指定されたシェイプを削除します。
function DeleteOneShape(shapeIdx, layerIdx)
{
if (shapeIdx != null && layerIdx != null)
{
try
{
layer = map.GetShapeLayerByIndex(layerIdx);
shape = layer.GetShapeByIndex(shapeIdx);
layer.DeleteShape(shape);
IndexChanged(selIndex);
}
catch(e)
{
alert(e.message);
}
}
else
{
alert("指定したシェイプまたはレイヤは存在しません。");
}
}
// インデックスの選択が変更されたときや、シェイプが追加または削除されたときに、ハイパーリンクを更新します。
function IndexChanged(index)
{
selIndex = index;
layer = map.GetShapeLayerByIndex(index);
count = layer.GetShapeCount();
var links = "<a href='#' id='HideLayer' onclick='HideLayer()'>レイヤを非表示にする (" +
layer.GetTitle() + ")</a><br />";
links += "<a href='#' id='ShowLayer' onclick='ShowLayer()'>レイヤを表示する (" +
layer.GetTitle() + ")</a><br />";
links += "<a href='#' id='HideAllLayers' onclick='HideAllLayers()'>" +
"すべてのレイヤを非表示にする</a><br />";
links += "<a href='#' id='ShowAllLayers' onclick='ShowAllLayers()'>" +
"すべてのレイヤを表示する</a><br />";
links += "<a href='#' id='AddShapeToLayer' onclick='AddShapeToLayer()'>" +
layer.GetTitle() + "の中央にシェイプを追加する</a><br />";
links += "<a href='#' id='DeleteAllShapes' onclick='DeleteAllShapes()'>" +
layer.GetTitle() + "からシェイプをすべて削除する</a><br />";
links += "次のシェイプを削除する: ";
for (var i = 0; i < count; i++)
{
shape = layer.GetShapeByIndex(i);
shapeID = shape.GetID();
links += "<a href='#' id='DeleteOneShape' onclick='DeleteOneShape(" + i +
", " + selIndex + ")'>" + shapeID + "</a> | ";
}
divLinks.innerHTML = links;
}
// シェイプが追加されたときにマップ ビューを調整します。
function AdjustView()
{
// プッシュピンを中央に追加した後、マップをドラッグしたように少し移動します。
// これは、VEGetBoundingRectangle の動作を確認するためです。
layer = map.GetShapeLayerByIndex(selIndex);
rect = layer.GetBoundingRectangle();
count = layer.GetShapeCount();
map.SetMapView(rect);
if (count <= 1)
{
map.SetZoomLevel(7);
}
}
</script>
</head>
<body onload="GetMap();" style="font-family:MS PGothic">
<div id='myMap' style="position:relative; width:400px; height:400px;"></div>
インデックスを指定してレイヤを選択します:
<form id="indexRadio">
0<input name="radio" type="radio" value="0" onclick="IndexChanged(0)" checked="checked"/>
1<input name="radio" type="radio" value="1" onclick="IndexChanged(1)"/>
2<input name="radio" type="radio" value="2" onclick="IndexChanged(2)"/>
3<input name="radio" type="radio" value="3" onclick="IndexChanged(3)"/>
</form>
<div id="divLinks"></div>
<div id="divShapes"></div>
<div id="divInfo"></div>
</body>
</html>
関連項目
参照
VEShapeLayer.DeleteShape メソッド
VEShapeLayer.DeleteAllShapes メソッド