Bubbles with FusionCharts

by cristiscu

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.js" type="text/javascript"></script>
<script src="http://static.fusioncharts.com/code/latest/fusioncharts.charts.js" type="text/javascript"></script>
<div id="chart_div"></div>

JavaScript

$(function () {
    
    var options = {
        renderAt: "chart_div", dataFormat: "json",
        width: "300",
        height: "185",
        type: "bubble",
        dataSource: { chart: { } }
    };
    var seriesNames = [ "USA", "France", "Germany" ];
    var dataSource = [
        { year: 2000, y1: 40, z1: 1, y2: 20, z2: 1, y3: 0, z3: 1 },
        { year: 2001, y1: 62, z1: 1, y2: 12, z2: 3, y3: 6, z3: 1 },
        { year: 2002, y1: 53, z1: 3, y2: 19, z2: 2, y3: 8, z3: 1 },
        { year: 2003, y1: 49, z1: 1, y2: 28, z2: 1, y3: 10, z3: 2 },
        { year: 2004, y1: 52, z1: 2, y2: 42, z2: 3, y3: 12, z3: 1 },
        { year: 2005, y1: 32, z1: 1, y2: 75, z2: 1, y3: 15, z3: 3 },
        { year: 2006, y1: 28, z1: 3, y2: 80, z2: 3, y3: 17, z3: 1 },
        { year: 2007, y1: 46, z1: 1, y2: 55, z2: 1, y3: 18, z3: 2 },
        { year: 2008, y1: 55, z1: 2, y2: 45, z2: 2, y3: 25, z3: 1 },
        { year: 2009, y1: 88, z1: 1, y2: 38, z2: 1, y3: 18, z3: 2 },
        { year: 2010, y1: 68, z1: 1, y2: 29, z2: 1, y3: 24, z3: 2 },
        { year: 2011, y1: 63, z1: 1, y2: 19, z2: 1, y3: 29, z3: 1 },
        { year: 2012, y1: 65, z1: 1, y2: 14, z2: 3, y3: 31, z3: 3 },
        { year: 2013, y1: 68, z1: 2, y2: 18, z2: 1, y3: 52, z3: 2 },
        { year: 2014, y1: 48, z1: 1, y2: 16, z2: 1, y3: 72, z3: 3 },
        { year: 2015, y1: 39, z1: 3, y2: 13, z2: 2, y3: 63, z3: 1 },
        { year: 2016, y1: 20, z1: 1, y2: 10, z2: 1, y3: 10, z3: 1 }
    ];
    options.dataSource.chart.labelDisplay = 'rotate';
    options.dataSource.categories = [{ category: [ ]}];
    for (var i = 0; i < dataSource.length; i++)
        options.dataSource.categories[0].category.push({ label: dataSource[i].year.toString() });
    options.dataSource.dataset = [{ seriesname: seriesNames[0], data: [ ] }];
    for (var i = 0; i <= 6; i++) {
        options.dataSource.dataset[0].data.push({
            x: dataSource[i].year,
            y: dataSource[i].y1,
            z: Math.ceil((10 + 5 * (dataSource[i].z1 -...