Google Analytics for Shiny Dashboard App

Question

I have a well sorted out R shiny (shinydashboard) app that runs on a server. I want to be able to track its usage and know that google analytics is a good solution for this. But I have run into an issue setting it up.

I have tried following the directions described here https://shiny.rstudio.com/articles/google-analytics.html

They suggest the creation of a google-analytics.js script containing the global site tag from google:

<!-- Global Site Tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-4XXXXX5-2">
</script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-4XXXXX5-2');
</script>

They then suggest that this "google-analytics.js" script file be called in the shiny app header like the following:

#ui.r
library(shiny)
shinyUI(fluidPage(

  tags$head(includeScript("google-analytics.js")),
  includeCSS("cerulean.css"),

  titlePanel("Sunlight in the US"),

However because I am using shiny dashboard my shiny layout is different...

#ui.r
library(shiny)
library(shinydashboard)

dashboardPage(

  dashboardHeader(title = "Single Cell Database"),

  dashboardSidebar(
    sidebarMenu(
      menuItem("P15 Clustering", tabName = "P15_Cluster", icon = icon("th")),
      menuItem("P15 Violin Plots", tabName = "P15_Violin", icon = icon("th"))
    )),

  dashboardBody(
    tabItems(
      tabItem(tabName = "P15_Cluster",

I can not seem to figure out where to place the...

tags$head(includeScript("google-analytics.js")),

... in the shiny dashboard format. Additionally, because googles code format no longer matches the example i am not confident the new format of script functions.

Any assistance or advice on where to call the "google-analytics.js" script inside the shiny dashboard header, or on how to format the code inside the "google-analytics.js" file would be much appreciated!

Answer 1

I have the same problem with you. I can solve the problem and it works after following the tutorial at https://shiny.rstudio.com/articles/usage-metrics.html

first step: You can use the following code in google-analytics.js file :

(function(i,s,o,g,r,a,m){
  i['GoogleAnalyticsObject']=r;
  i[r]=i[r] || 
  function(){
    (i[r].q=i[r].q||[]).push(arguments);
  },i[r].l=1*new Date();
  a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];
  a.async=1;
  a.src=g;
  m.parentNode.insertBefore(a,m);
})(window,document,'script',
   'https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-4XXXXX5-2', 'auto');
ga('send', 'pageview');

$(document).on('change', 'select', function(e) {
    ga('send', 'event', 'widget', 'select data', $(e.currentTarget).val());
});

$(document).on('click', 'button', function() {
  ga('send', 'event', 'button', 'plot data');
});

and the second, you can call the file "google-analytics.js" in "dashboardBody". such as the syntax below:

dashboardBody(
    tags$head(includeScript("google-analytics.js")),
    tabItems(
      tabItem(tabName = "P15_Cluster",