Step By Step integrating Bing Maps in MS CRM 2011
08 Nov 2011 5 Comments
in MS CRM 2011, Step By Step MS CRM 2011
In this post I am going to show, how easily we can integration bingmap in MS CRM 2011. I am going to create a html webresource which will show account’s city location on bing maps based on city address.
Here are the steps to implement the same
- First steps is to get Bingmap developers key.
- Create an html page and use below code in this page and save that page. (you can put this page in intpub location and can test this in your browser, in that case you need to hardcode city value).
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://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=”http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0″></script>
<script type=”text/javascript”>
var map = null;
function GetMap() {
// Initialize the map
map = new Microsoft.Maps.Map(document.getElementById(“mapDiv”), { credentials: “Your BingMap Key”, mapTypeId: Microsoft.Maps.MapTypeId.road });
}
function ClickGeocode(credentials) {
map.getCredentials(MakeGeocodeRequest);
}
function MakeGeocodeRequest(credentials) {
//Get City value from MS CRM account’s form
var geocodeRequest = “http://dev.virtualearth.net/REST/v1/Locations/” + window.parent.Xrm.Page.getAttribute(‘address1_city’).getValue() + “?output=json&jsonp=GeocodeCallback&key=” + credentials; //make sure to replace field name if you are using custom field.
CallRestService(geocodeRequest);
}
function GeocodeCallback(result) {
if (result &&
result.resourceSets &&
result.resourceSets.length > 0 &&
result.resourceSets[0].resources &&
result.resourceSets[0].resources.length > 0) {
// Set the map view using the returned bounding box
var bbox = result.resourceSets[0].resources[0].bbox;
var viewBoundaries = Microsoft.Maps.LocationRect.fromLocations(new Microsoft.Maps.Location(bbox[0], bbox[1]), new Microsoft.Maps.Location(bbox[2], bbox[3]));
map.setView({ bounds: viewBoundaries });
var location = new Microsoft.Maps.Location(result.resourceSets[0].resources[0].point.coordinates[0], result.resourceSets[0].resources[0].point.coordinates[1]);
var pushpin = new Microsoft.Maps.Pushpin(location);
map.entities.push(pushpin);
}
}
function CallRestService(request) {
var script = document.createElement(“script”);
script.setAttribute(“type”, “text/javascript”);
script.setAttribute(“src”, request);
document.body.appendChild(script);
}
</script>
</head>
<body onload=”GetMap();ClickGeocode();”>
<div id=’mapDiv’ style=”position:relative; width:400px; height:400px;”></div>
</body>
</html>
3. Create a HTML webresource and upload your html page here.
4. Open account form and Create a new Tab let’s say Accountlocation.
5. Add a new webresource and browse your webresource from web resource lookup.
6. Save and publish your form.
7. Open any account record and check for Account location tab.
Enjoy !!!
Reference : Bing Maps SDK
Nov 21, 2011 @ 09:59:40
Hi Mahender,
I been trying your solution from many day, Howsoever, i am not able to produce the output. I think there is some problem with the HTML code you have provided. Tried to hard code the link according to your method but still i am unable to open the page in to normal browser.
Regards,
Shivam Dixit
Nov 21, 2011 @ 15:45:03
Did you tried to debug your page to check if you are getting correct link ??
Apr 12, 2012 @ 08:28:34
I will right away grasp your rss feed as I can’t to find your email subscription hyperlink or newsletter service. Do you’ve any? Please permit me know in order that I may subscribe. Thanks.
Apr 12, 2012 @ 08:33:54
Great Job !!
It worked perfectly for me and deploying it was a cake-walk
Thanks !!