Grafico PA / Temp
by Felipe Zura
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
JavaScript
$(function () {
Highcharts.setOptions({
colors: ['#ff7676', '#6262ff', '#ff0000','#000000']
});
$('#container').highcharts({
chart: {
zoomType: 'xy'
},
title: {
text: 'Presión Arterial / Temperatura'
},
credits: {
enabled: false
},
exporting: {
enabled: false
},
xAxis: [{
categories: ['fecha1', 'fecha2', 'fecha3', 'fecha4', 'fecha5', 'fecha6','fecha7'],
crosshair: true
}],
yAxis: [{ // Primary yAxis
labels: {
format: '{value}',
style: {
color: Highcharts.getOptions().colors[3]
}
},
title: {
text: 'Temperatura',
style: {
color: Highcharts.getOptions().colors[3]
}
},
opposite: true
}, { // Secondary yAxis
title: {
text: 'Presión ',
style: {
color: Highcharts.getOptions().colors[3]
}
},
labels: {
format: '{value} mm Hg',
style: {
color: Highcharts.getOptions().colors[3]
}
}
}],
tooltip: {
shared: true,
backgroundColor: '#ffffff',
},
plotOptions: {
column: {
dataLabels: {
enabled: true,
y: 30, // 10 pixels down from the top
color: '#FFFFFF',
},
marker: {
radius: 7,
lineColor: '#666666',
lineWidth: 1
}
},
line: {
dataLabels: {
enabled: true,
y: 6, // 10 pixels down...