2015-01-20 130 views
0

我试图将Google图表添加到我的项目时出现问题。该页面不加载或加载空白页面。尝试加载后,它会正确显示页面几秒钟,然后页面变为空白并卡住。 这是我的代码:Google Chart不加载

<script type="text/javascript"> 

    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1.0', {'packages':['corechart','table']}); 

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

    // Callback that creates and populates a data table, 
    // instantiates the pie chart, passes in the data and 
    // draws it. 
    function drawChart() { 

    // Create the data table. 
    var data = new google.visualization.DataTable(); 
    data.addColumn('string', 'Topping'); 
    data.addColumn('number', 'Slices'); 
    data.addRows([ 
    ['TEST 1', 3], 
    ['TEST 2', 1], 
    ['TEST 3', 1], 
    ['TEST 4', 1], 
    ['TEST 5', 2] 
    ]); 

    // Set chart options 
    var options = {'title':'ACTIONS', 
       'width':400, 
       'height':300}; 

    // Instantiate and draw our chart, passing in some options. 
    var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
    chart.draw(data, options); 

} 
</script> 

这是我在应用程序

<div id="chart_div" style="width:400; height:300"></div> 
+1

您确定此代码在body onload后运行吗? – juvian 2015-01-20 19:24:09

+0

ypeError:无法在fb(http://liondesk.it/js/libs/jquery.dataTables.min.js:7:148) 处以HTMLTableElement读取未定义的 属性'offsetWidth'。 (http://liondesk.it/js/libs/jquery.dataTables.min.js:91:45) at Function.m.extend.each(http://liondesk.it/js/libs/jquery- 1.11.1.min.js:2:2973) – 2015-01-20 19:25:51

+0

该页面试图获取请求,但通过后可能会有2秒页面进入空白页面,并显示控制台上的错误 – 2015-01-20 19:28:42

回答

0

的视图中添加的格你加载jQuery和jQueryUI的?

<script type="text/javascript"> 
    google.load("search", "1"); 
    google.load("jquery", "1.4.2"); 
    google.load("jqueryui", "1.7.2"); 
</script> 

这里是

<html> 
    <head> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 
    <script type="text/javascript"> 
     google.load("visualization", "1", {packages:["corechart"]}); 
     google.setOnLoadCallback(drawChart); 
     function drawChart() { 

     var data = google.visualization.arrayToDataTable([ 
      ['Task', 'Hours per Day'], 
      ['Work',  11], 
      ['Eat',  2], 
      ['Commute', 2], 
      ['Watch TV', 2], 
      ['Sleep', 7] 
     ]); 

     var options = { 
      title: 'My Daily Activities' 
     }; 

     var chart = new google.visualization.PieChart(document.getElementById('piechart')); 

     chart.draw(data, options); 
     } 
    </script> 
    </head> 
    <body> 
    <div id="piechart" style="width: 900px; height: 500px;"></div> 
    </body> 
</html> 

你是如何试图加载数据的一些示例代码(工作)?你能给我们更多的信息吗?

+0

是的,但仍然有相同的问题:( – 2015-01-20 19:33:59