The previous articles described how to use Bing map control to display maps. However, operations are complicated for beginners. If you want to easily access Bing map, this article describes how to embed a Silverlight map into your webpage.
1. Add a simple mapTo embed a map in your page, you only need to add an IFRAME label to your page and set the SRC parameter to the URL of the embedded map. The specific method is as follows:
1. Create a simple HTML page named addembedingmap.htm.
2. Modify the Code as follows:
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" <br/> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br/> <HTML> <br/> <pead> <br/> <title> embedded Map </title> <br/> <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8 "> <br/> </pead> <br/> <body style =" font-family: Arial "mce_style =" font-family: arial "> <br/> <p> A simple embedded map. </P> <br/> <IFRAME width = "400" Height = "300" frameborder = "0" scrolling = "no" marginheight = "0" marginwidth = "0" <br/> src = "http://dev.virtualearth.net/embeddedMap/v1/silverlight/road" mce_src = "http://dev.virtualearth.net/embeddedMap/v1/silverlight/road"/> <br/> </body> <br/> </ptml> <br/>
3. You can view the map information on the HTTP Rule Page.
Ii. Using embedded map featuresYou can add parameters to the map URL to customize the embedded map, as shown in the following code: Set the map style to aerial, zoom level to 10, and set it to center display, you can also add a pushpin to the map ).
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" <br/> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br/> <HTML> <br/> <pead> <br/> <title> embedded Map </title> <br/> <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8 "> <br/> </pead> <br/> <body style =" font-family: Arial "mce_style =" font-family: arial "> <br/> <p> A simple embedded map. </P> <br/> <IFRAME width = "400" "Height =" 300 "frameborder =" 0 "scrolling =" no "marginheight =" 0 "marginwidth =" 0 "<br/> src =" http://dev.virtualearth.net/embeddedMap/v1/silverlight/aerial? Zoomlevel = 10 faster ER = 47.5 _-122.5 & pushpins = 47.5 _-122.5 "mce_src =" http://dev.virtualearth.net/embeddedMap/v1/silverlight/aerial? Zoomlevel = 10 & center = 47.5 _-122.5 & pushpins = 47.5 _-122.5 "/> <br/> </body> <br/> </ptml> <br/>
3. Embedded map URL parametersThe format of embedded map URL parameters is as follows:
Http://dev.virtualearth.net/embeddedmap/v1/silverlight/#mapmode }? Zoomlevel = {zoomlevel} extends ER = {Center} & heading = {heading} & pushpins = {pushpins} & Culture = {culture} </P> <p>
The following table lists the available parameter information of the map URL. These parameters can be sorted at will, and these parameters are optional.
| Parameter Name | Description |
|---|---|
Mapmode |
The style used to describe the map. Available values include: Road, aerial, aerialwithlabels, Birdseye, birdseyewithlabels |
Zoomlevel |
OneIntNumeric value is used to indicate a valid image style amplification level. |
Center |
TwoDoublesThe longitude and latitude information of the Data Type relative to the center of the map. |
Heading |
OneDoubleThe value of the type specifies the orientation of the map, in degrees. |
Pushpins |
TwoDoublesThe longitude and latitude information of the type value relative to the graph nail. Locate and use multiple map nails ~ Characters are separated. |
Culture |
A validStringDescription Language. The default value is "En-us ". |
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
