2012-07-26 49 views
0

因此,我想要在我的網站中嵌入以下代碼,其目的是以表格形式顯示每日和每月的網站指標。無法弄清楚如何使用谷歌圖表API顯示2張表格

我試圖嘲笑頁面,但我遇到了障礙︰我似乎無法找到一種方法來使用谷歌圖表API呈現兩個不同的谷歌圖表。

我敢肯定這是一個令人難以置信的愚蠢的錯誤,我只是沒有看到,但我一直在考慮這一個小時,現在只是不知道如何顯示兩個表。

<!DOCTYPE html> 
<html> 
    <head> 
    <script type='text/javascript' src='https://www.google.com/jsapi'></script> 
    <script type='text/javascript'> 
     google.load('visualization', '1', {packages:['table']}); 
     google.setOnLoadCallback(drawDailyTable); 
     function drawDailyTable() { 
     var Dailydata = new google.visualization.DataTable(); 
     Dailydata.addColumn('string', 'Metric'); 
     Dailydata.addColumn('number', 'Number'); 
     Dailydata.addRows([ 
      ['Total Daily Unique Users', {v: 462, f: '462'}], 
      ['Total Daily Visits', {v:6702, f: '6,702'}] 
     ]); 
     var Dailytable = new google.visualization.Table(document.getElementById('table_div')); 
     Dailytable.draw(Dailydata, {showRowNumber: true}); 
     } 
    </script> 


    <script type='text/javascript' src='https://www.google.com/jsapi'></script> 
    <script type='text/javascript'> 
     google.load('visualization', '1', {packages:['table']}); 
     google.setOnLoadCallback(drawMonthlyTable); 
     function drawMonthlyTable() { 
     var Monthlydata = new google.visualization.DataTable(); 
     Monthlydata.addColumn('string', 'Metric'); 
     Monthlydata.addColumn('number', 'Number'); 
     Monthlydata.addRows([ 
      ['Total Monthly Unique Users', {v: 12875, f: '12,875'}], 
      ['Total Monthly Visits', {v:37980, f: '37,980'}] 
     ]); 
     var Monthlytable = new google.visualization.Table(document.getElementById('table_div')); 
     Monthlytable.draw(Monthlydata, {showRowNumber: true}); 
     } 
    </script> 
    </head> 

    <body> 
    <div id='table_div'></div> 
    </body> 
</html> 

回答

0

我想通了,我drawtable功能,它說:document.getElementById('table_div'),我只是改名爲每個相應的表中的ID,以document.getElementById('dailytable_div')document.getElementById('monthlytable_div'),然後編輯我的身體看起來就像這樣:

<body> 
    <div id='dailytable_div'></div> 
    <div id='monthlytable_div'></div> 
    </body> 

問題解決了!

相關問題