ColdFusion in Baltimore Rotating Header Image


Creating dynamic thematic drill down maps ONLY with ColdFusion

Here is a step-by-step on how to create data driven thematic (choropleth) maps in ColdFusion. No other software needed. Who needs BI software?

1- Download the (shape file) and usa.xml (webcharts project -XML file)

2- Place into your X:ColdFusionWEB-INFcfusionlibmapsCountries directory

3- Edit the usa.xml file to  point to the file (line 6)

4- Get some data from somewhere. has data on Medicaid. I used the 2008 total $ paid.

And here’s the code..I used some code from Ray Camden’s thanks Ray.

[coldfusion]<!—set values and colors —>
minamount = minmax.minamount;
maxamount = minmax.maxamount;
lo_amount = minamount;
tenth = (maxamount-minamount)/10;
next_Amount = lo_amount+tenth;
row = 1;
<cfloop list=”#bluelist#” index=”value”>
row = row+1;
lo_amount = next_Amount;
tenth = (maxamount-minamount)/10;
next_Amount = next_Amount+tenth;

<!— Get base server url —>
<cfif len(CGI.HTTPS)>
<cfset baseURL = “https://”& CGI.HTTP_HOST &”/cfusion/”>
<cfset baseURL = “http://”& CGI.HTTP_HOST &”/cfusion/”>
<!— Extract chart style from the WCP file —>
<cffile action=”read” file=”#ExpandPath(‘rusa.wcp’)#” variable=”xmlResult”>
<cfset xmlResult = XmlParse(
REReplace(xmlResult, “^[^<]*”, “”, “all” )
) />
<cfset wcp = XMLParse(xmlResult)>
<cfset chartStyle = ToString(>
<!— Create chart data <cfdump var=”#usatotals#”>—>

<cfsavecontent variable=”chartModel”>
<?xml version=”1.0″ encoding=”UTF-8″?>
<map name=”USA”>
<cfoutput query=”usatotals”>
<!— set bg color —>
<cfloop query=”colorQ”>
<cfif usatotals.totalsum GTE lo_value AND usatotals.totalsum LTE hi_value>
<cfset backcolor = color>
<item name=”#st_desc#” backColor=”#backColor#” popup=”$(name)n$$(value)” value=”#NumberFormat(totalsum,”___.__,”)#”/> </cfoutput>
<!— Initialize chart settings —>
oMyWebChart = createObject(“Java”,””);
oMyApp = getPageContext().getServletContext();
oSvr = oMyWebChart.getDefaultInstance(oMyApp);
oMyChart2 = oSvr.newImageSpec();
oMyChart2.width = 720;
oMyChart2.height= 465;
oMyChart2.type = “png”; = “#chartStyle#”;
oMyChart2.model = “#chartModel#”;
<!— Create html tag set —>
<cfsavecontent variable=”chartImgTag”>
<cfoutput>#oSvr.getImageTag(oMyChart2, baseURL& “CFIDE/GraphData.cfm?graphCache=wc50&graphID=”)#</cfoutput>
<!— Good old Webcharts loves to add an extra /Images/ to the URL —>
<cfset chartImgTag = replace(chartImgTag, baseURL &”Images/”, baseURL, “All”)>

<span class=”important”>Medicaid Total Amount Paid –
FY<cfoutput>#url.fy# – #DollarFormat(grandtotals.totalsum)#</cfoutput></span><br />
(click a state to drill down)
<table width=”100%” border=”0″ cellpadding=”0″ cellspacing=”5″>
<td align=”left” valign=”top”><cfoutput>
<table width=”100%” border=”0″ cellspacing=”0″ cellpadding=”2″>
<tr bordercolor=”##000000″>
<td colspan=”2″ class=”style17″>Map legend (in millions)</td>
<td><span class=”style17″>Data unavailable </span></td>
<!— set colors and values —>
<cfloop query=”colorQ”>
<td bgcolor=”#color#”>&nbsp;</td>
<td><span class=”style17″>#DollarFormat(lo_value/1000000)# – #DollarFormat(hi_value/1000000)#</span></td>