You can easily add google analytics data in your custom app by using the ga-ez-dash library
This library is super easy to use and quick to install. I am not going to go into much details and the code is quite self explanatory.
All applications that use the Google Analytics API must be registered through the Google APIs Console. When you register in the console, you will create a new project and configure the settings to work with this library. Once configured, the console will provide you with a few values that you need in the configuration step.
Upload the library to a folder in your document root.
Create a blank page and add the following code into that page.
<!DOCTYPE>
<html>
<head><title>GA Dash Demo</title></head>
<body>
<!-- Add Google Analytics authorization button -->
<button id="authorize-button" style="visibility: hidden">
Authorize Analytics</button>
<!-- Div element where the Line Chart will be placed -->
<div id='line-chart-example'></div>
<!-- Load all Google JS libraries -->
<script src="https://www.google.com/jsapi"></script>
<script src="gadash-1.0.js"></script>
<script src="https://apis.google.com/js/client.js?onload=gadashInit"></script>
<script>
// Configure these parameters before you start.
var API_KEY = 'Enter Your API Key Here';
var CLIENT_ID = 'Enter Your Client ID Here';
var TABLE_ID = 'Enter your Table ID here';
// Format of table ID is ga:xxx where xxx is the profile ID.
gadash.configKeys({
'apiKey': API_KEY,
'clientId': CLIENT_ID
});
// Create a new Chart that queries visitors for the last 30 days and plots
// visualizes in a line chart.
var chart1 = new gadash.Chart({
'type': 'LineChart',
'divContainer': 'line-chart-example',
'last-n-days':30,
'query': {
'ids': TABLE_ID,
'metrics': 'ga:visitors',
'dimensions': 'ga:date'
},
'chartOptions': {
height:600,
title: 'Visits in January 2011',
hAxis: {title:'Date'},
vAxis: {title:'Visits'},
curveType: 'function'
}
}).render();
</script>
</body>
</html>
Once you’ve copied and pasted the code, you just need to configure the chart to work with your data.
Replace the API_KEY and CLIENT_ID values with the respective API Key and Client ID that you created in the Google APIs console during the first step.
Replace the TABLE_ID parameter with ga: + your profile ID. Finding your profile ID is easy. Just log into Google Analytics and navigate to the profile you want to use. After logging in, there will be a profile ID at the end of the URL in the address bar after the ‘p’. This is your profile ID. Example: p’XXXX’.
Use ga: + your profile ID to get your Table ID. So if your profile ID was 8325, your table id would be ga:8325.
Save the file. You’re done!
Usage
Navigate your browser to the URL this script is hosted on. The script will:
- Display a button asking for you to authorize
- Click the button. You will be prompted to login and authorize access
- Once complete, the script will retrieve visitors over the past 30 days, and display the data in a pretty line chart
Great Success!
The full article can be read here : http://analytics-api-samples.googlecode.com/
My Next post I will show how to show a bunch of accounts underneath each other.
