Thursday, 19 May 2011

Simple Google Maps in MS Dynamics CRM 4.0

Lately I've been looking at adding google maps to our MS Dynamics CRM 4.0 install. While there are plenty of guides to adding it yourself, most seem overly complex for the task required or need a lot of editing to be functional. Here's a quick, general-use case for adding embedded google maps to CRM 4 entities.

A few notes:
  • All hard-coded variables should work on these entities: Account, Contact, Business unit, and Competitor. For custom entities, you'll need to change the variables.
  • This assumes you're putting the map in an iframe on it's own tab. You'll need to know the names of both.
  • It performs no input validation or removal of illegal characters. Malformed addresses might display incorrectly as a result.

This code should go in the onload form of the entity:

//// Simple Embedded Google Maps in an iframe ////

var maptab = crmForm.all.tab2Tab; // your map tab here
var mapiframe = document.all.IFRAME_map; //your iframe name here

// Load map when the map tab is clicked
maptab.onclick = function() {

//// Loads map into iframe when called //
DrawMap = function() {
    if (crmForm.FormType == 1)
    { mapiframe.src = "about:blank"; }
        // Build the address for google maps 
        var mapUrl = "";
        if (crmForm.all.address1_line1.DataValue != null) 
            { mapUrl = mapUrl + crmForm.all.address1_line1.DataValue + "+"; }
        if (crmForm.all.address1_line2.DataValue != null) 
            { mapUrl = mapUrl + crmForm.all.address1_line2.DataValue + "+"; }
        if (crmForm.all.address1_line3.DataValue != null) 
            { mapUrl = mapUrl + crmForm.all.address1_line3.DataValue + "+"; }
        if (crmForm.all.address1_city.DataValue != null) 
            { mapUrl = mapUrl + crmForm.all.address1_city.DataValue + "+"; }
        if (crmForm.all.address1_stateorprovince.DataValue != null) 
            { mapUrl = mapUrl + crmForm.all.address1_stateorprovince.DataValue + "+"; }
        if (crmForm.all.address1_country.DataValue != null) 
            { mapUrl = mapUrl + crmForm.all.address1_country.DataValue; }
        //Check if there's no address information
        if ( mapUrl == "" )
            mapiframe.src = about:blank;
        else {
            mapUrl = "" + mapUrl + "&output=embed&t=m";
            mapiframe.src = mapUrl;

What this does:
  • Waits for the map tab to be clicked and then calls the DrawMap function (this saves time loading the form)
  • Checks to see if the entity is being created, in which case it will blank out the map.
  • Loads any address values that contain data into mapUrl value
  • Checks that the address actually contains data, and if so:
  • Loads that url into the iframe.
At the end of it, you have something that looks like this:

My example here is slightly different - if selected, the radio buttons above will re-load with directions from our office.

It's surprising just how much you can do by passing parameters in the google maps URL. This example defaults to 'embedded' viewing with output=embed and t=m, but you can use it for quite a few other things like getting directions using saddr and daddr, pull up streetview with cbp=, and a whole range of other things. Mapki seems to have a pretty good list of the known parameters here.

You can quickly and easily integrate google maps with CRM 4, and it makes a lot of tasks incredibly easy. With only a little more work, you could have it throwing up a list of directions from any arbitrary point to any address in your system.