amCharts: base sample

by tiagocarvalho

HTML

<script src="http://www.amcharts.com/lib/amstock.js"></script>
<div id="chartdiv"></div>

CSS

#chartdiv {
    height: 400px;
    margin: 10px;
}

.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;  
}

JavaScript

AmCharts.ready(function () {
    var obj=[{"ID":0,"Day":"Monday","CurrentSales":"34181.71","LastSales":"38378.65","Percentage":"-10.94","cumThis":"34181.71","cumLast":"38378.65","totPerc":"-10.94"},{"ID":1,"Day":"Tuesday","CurrentSales":"15987.87","LastSales":"31529.11","Percentage":"-49.29","cumThis":"50169.58","cumLast":"69907.76","totPerc":"-60.23"},{"ID":2,"Day":"Wednesday","LastSales":"36610.12","Percentage":"","cumThis":"50169.58","cumLast":"106517.88","totPerc":"-60.23"},{"ID":3,"Day":"Thursday","LastSales":"38555.53","Percentage":"","cumThis":"50169.58","cumLast":"145073.41","totPerc":"-60.23"},{"ID":4,"Day":"Friday","LastSales":"39767.79","Percentage":"","cumThis":"50169.58","cumLast":"184841.20","totPerc":"-60.23"},{"ID":5,"Day":"Saturday","LastSales":"18841.07","Percentage":"","cumThis":"50169.58","cumLast":"203682.27","totPerc":"-60.23"},{"ID":6,"Day":"Sunday","LastSales":"13508.50","Percentage":"","cumThis":"50169.58","cumLast":"217190.77","totPerc":"-60.23"}];




var chart = new AmCharts.AmSerialChart();
            chart.pathToImages = "../javascript/images/";
            chart.panEventsEnabled = true;
            chart.zoomOutButton = {
                backgroundColor: "#000000",
                backgroundAlpha: 0.15
            };

            chart.dataProvider = obj;
            chart.categoryField = "Day";
            chart.marginTop = 0;
            chart.marginRight = 5;

            chart.balloon.bulletSize = 5;

            var cSales = new AmCharts.AmGraph();
            cSales.title = "Current Sales";
            cSales.valueField = "CurrentSales";
            cSales.bullet = "round";
            cSales.bulletBorderColor = "#FFFFFF";
            cSales.bulletBorderThickness = 2;
            cSales.lineThickness = 2;
            cSales.lineColor = "#04D215";
            cSales.negativeLineColor = "#04D215";
            cSales.hideBulletsCount = 50; // this makes the chart to hide bullets when there are more than 50 series in selection
  ...