{"id":617,"date":"2011-11-08T09:54:59","date_gmt":"2011-11-08T09:54:59","guid":{"rendered":"http:\/\/mahenderpal.wordpress.com\/?p=617"},"modified":"2011-11-08T09:54:59","modified_gmt":"2011-11-08T09:54:59","slug":"step-by-step-integrating-bing-maps-in-ms-crm-2011","status":"publish","type":"post","link":"https:\/\/himbap.com\/blog\/?p=617","title":{"rendered":"Step By Step integrating Bing Maps in MS CRM 2011"},"content":{"rendered":"

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\u2019s city location on bing maps based on city address.<\/p>\n

Here are the steps to implement the same<\/p>\n

    \n
  1. First steps is to get Bingmap developers key<\/a>.<\/li>\n
  2. 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).<\/li>\n<\/ol>\n

    <!DOCTYPE html PUBLIC “-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN” “http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd”><\/p>\n

    <html><\/p>\n

    \u00a0\u00a0 <head><\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0 <title><\/title><\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0 <meta http-equiv=”Content-Type” content=”text\/html; charset=utf-8″><\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0 <script type=”text\/javascript” src=”http:\/\/ecn.dev.virtualearth.net\/mapcontrol\/mapcontrol.ashx?v=7.0″><\/script><\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0 <script type=”text\/javascript”><\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var map = null;<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 function GetMap() {<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Initialize the map<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 map = new Microsoft.Maps.Map(document.getElementById(“mapDiv”), { credentials: “Your BingMap Key”, mapTypeId: Microsoft.Maps.MapTypeId.road });<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 function ClickGeocode(credentials) {<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 map.getCredentials(MakeGeocodeRequest);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 function MakeGeocodeRequest(credentials) {<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/Get City value from MS CRM account\u2019s form<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var geocodeRequest = “http:\/\/dev.virtualearth.net\/REST\/v1\/Locations\/” + window.parent.Xrm.Page.getAttribute(‘address1_city’).getValue()<\/strong> + “?output=json&jsonp=GeocodeCallback&key=” + credentials; \/\/make sure to replace field name if you are using custom field.<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 CallRestService(geocodeRequest);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 function GeocodeCallback(result) {<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 if (result &&<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 result.resourceSets &&<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 result.resourceSets.length > 0 &&<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 result.resourceSets[0].resources &&<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 result.resourceSets[0].resources.length > 0) {<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \/\/ Set the map view using the returned bounding box<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var bbox = result.resourceSets[0].resources[0].bbox;<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var viewBoundaries = Microsoft.Maps.LocationRect.fromLocations(new Microsoft.Maps.Location(bbox[0], bbox[1]), new Microsoft.Maps.Location(bbox[2], bbox[3]));<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 map.setView({ bounds: viewBoundaries });<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var location = new Microsoft.Maps.Location(result.resourceSets[0].resources[0].point.coordinates[0], result.resourceSets[0].resources[0].point.coordinates[1]);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var pushpin = new Microsoft.Maps.Pushpin(location);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 map.entities.push(pushpin);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 function CallRestService(request) {<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 var script = document.createElement(“script”);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 script.setAttribute(“type”, “text\/javascript”);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 script.setAttribute(“src”, request);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 document.body.appendChild(script);<\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 }<\/p>\n

     <\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0 <\/script><\/p>\n

    \u00a0\u00a0 <\/head><\/p>\n

    \u00a0\u00a0 <body onload=”GetMap();ClickGeocode();”><\/p>\n

    \u00a0\u00a0\u00a0\u00a0\u00a0 <div id=’mapDiv’ style=”position:relative; width:400px; height:400px;”><\/div><\/p>\n

    \u00a0\u00a0 <\/body><\/p>\n

    <\/html><\/p>\n

     <\/p>\n

    3.\u00a0 Create a HTML webresource and upload your html page here.<\/p>\n

    \"\"<\/a><\/p>\n

    4. Open account form and Create a new Tab let’s say Accountlocation.<\/p>\n

    5. Add a new webresource\u00a0and browse your webresource from web resource lookup.<\/p>\n

    \"\"<\/a><\/p>\n

     <\/p>\n

    6. Save and publish your form.<\/p>\n

    7. Open any account record and check for Account location tab.<\/p>\n

    \"\"<\/p>\n

    \"\"<\/a><\/p>\n

    Enjoy !!!<\/p>\n

    Reference : Bing Maps SDK<\/a><\/p>\n

     <\/p>\n

     <\/p>\n","protected":false},"excerpt":{"rendered":"

    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\u2019s 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… Read more »<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[5,19],"tags":[],"_links":{"self":[{"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/617"}],"collection":[{"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=617"}],"version-history":[{"count":0,"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/617\/revisions"}],"wp:attachment":[{"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=617"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=617"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/himbap.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=617"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}