HTMLcopy
1
<div id="container"></div>
CSScopy
8
1
html,
2
body,
3
#container {
4
width: 100%;
5
height: 100%;
6
margin: 0;
7
padding: 0;
8
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
// The data used in this sample can be obtained from the CDN
3
// https://cdn.anychart.com/samples/stock-general-features/stacked-stock/data.csv
4
anychart.data.loadCsvFile(
5
'https://cdn.anychart.com/samples/stock-general-features/stacked-stock/data.csv',
6
function (data) {
7
// create data table on loaded data
8
var dataTable = anychart.data.table();
9
dataTable.addData(data);
10
11
// create stock chart
12
var chart = anychart.stock();
13
chart.title('Selling Applications in the App Store');
14
// set maximum visible points count
15
chart.grouping().maxVisiblePoints(80);
16
17
// create plot on the chart
18
var plot = chart.plot(0);
19
20
// create plot series with mapped data
21
plot.column(dataTable.mapAs({ value: 1 })).name('Bamity');
22
plot.column(dataTable.mapAs({ value: 2 })).name('Regrant');
23
plot.column(dataTable.mapAs({ value: 3 })).name('Zamit');
24
25
// force chart to stack values by Y scale.
26
plot.yScale().stackMode('value');
27
28
// set chart selected date/time range
29
chart.selectRange('2014-07-06', '2016-01-03');
30
31
// set container id for the chart
32
chart.container('container');
33
// initiate chart drawing
34
chart.draw();
35
36
// create range picker
37
var rangePicker = anychart.ui.rangePicker();
38
// init range picker
39
rangePicker.render(chart);
40
41
// create range selector
42
var rangeSelector = anychart.ui.rangeSelector();
43
// init range selector
44
rangeSelector.render(chart);
45
}
46
);
47
});