Skip to main content
SimilarExport ZIP
100%

Final Project Time Scatter Plot

✓ Published1🌍 Public
Aahuynh8@dons.usfca.edu
Last edited Apr 12, 2024
Created on Apr 12, 2024

This scatter plot visualizes the weighted average price of barley, corn, oats, and sorghum over time, with each crop colored using a Tableau10 ordinal scale and a d3-legend legend. The visualization loads CSV data from a GitHub repository, groups it by crop type, and uses d3.scaleTime and d3.scaleLinear for the x- and y-axes. Circles are rendered via SVG with d3.csv, d3.group, and d3.extent, while axes and legends are generated using d3.axisBottom, d3.axisLeft, and d3.legendColor.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Final Project Import/Export Bar Graph

This chart displays U.S. grain exports and imports for the year 2023, with horizontal bars for each grain type plotted side-by-side against separate linear scales for exports and imports. Built with D3 v6 and rendered as SVG, it uses `d3.csv` to load annual data from two remote CSV files, `d3.scaleBand` for the categorical axis, and `d3.scaleLinear` for the quantitative values. D3 legend and topojson libraries are also included, though the legend is not visibly used in the final rendering.

Aahuynh8@dons.usfca.edu
73% match
Loading thumbnail…

Project_crop_yield

This horizontal bar chart visualizes crop yield data, comparing production across different crops. The chart uses a linear scale for the x-axis representing production values and a band scale for the categorical crop names on the y-axis. Built with React and D3.v5, the visualization imports local modules like `AxisBottom`, `AxisLeft`, and `Marks` to render SVG elements. Data is loaded from a CSV file using D3's `csv` function, with tooltips displaying formatted values via `d3.format`. The bars are colored steel blue, and axis ticks use custom styling.

PPothuguntla Pranitha
73% match
Loading thumbnail…

Fork of Assignment 7 Multi-Line Time Series Plot

This example shows a multi-line time series of average prices for four gourd varieties (bottle, bitter, smooth, and snake gourd) in Nepal, with each commodity rendered as a distinct colored line over time. The chart uses d3.csv to load data from a GitHub raw CSV file, d3.group to organize the data by commodity, and d3.legendColor to display a color legend. Axes are drawn with d3.axisBottom and d3.axisLeft, while the lines are generated using d3.line within an SVG rendering.

CCurran Kelleher
73% match
Loading thumbnail…

Fork of Fork of Bar Chart

This example pairs a bar chart of average crop yields by rainfall category with a scatter plot of individual rainfall-yield observations, using a small CSV dataset. The bar chart groups rainfall into bins (0–500, 500–1000, 1000–1500, 1500+ mm) and plots the mean yield per bin, while the scatter plot shows raw points with tomato-colored circles. Built with D3 v6, the code uses `d3.rollups` to aggregate means, `scaleBand` for categorical axes, and `scaleLinear` for continuous axes, rendering both charts as SVGs with hover highlighting on bars. The dataset is loaded via `d3.csv`, and the visualization focuses on revealing any correlation between rainfall and crop yield.

Rrobertotienonyaranga@gmail.com
73% match
Loading thumbnail…

transition

This animated scatterplot cycles through barley yield data from six Minnesota sites across nine years, showing how the distribution shifts with each season. Circles represent individual variety-site combinations, colored by barley strain and positioned by site on the x-axis and yield on the y-axis. The visualization uses D3 v4’s `d3.csv` to load the data and `d3.transition()` with a 1.5-second interval to animate circle entry, exit, and radius changes. Data comes from the `barleyfull.csv` file, rendered as SVG circles with opacity.

EEranM6
72% match
Loading thumbnail…

Barley PunchCard Chart v5 - static

This example shows barley yield data for a single site, with each variety as a horizontal row of circles positioned by year, where circle radius encodes yield and color distinguishes barley genotypes. The chart is built with D3 v5 using nested data from a CSV file, rendered as SVG. It employs `d3.nest()` for grouping, `d3.scalePoint` for the y-axis, `d3.scaleLinear` for years, and `d3.scaleOrdinal` with the `schemeAccent` color palette, alongside `d3.axisLeft` and `d3.axisBottom` for axes.

JJimMaltby
72% match
Loading thumbnail…

Line Chart Group 2 Final

This example displays a line chart of crop production over time, using a dataset of yearly production values. It draws a single red line and labels the axes and title, with a y-axis label for production and an x-axis label for year. The chart is generated with D3 v5, using `scaleTime`, `scaleLinear`, `line`, `axisLeft`, and `axisBottom`, and renders as an SVG. Production data is loaded from a GitHub gist CSV file, and the visualization is styled with custom CSS for fonts and axis appearance.

AArun Pratap
71% match
Loading thumbnail…

Fork of Fork of Fork of Bar Chart

This example pairs a bar chart with a scatter plot to explore the relationship between rainfall and crop yield. The bar chart groups average yield by rainfall category, while the scatter plot plots raw rainfall against yield. Both visualizations use D3.js v6, with `d3.rollups` for aggregation, `d3.scaleBand` and `d3.scaleLinear` for axes, and SVG rendering. The code loads a CSV dataset and applies a custom categorization function to bin rainfall values.

Rrobertotienonyaranga@gmail.com
71% match