FusionCharts - Data Enabled Markers with connectors in a map
Created using FusionCharts Suite XT - www.fusioncharts.com
by Gary Cline
HTML
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.maps.js"></script>
<script src="http://static.fusioncharts.com/code/latest/maps/fusioncharts.usa.js"></script>
<script src="http://static.fusioncharts.com/code/latest/themes/fusioncharts.theme.fint.js"></script>
<!-- Data Enabled Markers with connectors in Map showing National warehouses in California, Texas and North Carolina. -->
<div id="HHSXYdiscretUSMap20Div">FusionCharts will render here</div>
JavaScript
< script type = 'text/javascript' >
FusionCharts.ready(function() {
var HHSXYdiscretUSMap20 = new FusionCharts({
type: 'usa',
renderAt: 'HHSXYdiscretUSMap20Div',
width: '600px',
height: '100%',
dataFormat: 'xml',
dataSource: '<map nullEntityAlpha="0" bgColor="E5E3D1" showLegend="1" legendCaption="HHS Discretionary Spending - Top 20 Recipients" legendScaleLineAlpha="0" exposeHoverEvent="0" legendPosition="bottom" showLabels="1" showToolTip="1" showBevel="0" showMarkerToolTip="1" showMarkerLabels="0" showCanvasBorder="0" fillColor="F3F3EB" borderColor="4B555F" baseFont="Verdana" baseFontSize="10" exportHandler="../FusionCharts/Export/Exported_Images/FCExporter.aspx" exportAction="download" exportAtClient="0" exportEnabled="1" ><colorRange><color minValue="-1" maxValue="0" displayValue="$0 Dollars" color="FFFFFF"/><color minValue="1" maxValue="339999999" displayValue="$1 - $340M" color="D5E1F2"/><color minValue="340000000" maxValue="389999999" displayValue="$340M - $390M" color="BCDEFF"/><color minValue="390000000" maxValue="429999999" displayValue="$390M - $430M" color="56ACFF"/><color minValue="430000000" maxValue="519999999" displayValue="$430M - $520M" color="0079EE"/><color minValue="520000000" maxValue="620788284" displayValue="$520M - $620.8M" color="004588"/></colorRange><markers><shapes><shape id="1" type="circle" fillColor="004588" fillPattern="radial" showBorder="1" radius="30"/><shape id="2" type="circle" fillColor="004588" fillPattern="radial" showBorder="1" radius="30"/><shape id="3" type="circle" fillColor="0079EE" fillPattern="radial" showBorder="1" radius="25"/><shape id="4" type="circle" fillColor="0079EE" fillPattern="radial" showBorder="1" radius="23"/><shape id="5" type="circle" fillColor="0079EE" fillPattern="radial" showBorder="1" radius="22"/><shape id="6" type="circle" fillColor="0079EE" fillPattern="radial" showBorder="1" radius="22"/><shape id="7" type="circle" fillColor="0079EE"...