2012-12-14 56 views
0

重要提示:它會以某種方式導致瀏覽器崩潰。我正在查看這段代碼很長一段時間,但找不到原因。我不會給jsfiddle代碼,因爲如果你立即運行它會填滿內存,儘管我有5個不同的值。任何人都可以幫我找到錯誤嗎?我很沮喪。

HTML當我分配選項時,Highcharts崩潰

<div id="container" style="width:400px; height:300px"> </div> 


JAVASCRIPT

var options = { 
     colors: [ "#7798BF", "#55BF3B", "#DF5353", "#aaeeee", "#ff0066", "#eeaaee", 
     "#55BF3B", "#DF5353", "#7798BF", "#aaeeee","#DDDF0D"], 
     chart: { 
      borderWidth: 0, 
      borderRadius: 15, 
      plotBackgroundColor: null, 
      plotShadow: true, 
      plotBorderWidth: 0, 
      margin: 30, 
      renderTo: 'container' 
     }, 
     title: { 
      text: 'Toplam sayfa ziyaret süreleri', 
      style: { 
       color: '#555', 
       font: '16px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif' 
      } 
     }, 
     subtitle: { 
      style: { 
       color: '#DDD', 
       font: '12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif' 
      }, 
      text: 'this is subtitle' 
     }, 
     xAxis: { 
      minTickInterval: 10, 
      gridLineWidth: 0, 
      lineColor: '#999', 
      tickColor: '#999', 
      labels: { 
       style: { 
        color: '#444', 
        fontWeight: 'bold' 
       } 
      }, 

      title: { 
       style: { 
        color: '#AAA', 
        font: 'bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif' 
       } 
      }, 
      offset: 0 
     }, 

     yAxis: { 
      categories: ['Login', 'Bar', 'Line', 'Share', 'Target', 'Peaklist', 'Monitor', 'Diğer'], 
      alternateGridColor: null, 
      minorTickInterval: 600000, //600 seconds 
      type: 'datetime', 
      dateTimeLabelFormats:{ 
       second: '%M:%S', 
       minute: '%M:%S', 
       hour: '%H:%M:%S', 
       day: '%e. %b', 
       week: '%e. %b', 
       month: '%b \'%y', 
       year: '%Y' 
      }, 

      gridLineColor: 'rgba(255, 255, 255, .1)', 
      lineWidth: 0, 
      tickWidth: 1, 
      labels: { 
       style: { 
        color: '#999', 
        fontWeight: 'bold' 
       } 
      }, 

      title: { 
       style: { 
        color: '#AAA', 
        font: 'bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif' 
       } 
      } 
     }, 
     labels: { 
      style: { 
       color: '#CCC' 
      } 
     }, 
     tooltip: { 
      enabled: false 
     }, 

     plotOptions: { 
      bar: { 
       dataLabels: { 
        color: '#CCC' 
       } 
      } 
     }, 

     toolbar: { 
      itemStyle: { 
       color: '#CCC' 
      } 
     }, 

     // special colors for some of the demo examples 
     dataLabelsColor: '#444', 
     textColor: '#E0E0E0', 
     maskColor: 'rgba(255,255,255,0.3)', 
     series: [{ 
      type: 'column', 
      name: 'Data', 
      data: [[0,100000],[1,200000],[2,1950000],[3,10000],[4,2000],[5,100000],[6,10000], [7,0000]], 
      color: 'rgba(100,100,150,0.5)' 
     }], 
     legend:{ 
      enabled: false 
     } 
    }; 



    chart2 = new Highcharts.Chart(options); 
+0

爲一體,你想'風格= 「寬度:400像素,高度:300像素」'在'DIV#container'。注意分號而不是逗號。 – lbstr

+0

ups,已更正。謝謝 –

+0

你使用'highcharts'還是'highstocks'? –

回答

0

最後,我發現這個問題。 categories: ['Login', 'Bar', 'Line', 'Share', 'Target', 'Peaklist', 'Monitor', 'Diğer']導致問題,雖然我不知道原因。也許是因爲字符串數組的包括來自其他字符

+0

看看我的答案,你就會知道這個問題。 –

1

這是因爲類別爲xAxys而不是yAxis字符。

xAxis: { 
    categories: ['Login', 'Bar', 'Line', 'Share', 'Target', 'Peaklist', 'Monitor', 'Diğer'] 
} 

Working demo

Reference

相關問題