Virtual Earth API: Simple VEShape Example

The Virtual Earth v5 APIs added a new VEShape class to make it easier to create pushpins, polylines, and polygons.  The new VEShape class gives these shapes a standard interface and a uniform way to create and access drawing elements on the map.  VEShapes are powerful and have many settings you can customize.  However, for this example, we are sticking with the basics to create simple pushpins, polylines, and polygons.  Future examples will show more details and expand on the customizable attributes of these elements.

To create a simple pushpin with a VEShape, you just need pass the VEShapeType.Pushpin type and a VELatLong to the VEShape constructor.  Then add it to the VEMap with the AddShape call. 

For example:

var shape1 = new VEShape(VEShapeType.Pushpin,new VELa\tLong(37.776, -122.426));

To create a simple polyline with VEShape, you need to pass the VEShapeType.Polyline type and an array of VELatLongs to the VEShape constructor.  Then add it to the map with the AddShape call.

For example:

var shape2= new VEShape(VEShapeType.Polyline, [ new VELatLong(44.5, -122.5), new VELatLong(48.5, -112.3), new VELatLong(42.3, -114.7), new VELatLong(45.1, -100.4), new VELatLong(35.1, -104.2) ]);

To create a simple polygon with VEShape, you need to pass the VEShapeType.Polygon and an array of VELatLongs to the VEShape constructor.  Then add it to the map with the Add Shape call

For example:

var shape3= new VEShape(VEShapeType.Polygon, [ new VELatLong(44.5, -90.8), new VELatLong(48.5, -75.3), new VELatLong(35.5, -80.4), new VELatLong(30.5, -95.8)]);

You can also add content to the default pop-up info box for each VEShape by calling the SetTitle and SetDescription methods on the VEShape:

For example:

shape1.SetTitle('Shape 1');

The pop-up info box by default will appear when mousing over the shape icon.  (Note: The pop-up info box is very customizable as well, however for this example, we'll keep it simple.  Future examples will show how to customize these elements.)

Once you have created your shapes, you can add them to the VEMap using the AddShape call:




When adding VEShapes directly to the VEMap, they will be a part of the default layer.  In a future example, we will add shapes to multiple layers.

Here's a link to the complete sample for this mashup:

Simple VEShape Example 


For more information on VEShapes, see the Virtual Earth Interactive SDK.

Skip to main content