stock Stock multiple data sets

by amcharts

HTML

<script src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="http://www.amcharts.com/lib/3/serial.js"></script>
<script src="http://www.amcharts.com/lib/3/amstock.js"></script>
<div id="chartdiv" style="width: 100%; height: 355px;margin: 500px 0;"></div>

CSS

body
{
    font-size:12px;
    color:#000000;
    background-color:#ffffff;
    font-family:verdana,helvetica,arial,sans-serif;
}

#chartdiv {
    pointer-events:none;
}
.amChartsButtonSelected
{
   background-color:#CC0000;
   border-style:solid;
   border-color:#CC0000;
   border-width:1px;
   color:#FFFFFF;
  -moz-border-radius: 5px;
  border-radius: 5px;
  margin: 1px;   
}

.amChartsButton
{
   background-color:#EEEEEE;
   border-style:solid;
   border-color:#CCCCCC;
   border-width:1px;
   color:#000000;
  -moz-border-radius: 5px;
  border-radius: 5px;
  margin: 1px;  
}

.amChartsCompareList
{
   border-style:solid;
   border-color:#CCCCCC;
   border-width:1px;
}

JavaScript

// MOVING AVERAGE PLUGIN FOR JAVASCRIPT STOCK CHARTS FROM AMCHARTS //
AmCharts.averageGraphs = 0;
AmCharts.addMovingAverage = function (dataSet, panel, field) {
    // update dataset
    var avgField = "avg"+AmCharts.averageGraphs;
    dataSet.fieldMappings.push({
        fromField: avgField,
        toField: avgField});
    
    // calculate moving average
    var fc = 0;
    var sum = 0;
    for (var i = 0; i < dataSet.dataProvider.length; i++) {
        var dp = dataSet.dataProvider[i];
        if (dp[field] !== undefined) {
            sum += dp[field];
            fc++;
            dp[avgField] = Math.round(sum / fc * 10) / 10;
        }
    }
    
    // create a graph
    var graph = new AmCharts.StockGraph();
    graph.valueField = avgField;
    panel.addStockGraph(graph);
    
    // increment average graph count
    AmCharts.averageGraphs++;
    
    // return newly created StockGraph object
    return graph;
}

var chartData = [];

function generateChartData() {
    var firstDate = new Date();
    firstDate.setDate(firstDate.getDate() - 500);
    firstDate.setHours(0, 0, 0, 0);

    for (var i = 0; i < 500; i++) {
        var newDate = new Date(firstDate);
        newDate.setDate(newDate.getDate() + i);

        var a = Math.round(Math.random() * (40 + i)) + 100 + i;
        var b = Math.round(Math.random() * (1000 + i)) + 500 + i * 2;

        chartData.push({
            date: newDate,
            value: a,
            volume: b
        });
    }
}

AmCharts.ready(function() {
    generateChartData();
    createStockChart();
});

function createStockChart() {
    var chart = new AmCharts.AmStockChart();
    chart.pathToImages = "http://www.amcharts.com/lib/images/";

    // DATASETS //////////////////////////////////////////
    // create data sets first
    var dataSet = new AmCharts.DataSet();
    dataSet.title = "Data set";
    dataSet.fieldMappings = [{
        fromField: "value",
        toField: "value"},
    {
        fromField: "volume",
    ...