Visualizing Salesforce Data with Google GeoMaps
Less than 30 lines of code!
Source Code: https://github.com/arun-sfdc/Analytics-API/blob/master/googleMapReportChart
What better way to look at your geographic data than using Maps? In this post we will see how easy it is to integrate data from Salesforce reports with Google GeoMaps. This is the second post in the Analytics API series. (Previous post on Salesforce + D3 charts).
Step1: Setup the Source Report
With the emergence of the Analytics API we can use user-defined reports as data sources for our applications. In this post, we will use a simple summary report as our data source. This report shows the number of “Open Cases” by source Country.
Step2: Transform Report Result to Google DataTable
Almost all the Google Visualizations use a standard data format called the data table. Now we will transform the results from the Analytics API into that format.
var chartPoints = []; $.each(reportResult.groupingsDown.groupings, function (index, value) { chartPoints.push([value.label, reportResult.factMap[value.key + “!T”].aggregates[0].value]); }); var options = {}; var labels = [ [‘Country’, ‘Metric’] ]; var myData = google.visualization.arrayToDataTable(labels.concat(chartPoints));
Step3: Visualize!
The last step of course, is to initialize a google map with the newly created data table.
var chart = new google.visualization.GeoMap(document.getElementById(‘chart’));
chart.draw(myData, options);
There you have it, Google GeoMaps on Salesforce Data in under 30 lines of code. The entire component is available for download as a self-contained Visualforce Page on Github (https://github.com/arun-sfdc/Analytics-API/blob/master/googleMapReportChart).
