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
// The data used in this sample can be obtained from the CDN
3
// https://cdn.anychart.com/csv-data/csco-daily.js
4
// create data table on loaded data
5
var dataTable = anychart.data.table();
6
dataTable.addData(get_csco_daily_data());
7
8
// map loaded data
9
var mapping = dataTable.mapAs({"open": 1, "high": 2, "low": 3, "close": 4});
10
11
// create stock chart
12
var chart = anychart.stock();
13
14
// create plots on the chart
15
var plot_0 = chart.plot(0);
16
var plot_1 = chart.plot(1);
17
18
// configure the y-scale of the second plot
19
plot_1.yScale().minimum(-100);
20
plot_1.yScale().maximum(0);
21
22
// create ohlc series
23
var ohlcSeries = plot_0.ohlc(mapping);
24
ohlcSeries.name("CSCO");
25
26
// create Williams %R indicator
27
var williamsR = plot_1.williamsR(mapping, 4).series();
28
williamsR.stroke("2 red");
29
30
// create scroller series with mapped data
31
chart.scroller().line(mapping);
32
33
// set container id for the chart
34
chart.container("container");
35
36
// initiate chart drawing
37
chart.draw();
38
});