100%

Final Project: Honey Production in the United States (CS 573 Assignment #14.1)

✓ Published0🌍 Public

Last edited Dec 13, 2021

Created on Dec 11, 2021

Forked from Interactive: United States Honey Production per Year (CS 573 Assignment #13.1)

This interactive visualization combines a choropleth map of the United States with a line graph to explore honey production data per state and year. A drop-down menu switches the displayed variable among five metrics, and clicking a state adds its yearly trend to the line graph. Hovering reveals tooltips with values. Built with D3 v4, it uses `d3.geo.albersUsa` and `d3.geo.path` for the map, with SVG rendering and animation for interactivity.

AI-generated description

United States Honey Production per Year

This is an interactive visual of my Honey Production in the United States Dataset. It's both a line graph and a map of the United States.

The y-value of the line graph and the value the map is based on can be changed by the drop-down menu. States on the map are clickable and, if clicked, will add a line to the line graph for yearly values of the state. If the cursor is placed over either the points on the line graph or a state in the map, information about the selected variable will be displayed.

This is the final iteration of my final project: it is a combination of my Average Honey Production in the United States Map and Interactive United States Honey Production per Year Line Graph. All previous progress can be found on my CS 573 - Data Visualization Project Proposal.

MIT Licensed

Similar vizzes

Loading thumbnail…

Interactive: United States Honey Production per Year (CS 573 Assignment #13.1)

This interactive line graph shows United States honey production trends over time, letting users select among five variables: number of colonies, yield per colony, total production, stockpiles, and production value. The SVG visualization aggregates state-level data by year, computing averages for each metric. A dropdown menu updates the y-axis scale and line display, while a hover tooltip reveals exact values per year. Built with D3 v4, the code employs d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.group, with data drawn from a CSV hosted on GitHub.

AAlex Pietrick

87% match

Loading thumbnail…

Average Honey Production in the United States (CS 573 Assignment #12.1)

A choropleth map of the United States displays each state’s average honey production value from 1998–2012, with values encoded using a gray-to-orange linear color scale. The visualization uses the D3.js v3 library with the Albers USA projection (`d3.geo.albersUsa`) and `d3.geo.path` to render SVG paths from GeoJSON. Hovering over a state triggers a tooltip showing the state name and its production value, while clicking a state toggles its fill to yellow, an interaction designed for future linkage to a line graph. Data is aggregated from an external CSV via `d3.csv` and grouped by state.

AAlex Pietrick

86% match

Loading thumbnail…

Iterated: United States Honey Production per Year (CS 573 Assignment #9.1)

This interactive line graph visualizes total honey production across all 50 US states per year, aggregating raw state-level data into a single national trend line with data points. It uses D3’s `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` with `curveMonotoneX` to render an SVG chart. The code groups the CSV dataset by year via `d3.group`, sums production values, and displays the result with a steelblue line and circles, alongside labeled axes and a title.

AAlex Pietrick

86% match

Loading thumbnail…

Honey Production in the United States with Brushing (CS 573 Assignment #8.X)

A choropleth map and linked time-series histogram show U.S. honey production by state, with circles sized by total production value. Users brush a time range in the histogram to filter the map to show only years within that selection, using `d3.brushX` and React state. The map uses `d3.geoAlbersUsa` and `d3.geoPath` for U.S. state outlines, while the histogram bins monthly sums via `d3.histogram` and `d3.timeMonths`. Data comes from a CSV of honey production values loaded with `d3.csv`.

AAlex Pietrick

84% match

Loading thumbnail…

Untitled

This interactive line chart displays the total honey production in the United States from 1997 to 2012, aggregated by year and grouped by state. A dropdown menu lets viewers select among six metrics—number of colonies, yield per colony, total production, stocks, production value, and price per pound—to switch the displayed line. The visualization uses d3.line, d3.scaleLinear, and d3.schemeSet2 for scaling and coloring, with SVG circles marking each year’s data point. It loads data from a CSV file hosted on GitHub, processes it with d3.group and array methods, and updates the path via a custom update function.

AAlex Pietrick

83% match

Loading thumbnail…

United States Honey Production per Year (CS 573 Assignment #7.X)

This line graph visualizes the total honey production in all 50 US states per year, using a dataset from a GitHub gist. The visualization employs D3 v5 to render an SVG line chart, with a monotone curve connecting data points. The code uses D3’s `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom` APIs to construct the axes and plot. Styled with CSS, the chart includes axis labels and a title, with circles marking individual data points despite a placeholder loop that only draws one circle.

AAlex Pietrick

83% match

Loading thumbnail…

Forked Iterated: United States Honey Production per Year (CS 573 Assignment #9.X)

This example shows a line chart of total United States honey production aggregated by year from 1998 to 2012, using the d3.csv, d3.group, and d3.scaleTime APIs to aggregate raw state-level data into yearly totals. The chart renders as an SVG with d3.line for the path and circles for data points, while a custom menu component built with d3.dispatch lets the user select a different quantitative column—such as number of colonies or price per pound—to update the y-axis and line via d3.scaleLinear and d3.axisLeft.

AAlex Pietrick

79% match

Loading thumbnail…

US Honey Bees

This visualization shows US bee colony population trends for the 2020-Q2 period across states, plotting starting colony counts on the x-axis against maximum colony counts on the y-axis. Each circle represents a state, with its radius encoding the number of added colonies via `d3.scaleLinear` and its color mapped to renovated colonies using `d3.scaleSequential` with `d3.interpolateYlOrRd`. The SVG chart uses `d3.axisBottom` and `d3.axisLeft` with tick marks, and filters out the United States, California, and Texas as outliers. Data comes from a CSV file loaded via `d3.csv`.

PPeter Gish

75% match