VEShape.SetDescription 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.

Sets the description of the VEShape object.

VEShape.SetDescription(details);

Parameters

Parameter Description

details

A String object containing either plain text or HTML that represents the VEShape object's description field.

Remarks

To customize your info box to something instead of the default plain text, you can provide your own custom HTML by using the VEShape.SetDescription method details parameter. The content of the Details parameter is wrapped in a DIV tag and, along with the content defined by VEShape.SetTitle Method (if any), forms the custom info box. See also VEMap.ClearInfoBoxStyles Method and VEMap.SetDefaultInfoBoxStyles Method for further style customization options.

Note

There is no maximum length for this String. Depending on your formatting, style settings, and browser, it may extend beyond the visible area of the info box. Be sure to format it appropriately to avoid this problem

Example

<!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 lat1 = 44.88980971906551; 
         var lon1 = -85.39827346801759;
         var lat2 = 44.99879594361408; 
         var lon2 = -85.70159912109375;
         var latLong1 = new VELatLong(lat1, lon1);
         var latLong2 = new VELatLong(lat2, lon2);
         var latLong3 = new VELatLong(45.004622150149935, -85.56427001953126);
        
         //Create a pair of VELatLong arrays in the shape of an octagon
         var points01 = [
            new VELatLong(lat1, lon1 - 0.15),
            new VELatLong(lat1 + 0.1, lon1 - 0.05),
            new VELatLong(lat1 + 0.1, lon1 + 0.05),
            new VELatLong(lat1, lon1 + 0.15),
            new VELatLong(lat1 - 0.1, lon1 + 0.05),
            new VELatLong(lat1 - 0.1, lon1 - 0.05)];
            
         var points02 = [
            new VELatLong(lat2, lon2 - 0.15),
            new VELatLong(lat2 + 0.1, lon2 - 0.05),
            new VELatLong(lat2 + 0.1, lon2 + 0.05),
            new VELatLong(lat2, lon2 + 0.15),
            new VELatLong(lat2 - 0.1, lon2 + 0.05),
            new VELatLong(lat2 - 0.1, lon2 - 0.05)];
 
         function GetMap()
         {
            map = new VEMap('myMap');
            map.LoadMap();

            map.SetCenterAndZoom(latLong3, 9);
            map.SetMapStyle(VEMapStyle.Aerial);      
            map.AttachEvent("onclick", ShapeInfo);
            AddShapes();
         }   
     
         function AddShapes()
         {   
            //Create VEShape objects, set parameters, and add to the map         
            shape01 = new VEShape(VEShapeType.Polygon, points01);            
            shape01.SetLineWidth(2);
            shape01.SetLineColor(new VEColor(0,150,100,1.0));
            shape01.SetFillColor(new VEColor(0,100,150,0.5));
            shape01.SetTitle("Title for shape01");
            shape01.SetDescription("This is the description of shape01.");
            shape01.SetMoreInfoURL("https://msdn.microsoft.com");
            shape01.SetPhotoURL("https://dev.live.com/Themes/default/images/Mix08/service/logo_virtualearth.jpg");
            shape01.SetPoints(points01);
            shape01.ShowIcon();
            map.AddShape(shape01);
            
            shape02 = new VEShape(VEShapeType.Polygon, points02);            
            shape02.SetLineWidth(2);
            shape02.SetLineColor(new VEColor(0,100,150,1.0));
            shape02.SetFillColor(new VEColor(0,150,100,0.5));
            shape02.SetTitle("Title for shape02");
            shape02.SetDescription("This is the description of shape02.");
            shape02.SetMoreInfoURL("https://msdn.microsoft.com");
            shape02.SetPhotoURL("https://dev.live.com/Themes/default/images/Mix08/service/logo_virtualearth.jpg");
            shape02.SetPoints(points02);
            shape02.ShowIcon();
            map.AddShape(shape02);
         }
        
         function SwapPoints()
         {
            //Switch the points between the two shapes, making them trade places
            var pts = shape01.GetPoints();

            if (pts[0].Latitude == "44.88980971906551")
            {
               shape01.SetPoints(points02);
               shape02.SetPoints(points01);
            }
            else
            {
               shape01.SetPoints(points01);
               shape02.SetPoints(points02);
            }
         }
        
         function ShapeInfo(e)
         {
            if(e.elementID != null)
            {
               shape = map.GetShapeByID(e.elementID);
               var info = "";
               info += "ID (event object): " + e.elementID + "\n";
               info += "ID (GetID method): " + shape.GetID() + "\n";
               info += "Type: " + shape.GetType() + "\n";
               info += "Title: " + shape.GetTitle() + "\n";
               info += "Description: " + shape.GetDescription() + "\n";
               info += "More Info URL: " + shape.GetMoreInfoURL() + "\n";
               info += "Photo URL: " + shape.GetPhotoURL() + "\n";
             
               fillColor = shape.GetFillColor();
               info += "Fill Color: R: " + fillColor.R +
                       " | G: " + fillColor.G +
                       " | B: " + fillColor.B +
                       " | A: " + fillColor.A +
                       "\n";
          
               lineColor = shape.GetLineColor();  
               info += "Line Color: R: " + lineColor.R +
                       " | G: " + lineColor.G +
                       " | B: " + lineColor.B +
                       " | A: " + lineColor.A + "\n"; 
             
               info += "Line Width: " + shape.GetLineWidth() + "\n";

               alert(info);
            }
            else
            {
               alert("No shape information.");
            }
         }
      </script>
   </head>
   <body onload="GetMap();" style="font-family:Arial">
      <div id='myMap' style="position:relative; width:400px; height:400px;"></div>
      <a href='#' onclick="SwapPoints()">Swap Points</a><br />
      Click a shape to get more info.<br />
   </body>
</html>

See Also

Reference

VEShape.GetDescription Method