anychart.onDocumentReady(function () {
var dataTable = anychart.data.table();
dataTable.addData(get_csco_daily_data());
var mapping = dataTable.mapAs({
'open': 1,
'high': 2,
'low': 3,
'close': 4,
'value': 4
});
// create stock chart
var chart = anychart.stock();
chart.padding(10, 50, 20, 50);
chart.title({
text: 'Plot title demo',
fontColor: '#333',
fontSize: 20
});
// create plot for the candlestick series
var candlestickPlot = chart.plot(0);
// adding extra Y axis to the right side
candlestickPlot.yAxis(1).orientation('right');
// create candlestick series
candlestickPlot.candlestick()
.data(mapping)
.name('CSCO');
// set candlestick plot title
candlestickPlot.title({
text: 'Cisco Systems, Inc. Stock prices',
fontSize: 16
});
// create plot for MACD indicator
var macdPlot = chart.plot(1);
macdPlot.height('35%');
macdPlot.yAxis(1).orientation('right');
// create MACD Indicator
macdPlot.macd(mapping);
// set MACD plot title
macdPlot.title('Moving Average Convergence/Divergence');
macdPlot.title()
.fontSize(16)
.margin().top(20);
// create plot for aroon indicator
var aroonPlot = chart.plot(2);
aroonPlot.height('35%');
aroonPlot.yAxis(1).orientation('right');
// set Aroon Indicator plot title
aroonPlot.title({
text: 'Aroon Indicator',
fontSize: 16,
margin: {
top: 20
}
});
// create Aroon indicator
var aroonIndicator = aroonPlot.aroon(mapping);
// set high and low stroke settings for indicator's range series
aroonIndicator.rangeSeries().normal().highStroke('#64b5f6', 2);
aroonIndicator.rangeSeries().normal().lowStroke('#ff6d00', 2);
// set high and low fill settings for indicator's range series
aroonIndicator.rangeSeries().normal().highFill('#64b5f6', .4);
aroonIndicator.rangeSeries().normal().lowFill('#ff6d00', .4);
// create scroller series with mapped data
chart.scroller().splineArea(mapping);
// set chart selected date/time range
chart.selectRange('1999-06-24', '2001-05-29');
// set container id for the chart
chart.container('container');
// initiate chart drawing
chart.draw();
// create range picker
var rangePicker = anychart.ui.rangePicker();
// init range picker
rangePicker.render(chart);
// create range selector
var rangeSelector = anychart.ui.rangeSelector();
// init range selector
rangeSelector.render(chart);
});