2012-07-12 33 views
4

我種與谷歌的API和JavaScript的新,谷歌,大查詢使用JavaScript

沒有任何一個有一個例子或如何,我可以使用JavaScript和負荷數據谷歌與大查詢API連接教程從示例表到一個簡單的HTML頁面。

在此先感謝。

+0

我已經能夠連接到谷歌「短URL的API」並對其進行測試,現在我想與BigQuery連接和嘗試運行一些查詢。 – shabeer90 2012-07-12 10:38:21

回答

8

嘗試是這樣的:

<html> 
    <head> 
    <script src="https://apis.google.com/js/client.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script> 
     // User Submitted Variables 
     var project_id = 'XXXXXXXXXXX'; 
     var client_id = 'XXXXXXXXXXXXXXXXXX.apps.googleusercontent.com'; 

     var config = { 
     'client_id': client_id, 
     'scope': 'https://www.googleapis.com/auth/bigquery' 
     }; 

     function showProjects() { 
     var request = gapi.client.bigquery.projects.list(); 
     request.execute(function(response) {  
      $('#result_box').html(JSON.stringify(response, null)); 
     }); 
     } 

     function showDatasets() { 
     var request = gapi.client.bigquery.datasets.list({ 
      'projectId':'publicdata' 
     }); 
     request.execute(function(response) {  
      $('#result_box').html(JSON.stringify(response.result.datasets, null)); 
     }); 
     } 

     function runQuery() { 
     var request = gapi.client.bigquery.jobs.query({ 
      'projectId': project_id, 
      'timeoutMs': '30000', 
      'query': 'SELECT TOP(repository_language, 5) as language, COUNT(*) as count FROM [publicdata:samples.github_timeline] WHERE repository_language != "";' 
     }); 
     request.execute(function(response) {  
      console.log(response); 
      $('#result_box').html(JSON.stringify(response.result.rows, null)); 
     }); 
     } 

     function auth() { 
     gapi.auth.authorize(config, function() { 
      gapi.client.load('bigquery', 'v2'); 
      $('#client_initiated').html('BigQuery client initiated'); 
      $('#auth_button').fadeOut(); 
      $('#projects_button').fadeIn(); 
      $('#dataset_button').fadeIn(); 
      $('#query_button').fadeIn(); 
     }); 
     } 

    </script> 
    </head> 

    <body> 
    <h2>BigQuery + JavaScript Example</h2> 
    <button id="auth_button" onclick="auth();">Authorize</button> 
    <div id="client_initiated"></div> 
    <button id="projects_button" style="display:none;" onclick="showProjects();">Show Projects</button> 
    <button id="dataset_button" style="display:none;" onclick="showDatasets();">Show datasets</button> 
    <button id="query_button" style="display:none;" onclick="runQuery();">Run Query</button> 
    <div id="result_box"></div> 
    </body> 
</html> 
+0

非常感謝這段代碼,我設法創造了類似的東西,但並不簡單。 是否有反正我們可以禁用授權彈出(不與「立即:虛假」),所以外部用戶可以從我們的數據集查詢,而無需登錄他們的Gmail帳戶, – shabeer90 2012-07-19 12:13:20

0

我發現JavaScript的身份驗證方法笨重,無據可查。我建議使用Python服務來運行查詢。您可以預先加載您的憑證與服務。

看看這個例子:

https://vida.io/documents/icwvp4qcCbEkYW2ve

$.post("https://pyapi-vida.herokuapp.com/bigquery", "SELECT * FROM [nyc_taxi_public.total_amount_month] LIMIT 1000", function(result) { 
    result.forEach(function(d) { 
    bqData.push({"date": d3.time.format("%m/%Y").parse(d[0]), 
     "amount": +d[1]}); 
    }); 

    drawLineChart(bqData); 
}); 
+0

使用JavaScript的優勢是您可以直接調用API並避免向後端服務器發出額外請求 – hoju 2016-12-13 12:05:33

+0

我已經使用Google JavaScript API完成了一個示例。 https://vida.io/documents/6iwKZfJRzMrSCGaT6。您需要設置身份驗證。 Viz創建者需要知道如何配置共享。在加載時,用戶需要使用Google帳戶登錄。我認爲用戶體驗有點混亂。您查看可視化文件,會要求您提供Google帳戶。我認爲控制可視化層的授權會更好。 – 2016-12-13 22:00:29