Virtual Earth map control SDK 6.1
Show Map
The first step to use the Virtual Earth map control is to display a map on the website.
Show default map
To display a default map containing all navigation functions, complete these steps:
Add the following doctype declaration at the top of the HTML page.
Copy code
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> Add a meta element in the title section of the HTML page, set its charset attribute to "UTF-8", as shown below.
Copy code
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"> note:
The page must be encoded in UTF-8 to draw a specific element of the map.
You can also add a reference to the map control in the title section, as shown below.
Copy code
<SCRIPT type = "text/JavaScript" src = "http://dev.ditu.live.com/mapcontrol/mapcontrol.ashx? V = 6.1 ">
</SCRIPT> in the body of the page, add a div element to the page to contain the map. The size of a map is defined by the height and width of the DIV element. Use the "location", "TOP", and "Left" attributes to set the location of the map. You can set these values in two ways: one is to specify a value directly in the property, the other is to define these values in the style class, and then reference the class, as shown below.
Copy code
<Div id = 'mymap' style = "position: absolute; width: 400px; Height: 400px;"> </div> or
Copy code
. Map {
Position: absolute;
Top: 20;
Left: 10;
Width: 400px;
Height: 400px;
Border: #555555 2px solid;
}
...
<Div id = "map" class = "map"> </div> note:
If no width is specified, the default width is 600 pixels. The default height is 400 pixels. To achieve compatibility between different browsers, always specify the location attribute ("absolute" and "relative" are valid values ). If the percentage width and height are used in the map Div, they are the percentages of the width and height relative to the parent element, respectively.
Create an instance for the vemap class and call the vemap. loadmap method, as shown below.
Copy code
VaR map = new vemap ('mymap ');
Map. loadmap (); note:
In most cases, you must call the loadmap method before calling the vemap method or attempting to access the vemap attribute. However, there are some exceptions that require calling after the vemap object is created and before the loadmap method is called for the new object, as shown below:
Vemap. onloadmap attributes
Vemap. setdashboardsize Method
Customize a map when it is loaded
You can also specify the location, zoom level, and style of the map when loading the map for the first time. To complete the preceding tasks, use the overloaded vemap as follows. the loadmap method function is used to transmit the location, zoom level, map style, whether the map is locked, map mode, whether to display the map mode switch, and how large the graph block buffer is needed to display the surrounding area of the map.
Copy code
VaR map = new vemap ('mymap ');
Map. loadmap (New velatlong (39.8540, 116.237), 10, vemapstyle. Road, false, vemapmode. mode2d, true, 1); example
The following is an example of a complete webpage (containing all the elements required to display a map.
JScript copy code
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
