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
29
1
anychart.onDocumentReady(function() {
2
// The data that have been used for this sample can be taken from the CDN
3
// https://cdn.anychart.com/csv-data/ixic-daily-short.js
4
// set output locale
5
anychart.format.outputLocale('zh-cn');
6
// create data table on loaded data
7
var dataTable = anychart.data.table();
8
dataTable.addData(get_ixic_daily_short_data());
9
// map loaded data for the ohlc series
10
var mapping = dataTable.mapAs();
11
mapping.addField('open', 1, 'first');
12
mapping.addField('high', 2, 'max');
13
mapping.addField('low', 3, 'min');
14
mapping.addField('close', 4, 'last');
15
// map loaded data for the scroller
16
var scrollerMapping = dataTable.mapAs();
17
scrollerMapping.addField('value', 5);
18
// create stock chart
19
chart = anychart.stock();
20
// create first plot on the chart
21
var firstPlot = chart.plot(0);
22
var firstSeries = firstPlot.ohlc(mapping);
23
// create scroller series with mapped data
24
chart.scroller().line(scrollerMapping);
25
// set container id for the chart
26
chart.container('container');
27
// initiate chart drawing
28
chart.draw();
29
});