Bing Maps AJAX Control version 7 – Loading the Map & Localized Labels

In a previous blog post I had introduced some of the new features in the Bing Maps AJAX Control version 7. I had mentioned that we are very excited about this new version but also that it is a complete redesign with breaking changes. Don’t worry we have not planned for the end-of-life of version 6.3 yet and when we make an announcement it will be with ample time to migrate your applications. However, since v7 is indeed new and different I would like to start with a series of blog posts that walk you through some of the more frequently used functions in comparison to v6.3. All blog posts will be accompanied by interactive examples which demonstrate functionality and provide access to the source code. You will find this example on my Windows Azure account here.

Version 6.3
When you load the Bing Maps AJAX Control in version 6.3 you can add market-parameters for localized labels as well as various options for example to set the dashboard-colour and to use the new map style.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Bing Maps - v6.3</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3&mkt=de-DE"></script>

<script type="text/javascript">
var map = null;

function GetMap() {
map = new VEMap('myMap');

var mapOptions = new VEMapOptions();
mapOptions.DashboardColor = 'black';
mapOptions.UseEnhancedRoadStyle = true;
map.LoadMap(new VELatLong(54.87350326912944, 15.333815098500053), 4, 'r', false, VEMapMode.Mode2D, true, 0, mapOptions);
}
</script>
</head>
<body onload="GetMap();">
<div id='myMap' style="position:absolute; top:0px; left:0px; width:100%; height:100%;"></div><br />
</body>
</html>

Version 7.0
In version 7 you have the same options to provide market-parameters for localzed labels but namespace and object structure have changed. The Bing Maps Key which was previously technically not enforced is now a mandatory requirement. If you don’t have such a Bing Maps Key yet you can get one at the Bing Maps Account Centre.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Bing Maps - v7.0</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0&mkt=de-DE"></script>

<script type="text/javascript">
var map = null;
var MM = Microsoft.Maps;

function GetMap() {
map = new MM.Map(document.getElementById("myMap"), {
credentials: "Your Bing Maps Key",
center: new MM.Location(54.87350326912944, 15.333815098500053),
mapTypeId: "r",
zoom: 4
});
}
</script>
</head>
<body onload="GetMap();">
<div id='myMap' style="position:absolute; top:0px; left:0px; width:100%; height:100%;"></div><br />
</body>
</html>


 

About these ads
This entry was posted in AJAX, Bing Maps and tagged , , , , , . Bookmark the permalink.

5 Responses to Bing Maps AJAX Control version 7 – Loading the Map & Localized Labels

  1. rohit.asthana says:

    I used in version 6.3 a method named as VEMap.Find()

    But in version 7.0 there is no such kind of method to find location nearby latlong.

    Is there any way to find it?

    Thanks

    • Hi there. Something similar to the Find-method is intentionally not part of the v7 SDK to keep it slim and fast. You would need to use the AJAX SDK along with the REST web service SDK as described here: http://msdn.microsoft.com/en-us/library/gg427601.aspx. I will blog about this in my next post but in the meantime you will find a working example and source code here: http://talkingdonkey.cloudapp.net/BM-AJ-V7/Default.aspx

      • rohit.asthana says:

        Hi,

        I used the given logic by you which you implemented in your sample code. But results are getting very bad. Suppose I searched “Reebok” to near by our location. But every time it will navigate to south Africa. I think Bing Map results specially in INDIA region gives wrong location.? But in case of “Reebok” if i searched it your code as well, it will navigate to same south africa .

  2. rohit.asthana says:

    Help me

  3. Pingback: Bing Maps AJAX Control version 7 – Adding Vector Data | Hannes's Virtual Earth

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s