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
var table, mapping, chart;
2
anychart.onDocumentReady(function() {
3
4
table = anychart.data.table();
5
table.addData([
6
['2015-12-24T12:00:00'],
7
['2015-12-25T12:00:00','512.53', '514.88', '505.69', '507.34'],
8
['2015-12-26T12:00:00','511.83', '514.98', '505.59', '506.23'],
9
['2015-12-27T12:00:00','511.22', '515.30', '505.49', '506.47'],
10
['2015-12-28T12:00:00','510.35', '515.72', '505.23', '505.80'],
11
['2015-12-29T12:00:00','510.53', '515.86', '505.38', '508.25'],
12
['2015-12-30T12:00:00','511.43', '515.98', '505.66', '507.45'],
13
['2015-12-31T12:00:00','511.50', '515.33', '505.99', '507.98'],
14
['2016-01-01T12:00:00','511.32', '514.29', '505.99', '506.37'],
15
['2016-01-02T12:00:00','511.70', '514.87', '506.18', '506.75'],
16
['2016-01-03T12:00:00','512.30', '514.78', '505.87', '508.67'],
17
['2016-01-04T12:00:00','512.50', '514.77', '505.83', '508.35'],
18
['2016-01-05T12:00:00','511.53', '516.18', '505.91', '509.42'],
19
['2016-01-06T12:00:00','511.13', '516.01', '506.00', '509.26'],
20
['2016-01-07T12:00:00','510.93', '516.07', '506.00', '510.99'],
21
['2016-01-08T12:00:00','510.88', '515.93', '505.22', '509.95'],
22
['2016-01-09T12:00:00','509.12', '515.97', '505.15', '510.12'],
23
['2016-01-10T12:00:00','508.53', '516.13', '505.66', '510.42'],
24
['2016-01-11T12:00:00','511.53', '516.18', '505.91', '509.42'],
25
['2016-01-12T12:00:00','510.35', '515.72', '505.23', '505.80'],
26
['2016-01-13T12:00:00','510.53', '515.86', '505.38', '508.25'],
27
['2016-01-14T12:00:00','511.43', '515.98', '505.66', '507.45'],
28
['2016-01-15T12:00:00','511.50', '515.33', '505.99', '507.98'],
29
['2016-01-16T12:00:00','511.32', '514.29', '505.99', '506.37'],
30
['2016-01-17T12:00:00','511.70', '514.87', '506.18', '506.75'],
31
['2016-01-18T12:00:00','512.30', '514.78', '505.87', '508.67'],
32
['2016-01-19T12:00:00','512.50', '514.77', '505.83', '508.35'],
33
['2016-01-20T12:00:00','511.53', '516.18', '505.91', '509.42'],
34
['2016-01-21T12:00:00','511.13', '516.01', '506.00', '509.26'],
35
['2016-01-22T12:00:00','510.93', '516.07', '506.00', '510.99']
36
]);
37
38
// mapping the data
39
mapping = table.mapAs();
40
mapping.addField('open', 1, 'first');
41
mapping.addField('high', 2, 'max');
42
mapping.addField('low', 3, 'min');
43
mapping.addField('close', 4, 'last');
44
mapping.addField('value', 4, 'last');
45
46
// defining the chart type
47
var chart = anychart.stock();
48
49
// set the series type
50
var ohlcSeries = chart.plot(0).ohlc(mapping);
51
ohlcSeries.name('ACME Corp.');
52
53
// add sma indicator
54
chart.plot(0).sma(mapping, 10, "line");
55
56
// setting the chart title
57
chart.title('AnyStock Basic Chart with SMA Indicator');
58
59
chart.container('container');
60
chart.draw();
61
});