100% stacked area chart

Our Serial chart support 100% stacked or <a href="/demos/stacked-area/">stacked areas</a>. Technically, area graph is just a regular line graph with fill opacity set to some bigger than 0 value. You can simply change this area to smoothed-area or step-area chart by changing a single <strong>type</strong> property of <a href="http://docs.amcharts.com/3/javascriptcharts/AmGraph">AmGraph</a>. <h2>Images or any other HTML in balloons / tool-tips</h2> Balloons or tool-tips of our charts can accept any HTML. This means you can add images, tables, divs and format tool-tip content in any way you need. You can use custom fields from your data provider to create dynamic content of the balloon or even use your own custom method which would provide a tool-tip with a HTML code to be displayed.

by Mike Rawling

HTML

<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="chartdiv"></div>

CSS

#chartdiv {
	width	: 100%;
	height	: 500px;
}

JavaScript

var chart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
	"theme": "none",
    "titles": [{
        "text": "Traffic incidents per year",
        "size": 15
    }],
     "pathToImages": "http://www.amcharts.com/lib/3/images/",
    "legend": {
        "align": "center",
        "equalWidths": false,
        "periodValueText": "total: [[value.sum]]",
        "valueAlign": "left",
        "valueText": "[[value]] ([[percents]]%)",
        "valueWidth": 100
    },
    "dataProvider": [{
        "year": "2000",
        "cars": 1587,
        "motorcycles": 650,
        "bicycles": 121
    }, {
        "year": "1995",
        "cars": 1567,
        "motorcycles": 683,
        "bicycles": 146
    }, {
        "year": "1996",
        "cars": 1617,
        "motorcycles": 691,
        "bicycles": 138
    }, {
        "year": "1997",
        "cars": 1630,
        "motorcycles": 642,
        "bicycles": 127
    }, {
        "year": "1998",
        "cars": 1660,
        "motorcycles": 699,
        "bicycles": 105
    }, {
        "year": "1999",
        "cars": 1683,
        "motorcycles": 721,
        "bicycles": 109
    }, {
        "year": "2000",
        "cars": 1691,
        "motorcycles": 737,
        "bicycles": 112
    }, {
        "year": "2001",
        "cars": 1298,
        "motorcycles": 680,
        "bicycles": 101
    }, {
        "year": "2002",
        "cars": 1275,
        "motorcycles": 664,
        "bicycles": 97
    }, {
        "year": "2003",
        "cars": 1246,
        "motorcycles": 648,
        "bicycles": 93
    }, {
        "year": "2004",
        "cars": 1218,
        "motorcycles": 637,
        "bicycles": 101
    }, {
        "year": "2005",
        "cars": 1213,
        "motorcycles": 633,
        "bicycles": 87
    }, {
        "year": "2006",
        "cars": 1199,
        "motorcycles": 621,
        "bicycles": 79
    }, {
        "year": "2007",
        "cars": 1110,
        "motorcycles": 210,
        "bicycles": 81
    }, {
       ...