This post presents examples of a Word-tree chart, and a Column chart that are created using Google Chart engine that are interactive and can be embedded in a HTML page.
We have a sample dataset of 250 college students’ favorite drink brand names in a raw format (fictitous dataset):
Coca-Cola…etc.
Pepsi
Starbucks
RedBull
Monster
Gatorade
Coca-Cola
Pepsi
DrPepper
DrPepper
Starbucks
RedBull
Monster
Gatorade
Coca-Cola
Arizona
DrPepper
Arizona
Rockstar
Coca-Cola
Sprite
7Up
Pepsi
Nestlé-Iced-Tea
Sprite
Now I want to accomplish two things: 1) To get a count of word frequencies (e.g. which brands appear how many times), and draw a chart to visualize the brands that are most popular to least popular by using Font size according to frequency, and 2) To draw a column chart showing the number of responses favoring each brand. Imagine that the above data snapshot of 25 rows exhibits the same distribution for the rest of the 250 students data (so, you don’t have to scroll through 250 rows of the same data to get the point).
The resulting charts, which also has basic interactivity, are shown below:
As you hover your mouse or tap (or on touch-only devices like smartphones, tablets), additional information shows for each datapoint. These are created with a combination Google Charts and Javascript. The Word-tree chart is created using google.visualization.WordTree class; the Column chart is created using google.visualization.ColumnChart class. For more information on how to use them, visit Google’s chart documentation for developers.
The advantage of the Word-tree is that you don’t actually have to provide the count or frequency of the items (e.g. beverage brand names), the chart will figure it out for you. In the case of the Column chart however, you do need to provide 2 columns: Brand name, its count or frequency. In this example, the units shown are in 10x (so, 4 is 40 for example).
If you need the actual code for these charts that you can use for your own purposes contact me here or via Patreon following this link. I hope this was educational as well as interesting. Until next time…
