2013-08-01 2 views
2

У меня есть простой барчер, который неправильно отображается под IE8 (столбцы не видны). Он корректно отображает Firefox и IE 9+.HighCharts - barchart не корректно отображается в IE8

Я использую jQuery 1.8.3 и highcharts 3.0.3.

Я сохраняю данные в образце кода, потому что количество воспроизводимых столбцов важно при воспроизведении проблемы. График корректно отобразится в IE8, если я удалю одну серию.

Вот код:

$(function() { 
    $(document).ready(function() { 
     var barOptions = { 
      chart: { 
       renderTo: 'container', 
       width:450, 
       height:350, 
       type: 'column' 
      }, 
      xAxis: { 
       categories: [0,1,2,3,4,5,6,7,8,9,10] 
      }, 
      series: [{ 
       name: 'NC', 
       data: [7057, 6858, 6643, 6570, 6115, 107, 31, 635, 203, 2, 2] 
      }, { 
       name: 'OK', 
       data: [54047, 52484, 50591, 49479, 46677, 33, 156, 947, 408, 6, 2] 
      }, { 
       name: 'KO', 
       data: [11388, 11115, 10742, 10757, 10290, 973, 914, 4054, 732, 34, 2] 
      }, { 
       name: 'VALID', 
       data: [8836, 8509, 8255, 7760, 7621, 973, 914, 4054, 732, 34, 2] 
      }, { 
       name: 'CHECK', 
       data: [115, 162, 150, 187, 172, 973, 914, 4054, 732, 34, 2] 
      }, { 
       name: 'COR', 
       data: [12566, 12116, 11446, 10749, 10439, 973, 914, 4054, 732, 34, 2] 
      }] 
     }; 

     barChart = new Highcharts.Chart(barOptions); 
    }); 
}); 

Любые идеи о том, как это исправить?

ответ

1

Как уже сказал, это выглядит как ошибка в Highcharts. Обходным путем было бы скрыть и показать одну из серий программно сразу после отображения графика.

JSFiddle here. Попробуйте его в IE8 here.

$(function() { 
    var barOptions = { 
     chart: { 
      renderTo: 'container', 
      width: 450, 
      height: 350, 
      type: 'column' 
     }, 
     xAxis: { 
      categories: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 
     }, 
     series: [{ 
      name: 'NC', 
      data: [7057, 6858, 6643, 6570, 6115, 107, 31, 635, 203, 2, 2] 
     }, { 
      name: 'OK', 
      data: [54047, 52484, 50591, 49479, 46677, 33, 156, 947, 408, 6, 2] 
     }, { 
      name: 'KO', 
      data: [11388, 11115, 10742, 10757, 10290, 973, 914, 4054, 732, 34, 2] 
     }, { 
      name: 'VALID', 
      data: [8836, 8509, 8255, 7760, 7621, 973, 914, 4054, 732, 34, 2] 
     }, { 
      name: 'CHECK', 
      data: [115, 162, 150, 187, 172, 973, 914, 4054, 732, 34, 2] 
     }, { 
      name: 'COR', 
      data: [12566, 12116, 11446, 10749, 10439, 973, 914, 4054, 732, 34, 2] 
     }] 
    }; 

    barChart = new Highcharts.Chart(barOptions); 
    barChart.series[0].hide(); 
    barChart.series[0].show(); 
}); 
+1

Спасибо, скрывая и показывая серию, решить эту проблему! – piravel

Смежные вопросы