Create the ultimate Google Analytics Dashboard for Drupal – Part 3

Create the ultimate Google Analytics Dashboard for Drupal – Part 3

By George Papadongonas 5th October 2012 Drupal

This is the third and final part of this blog series. In the first part we installed and customized the Google Analytics Reports module and in the second part we created a Social Media Dashboard that displays the data in table format using Views.

The dashboard that we created in the previous part displays useful information, but the real fun starts when we create charts to visualize the data and make them easily understandable to everyone.
 
Following a similar procedure as in the previous post, you first have to create different Views panes for every specific metric and then use Page Manager to display all of them together in the dashboard.
 
Unfortunately, the Google Analytics Views module does not still support the “Chart” format, so you have to use the Views Dataviz module. After the installation, there is a new “Dataviz” format in Views, which you can use to create the charts.
 
 
The Dataviz settings are really simple, allowing you to customize the chart display:
 
 
Grouping field: If your report contains multiple dimensions, you have the ability to group your chart by one or more fields and display it in a more meaningful way.
 
Type: From this menu, you can select the type of the chart. Depending on your selection, there may be a secondary menu with more options. For example, for the line chart you can select if you want line smoothing or not and for the pie chart you can define if the text on the pie slices will be a percentage, the actual value, the label of this figure, or just nothing. Usually, it makes sense to experiment with different chart types, trying to find the optimal way to present the data. 
 
Width, Height: You can also define the exact width and height of every chart, or just leave it blank to use the default values.
 
Colors: In this field, you can select the specific colors for your chart, separated by a comma. Accepted values are hex colors (like #6495ED) and color names (like LightCoral).
 
Enable interactivity:  This checkbox defines if the charts will be interactive or not. 
 
So, by keeping the same field definition that we used in the previous post and changing the format from Table to Dataviz, you can easily transform your dashboard. For the specific reports that we built, I preferred to use the Pie Chart type for the three top ones, the column chart for the two next ones and the line chart for the last one. Of course, you can experiment with different types and decide what makes more sense for your case.
 
The final result can be seen in the following image:
 
 
Using Views to display Google Analytics data is the easiest way to do it, but sometimes it’s not that flexible. If you have specific requirements for a report, which cannot be created with Views, you can always write your custom code, using the Google Chart API module.  There are some code examples on the module's documentation page. We will examine more complex use cases with custom code, in one of our future blog posts.  

Comments

DaneeL's picture
DaneeL

Hi,

Great tutorial!
I tried to follow it, but for some reason I can get the charts working.
I get the data in a table format, but the chart is always empty.
Any suggestion how to troubleshoot?

Chip's picture
Chip

Is there any way to pull in multiple site profiles with this module and setup? For companies with multiple websites (we have 10 news sites), the appeal of this is negated unless we can see all the profiles in one Drupal site.

Add comment

Search form

Latest comments

  • Daniel's picture

    By the way, by "no documentation" I´m referring to Views Autorefresh. It is either not complete or conflicting.

    Daniel
  • Daniel's picture

    Thanks for this info, but can't get it working with Statuses view. There is just about no documentation or it's conflicting, even from module maintainer (on Drupal vs. Blog). I'm using the default Statuses block, which only autorefreshes the current user's status updates, does not autorefresh friends' status updates (that is how it normally works). So I added Views Autorefresh. I have tried using the maintainer's instructions, but don't get a Secondary Display on the original view unless I have a Page display within that same view. Have you tried with Statuses? Just to confirm your steps:
    1. First, I clone the original view and ADD a Contextual filter. In mine it is Statuses Comments: Created time (with operator).
    2. ADD to the cloned view the Global: Text Area, PHP. Nothing else in the Header. Have also tried it with a simple Global: Autorefresh.
    2. In the ORIGINAL view, I ADD the same Global: Text Area, PHP code. Nothing else in the Header or contextual filters?

    I've tried just about every variation and nothing works. Can you offer any advice?
    Thanks
    Daniel

    Daniel
  • bandar bola's picture

    It's nearly impossible to find knowledgeable people on this subject, but you seem like you know what you're talking about! Thanks
    bandar bola

    bandar bola