Rendu des graphiques élevés sur Internet Explorer 10

Highcharts Les graphiques à barres ne sont pas bien rendus lorsqu’ils sont placés dans un tableau HTML Issue est reproduit dans ce violon . Le problème de rendu est visible lors de l’ouverture dans IE 10 (fonctionne bien en chrome).

var options = { colors: ["#3ACB35", "#DE3A15", "#FF9A00", "#00B8F1"], chart: { renderTo: 'Chart3container', type: 'bar', backgroundColor: 'black', borderColor: 'black', borderWidth: 0, className: 'dark-container', plotBackgroundColor: 'black', plotBorderColor: '#000000', plotBorderWidth: 0 }, credits: { enabled: false }, title: { text: 'Count Per Category', style: { color: 'white', font: 'normal 22px "Segoe UI"' }, align: 'left' }, tooltip: { backgroundColor: 'rgba(0, 0, 0, 0.75)', style: { color: '#F0F0F0' } }, categories: { enabled: 'true' }, legend: { layout: 'vertical', align: 'right', verticalAlign: 'middle', borderWidth: 0, itemStyle: { font: '9pt Segoe UI', color: 'white' }, itemHoverStyle: { color: 'grey' } }, xAxis: { categories: BarData.categories, tickInterval: 1, labels: { enabled: true, style: { color: 'white' } }, title: { enabled: false }, gridLineColor: '#222222' }, yAxis: { title: { enabled: true, text: "Document Count", style: { fontWeight: 'normal', color: 'white' } }, labels: { style: { color: 'white' } }, gridLineColor: '#222222' }, exporting: { enabled: false }, plotOptions: { series: { stacking: 'normal', cursor: 'pointer' } }, series: [] }; options.series = BarData.bardataarray; chart1 = new Highcharts.Chart(options); 

});

Quand il est mis à l’extérieur de la table, ça marche bien. Voici le violon connexe.
J’ai besoin d’une table pour un bon alignement.

Vous pouvez désactiver l’animation ou utiliser des styles CSS comme ici:

 

Voir aussi: https://github.com/highslide-software/highcharts.com/issues/1157