Edit Question - KnowledgeHub

Title Body

I'm using Highcharts to display a bar chart, with 2 bars overlaying each other, and a dataLabels at the right of them, displaying the exact value. The problem here is that when the value is above 80%, the label is overflowing from the chart into the frame, going over some other text, and making them both unreadable. Here are my plotOptions : plotOptions: { bar: { groupPadding: 0.5, pointWidth : 30, borderWidth: 0, dataLabels: { enabled: true, y:-5, color:"black", style: { fontSize: "12px" }, formatter: function(){ if(this.y > 80) { this.series.chart.options.plotOptions.bar.dataLabels.x -= 20; } if(this.series.name == "Tests OK") return "Tests OK : "+Math.round(this.y*10)/10+"%"; else return " Tests Executed : "+Math.round(this.y*10)/10+"%"; } } } } I thought i could edit the chart options on the go, using this.series.chart.options.plotOptions.bar.dataLabels.x -= 20; , but this doesn't work. Surely I'm not the first one who has encountered a problem like that. Any idea ? Thanks

Tags (comma-separated) Cancel