VEMap.AddShapeLayer Method
You are not viewing the latest version of the AJAX control. Bing Maps AJAX V7 is the recommended JavaScript control for Bing Maps. If you need this documentation, it is available in as a CHM or PDF download.
Adds the specified VEShapeLayer Class object to the map.
VEMap.AddShapeLayer(Layer);
Parameters
| Parameter | Description |
|---|---|
Layer |
The VEShapeLayer Class object to add. |
Remarks
If the layer reference already exists on the map, an exception is thrown, and no new layer is created.
Examples
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://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="https://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>
<script type="text/javascript">
var map = null;
var layer01 = null;
var layer02 = null;
var shape01 = null;
var shape02 = null;
var id01 = null;
var id02 = null;
var layer = null;
function GetMap()
{
map = new VEMap('myMap');
map.LoadMap();
map.AttachEvent("onclick", ShapeLayerAlert);
}
function AddShapeLayers()
{
var points01 = 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),
new VELatLong(45.01188,-111.06687)
);
var points02 = new Array(
new VELatLong(43.01188,-109.06687),
new VELatLong(43.01534,-101.06324),
new VELatLong(39.01929,-101.06),
new VELatLong(39.003,-109.05878),
new VELatLong(43.01188,-109.06687)
);
layer01 = new VEShapeLayer();
layer01.SetTitle("layer01 title");
map.AddShapeLayer(layer01);
layer02 = new VEShapeLayer();
layer02.SetTitle("layer02 title");
map.AddShapeLayer(layer02);
shape01 = new VEShape(VEShapeType.Polygon, points01);
shape01.SetLineWidth(3);
shape01.SetLineColor(new VEColor(0,150,100,1.0));
shape01.SetFillColor(new VEColor(0,150,100,0.5));
layer01.AddShape(shape01);
shape02 = new VEShape(VEShapeType.Polygon, points02);
shape02.SetLineWidth(3);
shape02.SetLineColor(new VEColor(0,100,150,1.0));
shape02.SetFillColor(new VEColor(0,100,150,0.5));
layer02.AddShape(shape02);
map.SetMapView(points01);
id01 = shape01.GetID();
id02 = shape02.GetID();
var links = "Delete: <a href='#' onClick='DeleteOneShape(id01)'>" + id01 + "</a><br/>";
links += "Delete: <a href='#' onClick='DeleteOneShape(id02)'>" + id02 + "</a>";
shapeLinks.innerHTML = links;
ShapeLayerInfo();
}
function DeleteShapeLayer(layer)
{
map.DeleteShapeLayer(layer);
ShapeLayerInfo();
}
function DeleteAllLayers()
{
map.DeleteAllShapeLayers();
ShapeLayerInfo();
}
function DeleteAllShapes()
{
map.DeleteAllShapes();
}
function DeleteOneShape(id)
{
shape = map.GetShapeByID(id);
map.DeleteShape(shape);
alert("Shape ID: " + id + " has been deleted.");
}
function ShapeLayerInfo()
{
var layers = "Number of shape layers: " + map.GetShapeLayerCount() + " (including the base layer)";
layerInfo.innerHTML = layers;
}
function ShapeLayerAlert(e)
{
if(e.elementID != null)
{
shape = map.GetShapeByID(e.elementID);
layer = shape.GetShapeLayer();
alert("Shape ID " + shape.GetID() + "\nbelongs to shape layer '" + layer.GetTitle() + "'.");
}
}
</script>
</head>
<body onload="GetMap();" style="font-family:Arial">
<div id='myMap' style="position:relative; width:400px; height:400px;"></div>
<div id="shapeLinks"></div>
<div id="layerInfo"></div>
<INPUT id="addshapelayers" type="button" value="Click to Add Shape Layers" name="addshapelayers"
onclick="AddShapeLayers();"/>
<INPUT id="deletelayer01" type="button" value="Click to Delete layer01" name="deletelayer01"
onclick="DeleteShapeLayer(layer01);"/>
<INPUT id="deletelayer02" type="button" value="Click to Delete layer02" name="deletelayer02"
onclick="DeleteShapeLayer(layer02);"/>
<INPUT id="deletealllayers" type="button" value="Click to Delete All Layers" name="deletealllayers"
onclick="DeleteAllLayers();"/>
<INPUT id="deleteallshapes" type="button" value="Click to Delete All Shapes" name="deleteallshapes"
onclick="DeleteAllShapes();"/><br />
</body>
</html>