Simple Pie Chart with requireJS + plugins

by Hollie Szadowski

HTML

<script src="http://requirejs.org/docs/release/2.1.11/minified/require.js"></script>
<script src="//cdn.amcharts.com/lib/3/amcharts.js"></script>
<script src="//cdn.amcharts.com/lib/3/pie.js"></script>
<div id="chartdiv" style="width: 600px; height: 400px;"></div>

JavaScript

// SETUP CONFIG
requirejs.config( {

    // Define paths; relative from js folder
    paths: {
        'amcharts': '//cdn.amcharts.com/lib/3/amcharts',
        'amcharts.funnel': '//cdn.amcharts.com/lib/3/funnel',
        'amcharts.gauge': '//cdn.amcharts.com/lib/3/gauge',
        'amcharts.pie': '//cdn.amcharts.com/lib/3/pie',
        'amcharts.radar': '//cdn.amcharts.com/lib/3/radar',
        'amcharts.serial': '//cdn.amcharts.com/lib/3/serial',
        'amcharts.xy': '//cdn.amcharts.com/lib/3/xy',

        'amcharts.plugins.responsive': '//cdn.amcharts.com/lib/3/plugins/responsive/responsive',
        'amcharts.plugins.dataloader': '//cdn.amcharts.com/lib/3/plugins/dataloader/dataloader',
        'amcharts.plugins.export': '//cdn.amcharts.com/lib/3/plugins/export/export',
    },

    // Define dependencies
    shim: {
        'amcharts.funnel': {
            deps: [ 'amcharts' ],
            exports: 'AmCharts',
            init: function() {
                AmCharts.isReady = true;
            }
        },
        'amcharts.gauge': {
            deps: [ 'amcharts' ],
            exports: 'AmCharts',
            init: function() {
                AmCharts.isReady = true;
            }
        },
        'amcharts.pie': {
            deps: [ 'amcharts' ],
            exports: 'AmCharts',
            init: function() {
                AmCharts.isReady = true;
            }
        },
        'amcharts.radar': {
            deps: [ 'amcharts' ],
            exports: 'AmCharts',
            init: function() {
                AmCharts.isReady = true;
            }
        },
        'amcharts.serial': {
            deps: [ 'amcharts' ],
            exports: 'AmCharts',
            init: function() {
                AmCharts.isReady = true;
            }
        },
        'amcharts.xy': {
            deps: [ 'amcharts' ],
            exports: 'AmCharts',
            init: function() {
                AmCharts.isReady = true;
            }
        },
       ...