Tying to add extra additional data in pie chart. I have tried in this way but not working. the value is not displaying in tooltip. So is it possible to add additional data in tooltip?.
chartData=[{"name": "apples", "y": 20,"additionalData": 33$},
{"name": "oranges", "y": 40,"additionalData": 20$},
{"name": "bananas", "y": 50,"additionalData": 10$}]
Highcharts.chart('chartContainer', {
chart: {
// Edit chart spacing
spacingBottom: 15,
spacingTop: 10,
spacingLeft: 0,
spacingRight: 10,
width: 600,
height: 350
},
title: {
text: ''
},
xAxis: {
title: {
text: null
}
},
yAxis: {
min: 0,
title: {
text: ''
},
labels: {
overflow: 'justify'
}
},
tooltip: {
pointFormat:'<b>{point.y}<b><br> Cost: <b>{point.additionalData} </b>'
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
},
point:{
events : {
legendItemClick: function(e){
e.preventDefault();
}
}
},
showInLegend: true
},
},
credits: {
enabled: false
},
series: [{
colorByPoint: true,
type: 'pie',
data:this.chartData
}]
})
}
The values you have in your additionalData property are numbers, but they include the euro symbol so you probably want to be using strings, otherwise you will have invalid json.
[{"name": "apples", "y": 20,"additionalData": "33$"},{"name": "oranges", "y": 40,"additionalData": "20$"},{"name": "bananas", "y": 50,"additionalData": "10$"}]