Developers Zone Embed a CMaps View

After exporting a CMaps Analytics view from Designer, as a developer you need to embed and connect live data.

There are 3 building blocks required to embed a CMaps Analytics view

JQuery– We support V1.8-latest version. CMaps Analytics uses very few JQuery dependencies but it is still a requirement.

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>

CMaps Analytics JS API– Loading the CMaps Analytics Javascript API will power the entire maps experience

<script src="http://api.cmapsanalytics.net/mapview?version=1.2&amp;authkey=[ENTERKEY]"></script>

XML Configuration Embedded in HTML- When you export an example HTML file, the XML Configuration data is embedded.

var mapCfg = '<mapView createdBy="name:cMapsAnalyticsDesigner;version:1.2" createdOn="4/21/2015"><viewName>My View</viewName><viewDescription></viewDescription><tags></tags><key>[ENTERKEY]</key><googlePremierKey></googlePremierKey><dynamicZoomEnabled>true</dynamicZoomEnabled>...</mapView>';

Important Notes About XML Configuration

1. You will not want to dynamically generate or modify the XML properties programmatically. Instead you have the CMaps Analytics JS API, which can control every property and ultimately grant much more control.
2. Typically, the XML wont be embedded with your code. Instead you can load the XML as a resource for your application.

Alternative code for loading XML as an external resource

function init(){
cMap.parseConfigXml({url:"http://centigontesting.com/centigonTestView/DriveDistanceOpportunityAnalyzer/MapCfg.xml"});
};

Create the Map Instance- The following will buld the map and automatically consume the XML Configuration data. This of course assumes that the XML Data file is embedded inside of the HTML file.

var cMap;
function buildMap(){
//creates the map instance
cMap = new centigon.locationIntelligence.MapView();
cMap.parseConfigXml(mapCfg);
}

Feed Map Data- Feeding your map view is accomplished by declaring each data property and feeding it an array. locations are technically the only required field to plot points or regions on a map, but the labels and values create context for end users. For a multi-layer map, you would feed each property an array of arrays. We will cover this in multi-layer maps template.

cMap.onLayersReady = function(){
cMap.locations([['San Diego', 'Los Angeles', 'San Francisco', 'Oceanside, CA', 'Mammoth Lakes, CA']]);//2-dimensional array, where each Array value corresponds to its layer
cMap.labels([['San Diego', 'Los Angeles', 'San Francisco', 'Oceanside, CA', 'Mammoth Lakes, CA']]);//2-dimensional array, where each Array value corresponds to its layer
cMap.values([[10, 20, 30, 40, 50]]);//2-dimensional array, where each Array value corresponds to its layer
}

DOWNLOAD:

Map View with Basic Data Binding

Want to modify the Alerts and Alert Thresholds with CMaps API Dynamically from your App? 

cMap.alertEnabled([true]);//1-dimensional array, where each Boolean value corresponds to its layer
cMap.alertColors([["#00FF00","#FFFF00","#00FFFF", "#CFCFCF"]]);//2-dimensional array, where each Array value corresponds to its layer
cMap.alertLimits([[15,25,35,60]]);//2-dimensional array, where each Array value corresponds to its layer

DOWNLOAD:

CMaps View with Basic Data Binding and Alerts