Making Great Bar Charts In R

Problem

As data collection and aggregation grows in an organization, presenting and consuming that data can become a real challenge. A good foundation in visualization eases this burden. Using bar charts effectively can help with sw

Actions

We will walk through an example of how to create a useful and beautiful barchart in R.

Example

In R, the library ggplot2 is your best friend when it comes to creatingstatic bar charts. You can create a simple one with the following code:

library(ggplot2)

ggplot(mpg, aes(class, fill = class)) + geom_bar()

image

This bar chart is simple and effect but we can do better. We can start simple by adding titles.

ggplot(mpg, aes(class, fill = class)) + geom_bar() +
  labs(title = "Count of Car Classes MPG Dataset", x = "Car Class", y = "Count")

image

The background space in this chart isn’t really pleasing to the eyes. We can make a customize the chart and make it all grey for effect:

library(ggplot2)
library(scales)
library(grid) 
library(RColorBrewer)
library(extrafont)
library(reshape)
library(ggthemes)

blogData = mpg

palette <- brewer.pal("Greys", n=9)
color.background = palette[2]

ggplot(mpg, aes(class, fill = class)) + geom_bar() +
  labs(title = "Count of Car Classes MPG Dataset", x = "Car Class", y = "Count")+
  theme_bw(base_size=9)+
  theme(panel.background=element_rect(fill=color.background, color=color.background)) +
  theme(plot.background=element_rect(fill=color.background, color=color.background)) +
  theme(panel.border=element_rect(color=color.background))+
  theme(legend.background = element_rect(fill=color.background))

image

A few more modifications can be made.

  1. Sort by count
  2. Flip the axis
  3. Overlay the count
  4. Change the font of the chart
  5. Change the opacity of the bars
  6. Remove the legend (doesn’t add any value)
  7. Some other aesthetic fixes
library(ggplot2)
library(scales)
library(grid) 
library(RColorBrewer)
library(extrafont)
library(reshape)
library(ggthemes)
library(dplyr)

blogData = mpg

palette <- brewer.pal("Greys", n=9)
color.background = palette[2]

newMPG <- group_by(mpg,class) %>%
  summarise(total = n()) %>%
  arrange(desc(total))

ggplot(newMPG, aes(x=reorder(class, +total), total)) + coord_flip()+ geom_bar(fill = "#6f00ff", stat="identity") +
  labs(title = "Count of Car Classes", x = "Car Class", y = "Count")+
  geom_text(aes(y=total - 1, label=total), position = position_dodge(.09), vjust= .5, size = 3, hjust = 1.3, fontface= "bold", family = "Hack")+
  my_theme()
  
my_theme <- function() {
  
  # Generate the colors for the chart procedurally with RColorBrewer
  palette <- brewer.pal("Greys", n=9)
  color.background = palette[2]
  color.grid.major = palette[3]
  color.axis.text = palette[6]
  color.axis.title = palette[7]
  color.title = palette[9]
  
  # Begin construction of chart
  theme_bw(base_size=9) +
    
    # Set the entire chart region to a light gray color
    theme(panel.background=element_rect(fill=color.background, color=color.background)) +
    theme(plot.background=element_rect(fill=color.background, color=color.background)) +
    theme(panel.border=element_rect(color=color.background)) +
    
    
    # Format the grid
    theme(panel.grid.major=element_line(color=color.grid.major,size=.25)) +
    theme(panel.grid.minor=element_blank()) +
    theme(axis.ticks=element_blank()) +
    
    
    # Format the legend, but hide by default
    theme(legend.position="none") +
    theme(legend.background = element_rect(fill=color.background)) +
    theme(legend.text = element_text(size=7,color=color.axis.title)) +
    
    
    # Set title and axis labels, and format these and tick marks
    theme(plot.title=element_text(color=color.title, size=15, vjust=1.25,face="bold", family="Hack")) +
    theme(axis.text.x=element_text(size=10,color=color.axis.text)) +
    theme(axis.text.y=element_text(size=10,color=color.axis.text)) +
    theme(axis.title.x=element_text(size=10,color=color.axis.title, vjust=0, face="bold", family= "Hack")) +
    theme(axis.title.y=element_text(size=10,color=color.axis.title, vjust=1.25, face="bold", family = "Hack")) + 
    theme(strip.text.y = element_text(size = 10, colour = "black", face="bold", family = "Hack")) +
    theme(strip.background = element_rect(fill=color.background, color=color.background, size=1)) +
    
    # Plot margins
    theme(plot.margin = unit(c(0.35, 0.2, 0.3, 0.35), "cm"))
}

image

Now we have a chart worth sharing.

References:

ggplot2

Max Woolf


Adobe DTM - Previous Page Name

Problem

You want to track the previous page name via Adobe DTM but you can’t use a Plugin (getPreviousValue).

Actions

You can use Session Storage to track the previous page name.

Explanation (resolution)

You need two Page Load Rules (PLR) to track the previous page name. First PLR:

  • Name: Save prior page name to session storage
  • Trigger Rule at “DOM Ready”
  • Rule Condition: Path “.*” (regex enabled)
  • Custom Code “None-Sequential Javascript”:
if(typeof(Storage) != "undefined") {
  if (typeof(s) !== "undefined") {
    sessionStorage.pagename = s.pageName;
  }
}

Second PLR:

  • Name: Save prior page name to prop
  • Trigger Rule at “Bottom of Page”
  • Rule Condition: Path “.*” (regex enabled)
  • Rule Condition - Custom:
if(typeof(Storage) !== "undefined") {
  if(typeof(sessionStorage.getItem("pagename")) === "string") {
    var prevPageName = sessionStorage.getItem("pagename");
    _satellite.setVar("previousPage",prevPageName);
    return true;
  }
}
  • Adobe Analytics: prop2 set as %previousPage% //Or any other prop you want to use, just enable pathing on it.

There you go, the previous pageName is implemented.

References

Previous page name - apastebin


Adobe DTM - Using Browser Console Messages

Problem

Error messaging, or messaging in general, is often overlooked in the development process causing difficulties in debugging and managing code deployed by a TMS.

Actions

You can leverage a function called _satellite.notify(), a cross browser supported function, contained within DTM to send informative messages to the browser console. This is especially helpful when deploying 3rd party scripts.

Explanation (resolution)

At it’s most basic level, _satellite.notify() takes two arguments to send a message to the browser console:

  • Descriptive message text
  • Numeric level of intensity

Let’s use a working example to understand how we can use _satellite.notify() to send messages to the browser about the status of a 3rd party marketing pixel.

Intensity 1 - A message that the pixel fired

_satellite.notify("DoubleClick tag fired.", 1); DTM Level 1 Notification

Intensity 3 - A message about the end of the campaign

_satellite.notify("The DoubleClick campaign ends in 5 days.", 3); DTM Level 3 Notification

Intensity 4 - A message that the campaign has ended

_satellite.notify("The DoubleClick campaign has ended. Please remove the pixel from Adobe DTM.", 4); DTM Level 4 Notification

Intensity 5 - A message alerting a critical issue

_satellite.notify("The DoubleClick servers are taking longer than 3 seconds to respond.", 5); DTM Level 5 Notification

References

Avoid the Marketing Pixel Wasteland