HTMLcopy
1
<div id="container"></div>
CSScopy
6
1
html, body, #container {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
3
// data
4
var data = anychart.data.set([
5
["Winter", 12000, 12000, 10000],
6
["Spring", 13000, 12000, 17000],
7
["Summer", 25000, 15000, 19000],
8
["Autumn", 16000, 16000, 16000]
9
]);
10
11
var dataSet1 = data.mapAs({x: 0, value: 1});
12
var dataSet2 = data.mapAs({x: 0, value: 2});
13
var dataSet3 = data.mapAs({x: 0, value: 3});
14
15
// set chart type
16
var chart = anychart.column3d();
17
18
// setting title
19
chart.title("3D Stacked Column Chart");
20
21
// enabled grids
22
chart.xGrid().enabled(true);
23
chart.yGrid().enabled(true);
24
25
// set axes titles
26
chart.xAxis().title("Month");
27
chart.yAxis().title("Sales");
28
29
// enable the value stacking mode
30
chart.yScale().stackMode("value");
31
32
// configure tooltips
33
chart.tooltip().format("{%value}");
34
35
// configure labels on the y-axis
36
chart.yAxis().labels().format("{%value}");
37
38
// set data
39
var series1 = chart.column(dataSet1);
40
series1.name("Sales 2009");
41
var series2 = chart.column(dataSet2);
42
series2.name("Sales 2010");
43
var series3 = chart.column(dataSet3);
44
series3.name("Sales 2011");
45
46
// draw chart
47
chart.container("container");
48
chart.draw();
49
});