High chart charts displayed as a pie chart in IE 8

I am using the latest version of the Highcharts library. The general library looks pretty cool, however, I ran into a rather annoying problem: the donut chart does not display correctly in IE 8 when there is only one rendering option.

var chart; var data = [['There could be only one', 1444]]; var containerId = 'container'; var chartTitle = 'Equity'; $(document).ready(function () { Highcharts.theme = { colors: ["#1987c9", "#7fba00", "#f4911e", "#006D75", "#542344", "#f7403a"] } var highchartsOptions = Highcharts.setOptions(Highcharts.theme); chart = new Highcharts.Chart({ chart: { renderTo: containerId, plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false, backgroundColor:'rgba(255, 255, 255, 0.1)' }, credits:{ enabled:false }, legend:{ align: 'right', verticalAlign: 'middle', layout: 'vertical', width: 170, itemStyle: { fontSize: '13px' } }, title: { text: chartTitle, style: { fontSize: '17px' } }, tooltip: { pointFormat: '{series.name} <b>{point.y}</b>', percentageDecimals: 1 }, plotOptions: { pie: { allowPointSelect: true, cursor: 'pointer', dataLabels: { enabled: true, formatter: function() { return this.point.name +': '+ this.point.y.toLocaleString(); }, style: { fontSize: '13px' } }, innerSize: '40%', showInLegend: true } }, series: [{ type: 'pie', name: chartTitle, data: data }], exporting: { enabled:false } }); 

});

JSFiddle: http://jsfiddle.net/olanet/whZnP/2/

JSFiddle result (enable IE 8 Compatibility or use IE 8): http://fiddle.jshell.net/olanet/whZnP/2/show/

Chart in IE 8

Chart in IE 9

+4
source share
2 answers

It seems that the problem exists only with full visualization of the arc. If we remove a small part of this arc, the problem will disappear. To fix the problem: 1. Find the following line in the source: end = mathRound((startAngleRad + (cumulative * circ)) * precision) / precision; 2. After that add the following code:

 if (len == 1) { end -= 0.001; } 

3. This will add a small space to the circle, but the end result will look like this: enter image description here

+1
source

It seems like an error, so I reported this https://github.com/highslide-software/highcharts.com/issues/1642

0
source

All Articles