Charts
Sparklines in Big Number charts
Bullet chart
Chart annotations
Links in Big Number charts
Choropleth map
Chart heights
Funnel chart
Force-directed graph
Google Maps with markers
Geographic heat map
Hive plot
Heat map
How to implement gallery examples using the HTML editor
Network matrix
Horizontal bar chart
Creating Chart Annotations using Matplotlib
How to Create R Histograms & Stylize Data
Creating Histograms using Pandas
Creating Horizontal Bar Charts using Pandas
Creating Horizontal Bar Charts using R
State choropleth map
Sunburst chart
Word cloud
World choropleth map
Zipcode choropleth map
Word cloud
Word clouds allow you to quickly identifying the most common terms from a dataset of free-form text.
Here's an example word cloud using San Francisco crime incident descriptions.
Click Powered by Mode to clone the example and make a word cloud. Learn more about using HTML to customize your reports.
Create a word cloud
Add the stylesheet link and script tags to the top of the HTML:
<link rel="stylesheet" href="https://mode.github.io/alamode/alamode.min.css">
<script src="//cdn.rawgit.com/jasondavies/d3-cloud/master/build/d3.layout.cloud.js"></script>
<script src="https://mode.github.io/alamode/alamode.min.js"></script>
Add the customizable snippet at the bottom of the HTML:
<script>
alamode.wordCloud(
{
query_name: "SF Crime Incidents",
height: "400",
width: "700",
word_column: "keyword",
word_count_column: "frequency",
colors: ["#37B067","#22A3C0"]
}
)
</script>
You can customize the word cloud by editing the parameters in the snippet:
html_element
: If not provided, the funnel will be added as the last element in the report. To place it elsewhere, select an element in your report with this parameter.query_name
: The name of the query that returns the word cloud's dataset. If you update the name of the query, you’ll need to update it here as well.height
: The height of the word cloud in pixels.width
: The width of the word cloud in pixels.word_column
: The dataset column that defines the words you want to display. (The Postgres functionREGEXP_SPLIT_TO_TABLE
can be helpful for creating this data in your query.)word_count_column
: The dataset column that defines how frequently each word appears and how large each word should be.colors
: An array of hex codes that defines the text colors. You can find a library of hex color codes here.