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

100%

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

✓ Published1🌍 Public

Last edited Oct 24, 2019

Created on Oct 23, 2019

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.

AI-generated description

An example of porting a work from bl.ocks.org into VizHub. This is a direct port of Mike Bostock’s Block: Treemap, modified only to split into separate files, and to fit in the space available.

The data for this version was generated using a script from https://beta.vizhub.com/bootshine2/beebcddb5fed4c7783b242816468ba9e. Not sure how to automate the file create from the script, or it would use the original CSV file at https://gist.githubusercontent.com/bootshine2/dc83fa6615ecf51fb382e233bf90840a/raw/b36dc061260662b23849d71599d12b336ce027c9/Bee%2520Colony%2520Loss4.csv and would autogenerate the flare.json file.

MIT Licensed

Similar vizzes

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

87% match

Loading thumbnail…

D3 v5 Zoomable Sunburst of Bee Colony Statistics in the US

A zoomable sunburst chart displays US bee colony statistics, breaking down each state by year and further by loss, beekeepers, and colony counts. The interactive visualization allows users to click on segments to drill down into the hierarchy, with animated transitions smoothly rescaling the arcs. Built with D3 v5, it uses the `d3.hierarchy` and `d3.partition` layouts, renders via SVG, and animates with `transition.attrTween`. Data comes from a generated `flare.json` file, ported from an Observable notebook, with colors assigned per top-level state category.

Bbootshine2

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

84% 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

84% 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

84% 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

83% match

Loading thumbnail…

Percent Bee Colony Loss by State and Year

This heatmap displays the percentage of bee colony loss for each U.S. state across multiple years, with cells colored on a red scale from light to dark to indicate increasing loss severity. States are sorted by their worst recorded loss, and hovering over a cell reveals a tooltip with the specific state, year, and percentage. The visualization uses vega-lite-api to construct a rectangle mark, with data loaded via d3.csv from a GitHub Gist containing the Bee Colony Loss dataset. It is built with Vega-Lite’s markRect and tooltip encoding, and configured to fit the full window.

Aalicenie

83% match

Loading thumbnail…

Percent Bee Colony Loss by State and Year

This visualization shows percent bee colony loss by state and year, with each square representing a state's loss percentage during a census year. The layout is designed to reveal geographic trends or hotspots, though the data ultimately demonstrates that colony loss appears random and consistent across the US. The visualization is built using Vega-Lite and the vega-lite-api, using `markRect` and `markPoint` functions to encode data with color and position. Data comes from a CSV file loaded via `d3.csv`, with tooltips and sorting by worst-hit states enabled through VEGA tooltip handlers and configuration settings.

Ppalti

83% match