Skip to main content
SimilarExport ZIP
100%

Colm Lang A5 | Bubble Chart

✓ Published1🌍 Public
CColm Lang
Last edited Feb 28, 2022
Created on Feb 28, 2022

This bubble chart visualizes bee colony loss across four U.S. states from 2019 to 2021, plotting starting colony counts on the y-axis against time quarters on the x-axis. Each bubble’s size encodes the percentage of colonies lost, while its color distinguishes the state, with legends showing both scales. The visualization is built with D3 v7 and the d3-legend extension, using SVG rendering. Data is loaded from a CSV file via `d3.csv`, with axes created using `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisBottom`/`d3.axisLeft`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Colm Lang A5 | Line Chart

This line chart visualizes the estimated number of honey bee colonies starting each quarter in the United States from 2015 to 2021, based on data from a CSV file. The chart uses `d3.scaleBand` for the year-quarter x-axis and `d3.scaleLinear` for the y-axis, with tick labels formatted in thousands. A single `path` element is drawn using `d3.line()` to connect the data points, while circles mark each observation. The SVG rendering includes custom styling for axes, labels, and interactive hover effects on the dots.

CColm Lang
85% match
Loading thumbnail…

Fork of Percent Bee Colony Loss by State and Year

A square for each state-year pair encodes the percentage of bee colony loss using a red color scale, with states sorted by their worst recorded loss. The visualization reveals no clear geographic or temporal trends, suggesting colony losses are randomly distributed across the US. Built with the vega-lite-api, the chart uses `markRect()` for the tiles, `fieldN` for categorization, and a custom tooltip to display state, year, and loss values. Data comes from the Bee Colony Loss3.csv file, with appearance customized via a separate config file.

Sstanemurhula
83% match
Loading thumbnail…

Percent Bee Colony Loss by State and Year

This visualization displays the percentage of bee colony loss for each U.S. state across multiple years, using a matrix of colored squares. Each square’s color intensity represents the loss percentage, with states sorted by their worst-hit values along the x-axis and years on the y-axis. It highlights that colony loss appears random with no clear geographic or temporal trends. The code uses the vega-lite-api’s `markRect` and `encode` methods, with data loaded via d3.csv from a GitHub Gist, and includes tooltips for state, year, and loss percentage.

Mmkt-ds
82% match
Loading thumbnail…

Percent Bee Colony Loss by State and Year

This visualization displays the percentage of bee colony loss across US states and years using a grid of colored rectangles. The chart uses a red color scale to highlight loss severity, with states sorted by their worst year to reveal patterns. Built with the vega-lite-api library, it encodes state on the x-axis, year on the y-axis, and loss percentage as color, while tooltips show exact values. The data comes from a CSV file retrieved via d3’s csv function, rendering through Vega-Lite and Vega with an SVG output.

CCurran Kelleher
82% match
Loading thumbnail…

Treemap of Bee Colonies, Beekeepers, and Bee Colony Loss Numbers by State

This treemap visualizes bee colony loss numbers, beekeepers, and colony counts across US states from 2010 to 2016. The hierarchy nests each state by year, with leaf nodes representing the three metrics. Users can toggle between summing by colony size or counting each statistic, triggering a smooth animated transition. The visualization uses d3.treemap with d3.treemapResquarify, d3.hierarchy, and d3.scaleOrdinal for coloring, rendering SVG cells with clip-paths and labels. Data comes from a generated flare.json file based on USDA survey data.

Bbootshine2
81% match
Loading thumbnail…

Bee Colony Statistics by State and Year

A grid of colored rectangles maps bee colony loss percentages across U.S. states and years, revealing a random pattern with no clear geographic or temporal hotspots. Each cell encodes loss severity through a red color scale, with tooltips showing state, year, and percent loss for individual data points. The visualization is built using Vega-Lite API, React, and D3, loading data from a CSV of Bee Colony Loss statistics. The vega-lite-api `markRect` function encodes state on the x-axis and year on the y-axis, with color intensity representing the percentage loss.

Bbootshine2
81% match
Loading thumbnail…

Percent Bee Colony Loss by State and Year

This visualization displays the percentage of bee colony loss across U.S. states and years using a heatmap of rectangles, with each square color-coded on a red scale to highlight loss intensity. States are sorted by worst overall losses, and tooltips reveal exact values for state, year, and percentage. The chart is built with vega-lite-api and d3.v5, using a CSV data source from a GitHub gist. The encoding maps state to the x-axis, year to the y-axis, and the quantitative loss field to color.

Aalicenie
81% match
Loading thumbnail…

US States Heatmap of Bee Colony Loss

This interactive map visualizes annual bee colony loss across US states, with a dropdown to switch between percent loss, colony count, and beekeeper count metrics. The choropleth uses a blue sequential color scale applied through `d3.scaleThreshold`, mapping each state’s value to its fill. States are drawn as SVG paths generated by `d3.geoPath` with a `d3.geoAlbersUsa` projection from TopoJSON data, while hover effects and a tooltip (via `d3-tip`) highlight individual states. The data comes from a CSV file loaded with `d3.csv`, and the interface is built using React components.

Bbootshine2
81% match