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
// create a data table
4
var dataTable = anychart.data.table("x");
5
6
// add data
7
dataTable.addData([
8
{"x": "2015-12-25", "open": 512.53, "high": 514.88, "low": 505.69, "close": 507.34},
9
{"x": "2015-12-26", "open": 511.83, "high": 514.98, "low": 505.59, "close": 506.23},
10
{"x": "2015-12-27", "open": 511.22, "high": 515.30, "low": 505.49, "close": 506.47},
11
{"x": "2015-12-28", "open": 510.35, "high": 515.72, "low": 505.23, "close": 505.80},
12
{"x": "2015-12-29", "open": 510.53, "high": 515.86, "low": 505.38, "close": 508.25},
13
{"x": "2015-12-30", "open": 511.43, "high": 515.98, "low": 505.66, "close": 507.45},
14
{"x": "2015-12-31", "open": 511.50, "high": 515.33, "low": 505.99, "close": 507.98},
15
{"x": "2016-01-01", "open": 511.32, "high": 514.29, "low": 505.99, "close": 506.37},
16
{"x": "2016-01-02", "open": 511.70, "high": 514.87, "low": 506.18, "close": 506.75}
17
]);
18
19
// map the data
20
var mapping = dataTable.mapAs({open: "open", high: "high", low: "low", close: "close"});
21
22
// create a stock chart
23
var chart = anychart.stock();
24
25
// create a plot and an ohlc series
26
var ohlcSeries = chart.plot(0).ohlc(mapping);
27
ohlcSeries.name("ACME Corp.");
28
29
// set the chart title
30
chart.title("Table Data: Array of Objects");
31
32
// set the container id
33
chart.container("container");
34
35
// initiate drawing the chart
36
chart.draw();
37
});