FusionCharts - LinkedCharts from Map to Map

Created using FusionCharts Suite XT - www.fusioncharts.com

by nouse4contact

HTML

<script src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<!-- 
World population density map showing LinkedCharts with drill down from one map to another map
-->
<div id="chart-container">FusionCharts will render here</div>

JavaScript

FusionCharts.ready(function() {
  var populationMap = new FusionCharts({
    type: 'world',
    renderAt: 'chart-container',
    width: '700',
    height: '500',
    dataFormat: 'json',
    dataSource: {
      "chart": {
        "caption": "World Population Density",
        "subcaption": "Number of people per Square Mile",
        "theme": "fusion",
        "formatNumberScale": "0",
        "showLabels": "1",
        "nullEntityColor": "#C2C2D6",
        "nullEntityAlpha": "50",
        "hoverOnNull": "0",
        "useSNameInLabels": "0",
        "entityFillColor": "#A8A8A8",
        "entityFillHoverColor": "#E5E5E9"
      },
      "colorrange": {
        "startlabel": "Low",
        "endlabel": "High",
        "code": "#e44a00",
        "minvalue": "0",
        "gradient": "1",
        "color": [{
            "maxvalue": "60",
            "displayvalue": "Average",
            "code": "#f8bd19"
          },
          {
            "maxvalue": "300",
            "code": "#6baa01"
          }
        ]
      },

      "data": [{
          "id": "NA",
          "displayValue": "North America",
          "value": "57.2",
          "link": "newchart-json-NA"
        },
        {
          "id": "SA",
          "value": "57.1",
          "showLabel": "1",
        },
        {
          "id": "AS",
          "value": "247",
          "showLabel": "1",
        },
        {
          "id": "EU",
          "value": "188.5",
          "showLabel": "1",
        },
        {
          "id": "AF",
          "value": "87.2",
          "showLabel": "1",
        },
        {
          "id": "AU",
          "value": "8.32",
          "showLabel": "1",
        }

      ],
      "linkeddata": [{
        "id": "NA",
        "linkedchart": {

          "chart": {
            "caption": "US Population Density by State",
            "subcaption": "Number of people per Square Mile",
            "entityFillHoverColor": "#cccccc",
            "showLabels": "1",
           ...