Magic Mirror: Display your website visitors location on a rotating globe with Google Analytics

This article describes how to picture the location of your website visitors on a rotating globe.

Do you prefer to display your data in a simple table or a rotating globe?

When I started to find a way to query google analytics using node.js to use it for a module for the Magic Mirror I was just looking for a comfortable solution to keep an eye on the visitor growth. The most motivating for me is to see, is the location of the people visiting my site.
This was already exciting in a table view, but then I stumbled about this animated earth globe in the MMM-Globe module, I saw what I had to do.

This WebGL based rotating globe really a piece of modern art in my eyes. You want to hear some interesting facts?

Amazing, isn’t it? Well, I think I need to warn you! If you already have a Magic Mirror or are planning to build one, here comes the bad news.
This is not run able on a Raspberry Pi 3, caused of the needed processor intensive calculations.

So time to look for a stronger alternative. But this is something else, I’m willing to blog later.

Installation of the setup

If you’re interested in showing your website data on the globe, follow these steps:

  1. Install the module MMM-GoogleAnalytics by following the installation instructions on Github.
  2. In the config part of MMM-GoogleAnalytics:
    1. ensure to enable 'ga:city, ga:country' for the dimensions-section in your query. Time range, filters and sort are fully adjustable!
    2. switch exportdatatoMMM_Globe:parameter from 0 to 1
  3. Install the module MMM-Globe.
  4. Enable the with by replacing the parameter value from 0 to 1 like  receiveExternalLocations:1 .

That’s all! Now start your mirror and lean back.

 

Magic Mirror: Show how your website performs with MMM-GoogleAnalytics

This blog post describes how to get credentials for using Googles Analytics Core Reporting API with module for the MagicMirror².
See the full setup and capabilities of this Magic Mirror Module on Github: MMM-GoogleAnalytics.

1. Create a Service Account Googles Developer console

  • First create a new project on Googles Developer console like “mywebsiteGAapi”.
  • Under the section “Credentials”, execute “Create credentials” and choose “Service account key
  • Create a new service account and choose a Service account name

    • Role: Project -> Viewer
    • Key type: JSON
    • Copy the email address under Service account ID
  • Click “Create”, save and rename your credential file (e.g. mywebsiteGAapi-6116b1dg49a1.json) in keyfile.json and save it in your MMM-GoogleAnalytics folder., like MMM-GoogleAnalytics/keyfile.json

2. Create a User and get your View ID from your Google Analytics Account

  • open the Admin panel in your Google Analytics Account and enter the User Management section
  • Create a new user
    • Email address:  The one you copied previously (It’s also in the JSON-file you already saved)
    • Property Permissions: Read & Analyse
  • Back in the Admin panel under View enter the View Settings

  • Copy the View ID

Perfect you did it, that’s all!