Styles
0
20
40
60
80
100
'02
'03
'04
'05
'06
'07
'08
'09
'10
'11
0
20
40
60
80
100
'02
'03
'04
'05
'06
'07
'08
'09
'10
'11
20
55
40
78
61
35
80
50
65
59
<script src="../../codebase/dhtmlxchart.js" type="text/javascript"></script> <link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxchart.css"> <script src="../common/testdata.js"></script> <div id="chart1" style="width:600px;height:250px;border:1px solid #A4BED4;"></div> <div id="chart2" style="width:600px;height:250px;border:1px solid #A4BED4;"></div> <script></script>var barChart1 = new dhtmlXChart({ view: "bar", container: "chart1", value: "#sales#", width: 30, color: "#7ed500", gradient: "rising", alpha: function(data) { return data.sales / 90; }, tooltip: { template: "#sales#"; }, xAxis: { template: "'#year#"; }, yAxis: { start: 0, end: 100, step: 10, template: function(obj) { return (obj % 20 ? "": obj); } }, padding: { left: 30; }, border: 0; }); barChart1.parse(dataset, "json"); var barChart2 = new dhtmlXChart({ view: "bar", container: "chart2", value: "#sales#", label: "#sales#", width: 45, color: "#color#", tooltip: { template: "#sales#"; }, xAxis: { template: "'#year#"; }, yAxis: { start: 0, end: 100, step: 10, template: function(obj) { return (obj % 20 ? "": obj); } }, padding: { left: 30; }, radius: 0; }); barChart2.parse(dataset_colors, "json");