MACD and Pivot points
author(s):
Pawel fus
by oysteinmoseng
HTML
<script src="https://code.highcharts.com/stock/highstock.js"></script>
<script src="https://code.highcharts.com/stock/modules/data.js"></script>
<script src="https://code.highcharts.com/stock/modules/drag-panes.js"></script>
<script src="https://code.highcharts.com/stock/indicators/indicators.js"></script>
<script src="https://code.highcharts.com/stock/indicators/pivot-points.js"></script>
<script src="https://code.highcharts.com/stock/indicators/ema.js"></script>
<script src="https://code.highcharts.com/stock/indicators/macd.js"></script>
<script src="https://code.highcharts.com/themes/high-contrast-dark.js"></script>
<div id="container"></div>
CSS
body {
background-color: #2e2b36;
}
#container {
height: 620px;
width: 1100px;
}
JavaScript
var colors = Highcharts.getOptions().colors;
Highcharts.getJSON('https://demo-live-data.highcharts.com/aapl-ohlc.json', function (data) {
Highcharts.stockChart('container', {
chart: {
backgroundColor: 'transparent'
},
rangeSelector: {
selected: 4,
inputBoxWidth: 100
},
tooltip: {
enabled: false
},
credits: {
enabled: false
},
xAxis: {
crosshair: false
},
yAxis: [{
height: '75%',
resize: {
enabled: true
},
labels: {
align: 'right',
x: -3,
format: '${value}'
},
offset: 40,
gridLineColor: '#444',
title: {
enabled: false
}
}, {
top: '75%',
height: '25%',
offset: 19,
labels: {
align: 'right',
x: -3
},
title: {
text: 'MACD'
}
}],
title: {
text: 'AAPL Stock Price'
},
series: [{
type: 'ohlc',
id: 'aapl',
name: 'AAPL Stock Price',
data: data,
zIndex: 1
}, {
type: 'pivotpoints',
linkedTo: 'aapl',
zIndex: 0,
lineWidth: 1,
color: colors[3],
dataLabels: {
overflow: 'none',
crop: false,
y: 4,
style: {
fontSize: 9
}
}
}, {
type: 'macd',
yAxis: 1,
linkedTo: 'aapl',
color: colors[4],
negativeColor: colors[5],
signalLine: {
styles: {
lineColor: colors[3]
}
},
macdLine: {
styles: {
...