Labels


2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 Sales per year 3.0 3.8 3.4 4.1 4.3 9.9 7.4 9.0 7.3 4.8	2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 Years 3.0 3.8 3.4 4.1 4.3 9.9 7.4 9.0 7.3 4.8

Source

<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script>
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css">
 
 
<table>
    <tr>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td><div id="chart1" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
        <td><div id="chart2" style="width:450px;height:300px;border:1px solid #A4BED4;"></div></td>
    </tr>
</table>
 
<script>var data = [{
    sales: "3.0",
    year: "2000"
}, {
    sales: "3.8",
    year: "2001"
}, {
    sales: "3.4",
    year: "2002"
}, {
    sales: "4.1",
    year: "2003"
}, {
    sales: "4.3",
    year: "2004"
}, {
    sales: "9.9",
    year: "2005"
}, {
    sales: "7.4",
    year: "2006"
}, {
    sales: "9.0",
    year: "2007"
}, {
    sales: "7.3",
    year: "2008"
}, {
    sales: "4.8",
    year: "2009"
}];
 
var barChart1 = new dhtmlXChart({
    view: "bar",
    container: "chart1",
    value: "#sales#",
    label: "#sales#",
    color: "#66cc33",
    width: 50,
    tooltip: {
        template: "#sales#";
    },
    xAxis: {
        title: "Sales per year",
        template: "#year#";
    }
});
barChart1.parse(data, "json");
var barChart2 = new dhtmlXChart({
    view: "bar",
    container: "chart2",
    value: "#sales#",
    label: "#sales#",
    tooltip: {
        template: "#sales#";
    },
    xAxis: {
        title: "Years",
        template: "#year#";
    }
});
barChart2.parse(data, "json");</script>