2016-12-28 31 views
0

我使用嵌入api顯示來自GA的一些數據到圖表中,但api只支持基本的東西(線,列,欄,表格和GEO。 )。使用谷歌圖表的高級功能的GA嵌入API

有沒有什麼辦法可以在Google Charts庫中使用embed api?

像使用餅圖而不是列圖?

這裏是我的代碼:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>ChartDemo</title> 
</head> 
<body> 
<script> 
(function(w,d,s,g,js,fs){ 
    g=w.gapi||(w.gapi={});g.analytics={q:[],ready:function(f){this.q.push(f);}}; 
    js=d.createElement(s);fs=d.getElementsByTagName(s)[0]; 
    js.src='https://apis.google.com/js/platform.js'; 
    fs.parentNode.insertBefore(js,fs);js.onload=function(){g.load('analytics');}; 
}(window,document,'script')); 
</script> 

<div id="embed-api-auth-container"></div> 
<div id="chart-container"></div> 
<div id="view-selector-container"></div> 

<script> 

gapi.analytics.ready(function() { 

    /** 
    * Authorize the user immediately if the user has already granted access. 
    * If no access has been created, render an authorize button inside the 
    * element with the ID "embed-api-auth-container". 
    */ 
    gapi.analytics.auth.authorize({ 
    container: 'embed-api-auth-container', 
    clientid: 'supersecretclientid.apps.googleusercontent.com' 
    }); 


    /** 
    * Create a new ViewSelector instance to be rendered inside of an 
    * element with the id "view-selector-container". 
    */ 
    var viewSelector = new gapi.analytics.ViewSelector({ 
    container: 'view-selector-container' 
    }); 

    // Render the view selector to the page. 
    viewSelector.execute(); 


    /** 
    * Create a new DataChart instance with the given query parameters 
    * and Google chart options. It will be rendered inside an element 
    * with the id "chart-container". 
    */ 
    var dataChart = new gapi.analytics.googleCharts.DataChart({ 
    query: { 
     metrics: 'ga:sessions', 
     dimensions: 'ga:date', 
     'start-date': '30daysAgo', 
     'end-date': 'yesterday' 
    }, 
    chart: { 
     container: 'chart-container', 
     type: 'COLUMN', 
     options: { 
     width: '100%' 
     } 
    } 
    }); 


    /** 
    * Render the dataChart on the page whenever a new view is selected. 
    */ 
    viewSelector.on('change', function(ids) { 
    dataChart.set({query: {ids: ids}}).execute(); 
    }); 

}); 
</script> 
</body> 
</html> 

回答

0

找到解決方案,必須下載並運行它可以在GitHub的頁面上找到的SDK。否則,gapi.analytics.ext語句將不會被定義...

0

您不僅可以使用谷歌圖表來顯示結果,你可以選擇你喜歡的任何第三方的可視化庫。

更多信息和演示在這裏:https://ga-dev-tools.appspot.com/embed-api/third-party-visualizations/

+0

嘗試演示...(gapi.analytics.ext是未定義的)。我只想知道我如何從GA獲取數據,以及如何在圖表(第三方)中獲取數據。 –