var recibidas = [7128,5067,5816,6005,6569,7260];
var atendidas = [5664,4820,5456,5401,5846,5503];
Highcharts.chart('container', {
title: {
text: 'Inbound'
},
xAxis: {
categories: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'junio']
},
labels: {
},
series: [{
type: 'column',
name: 'Llamadas Recibidas',
data: recibidas
}, {
type: 'column',
name: 'Llamadas Atendidas',
data: atendidas
}, {
type: 'column',
name: 'Llamadas Abandonadas',
data: [1463,159,360,603,722,1757]
}, {
type: 'line',
name: 'Abandono',
data: [1463,159,360,603,722,1757],
marker: {
lineWidth: 2,
lineColor: Highcharts.getOptions().colors[3],
fillColor: 'white'
}
}, ],
tooltip: {
formatter: function() {
if (this.series.name == 'Abandono') {
var index = this.series.data.indexOf( this.point );
var percentage = 100 - (atendidas[index] * 100) / recibidas[index];
return this.series.name + '<b>' + this.point.y + '</b><br>' + percentage.toFixed(2) + '%'
} else {
return this.series.name + '<b>' + this.point.y + '</b>'
}
}
},
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/series-label.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>