2012-03-05 66 views
0

嗨,您好!感謝CSS的Google可視化圖表不顯示

我在顯示圖形時遇到了一些麻煩。這是一個非常奇怪的問題,因爲它適用於舊筆記本電腦,並且適用於Safari。但不適用於Chrome /舊的Firefox版本。

這是JS代碼:

$.getJSON(q_project_info, function (results) { 
      var data = new google.visualization.DataTable(); 
      data.addColumn('string', 'xxxxxx'); 
      data.addColumn('number', 'xxxxx'); 

      $.each(results.d, function (i, v) { 
        ................ 
      }); 

      var options = { title: 'xxxxxxxx', 
       height: '300', 
       backgroundColor: '#F5F5F5', 
       colors: ['#036109', '#58892d'], 
       legend: 'none' 
      }; 
      var chart = new google.visualization.AreaChart(document.getElementById('xxxxxxxxx')); 
      chart.draw(data, options); 
     }); 

這就像一個魅力! ......以及我的舊筆記本電腦......和Safari。 Chrome和Firefox無法完成這項工作(甚至沒有試過IE)。

我還使用了Impress.js一些奇特的轉變......(也許有問題..但我想就覺得是不是因爲我想保留的lib ...)

我有點指出了這個問題...和圖表是可見的,當我刪除背景:div的css屬性(圖表在),但我真的很需要那種背景色...

這裏是css代碼:

.slide { 
    /**/display: block; 
    width: 900px; 
    height: 700px; 

    padding: 40px 60px; 

    border-radius: 10px; 

    /**/background: #F5F5F5; 
    border: 1px solid rgba(0, 0, 0, .3); 

    font-family: 'Open Sans', Arial, sans-serif; 

    color: rgb(102, 102, 102); 
} 

我希望你能幫我找到一些方法來顯示字符t ...

回答

1

您必須觸發Google Charts API完全加載事件時的第一次繪製事件。 把你完整的JavaScript代碼插入函數,調用這個函數(這裏drawChart()),通過以下命令:

// Set a callback to run when the Google Visualization API is loaded. 
google.setOnLoadCallback(drawChart); 

Quick Start - Google Chart Tools