amcharts Pie Donut 3D

by jevonmahoney

HTML

<script src="http://www.amcharts.com/lib/3/amcharts.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/pie.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/ammap_amcharts_extension.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/maps/js/worldLow.js" type="text/javascript"></script>
<div style="width: 100%; height: 362px; position: relative;">
    <div id="chartdiv" style="width: 200px; height: 150px; position: absolute; bottom: 0; right: 0; z-index: 100;"></div>
    <div id="mapdiv" style="width: 100%; height: 362px; position: absolute; top: 0; left: 0;"></div>
</div>

JavaScript

var map;

var chart;
var chartData = {};

chartData.world = [
    { source: "Oil", energy: 3882.1},
    { source: "Natural Gas", energy: 2653.1},
    { source: "Coal", energy: 3278.3},
    { source: "Nuclear", energy: 610.5},
    { source: "Hydro", energy: 740.3}];

chartData.US = [
    { source: "Oil", energy: 842.9},
    { source: "Natural Gas", energy: 588.7},
    { source: "Coal", energy: 498},
    { source: "Nuclear", energy: 190.2},
    { source: "Hydro", energy: 62.2}];

chartData.CN = [
    { source: "Oil", energy: 404.6},
    { source: "Natural Gas", energy: 79.8},
    { source: "Coal", energy: 1537.4},
    { source: "Nuclear", energy: 15.9},
    { source: "Hydro", energy: 139.3}];

chartData.RU = [
    { source: "Oil", energy: 124.9},
    { source: "Natural Gas", energy: 350.7},
    { source: "Coal", energy: 82.9},
    { source: "Nuclear", energy: 37},
    { source: "Hydro", energy: 39.8}];

chartData.IN = [
    { source: "Oil", energy: 148.5},
    { source: "Natural Gas", energy: 46.7},
    { source: "Coal", energy: 245.8},
    { source: "Nuclear", energy: 3.8},
    { source: "Hydro", energy: 24}];

chartData.JP = [
    { source: "Oil", energy: 197.6},
    { source: "Natural Gas", energy: 78.7},
    { source: "Coal", energy: 108.8},
    { source: "Nuclear", energy: 62.1},
    { source: "Hydro", energy: 16.7}];

AmCharts.ready(function() {
    // *** CREATE CHART *********************************************************
    // PIE CHART
    chart = new AmCharts.AmPieChart();

    // title of the chart
    chart.addLabel("0", "!20", "World", "center", 16);

    chart.backgroundAlpha = 0.4;
    chart.backgroundColor = "#000000";
    chart.dataProvider = chartData.world;
    chart.titleField = "source";
    chart.valueField = "energy";
    chart.sequencedAnimation = true;
    chart.startEffect = "elastic";
    chart.labelsEnabled = false;
    chart.labelText = "[[title]]";
    chart.startDuration = 2;
    chart.labelRadius = 10;

    // WRITE              ...