Skip to main content
SimilarExport ZIP
100%

Untitled

✓ Published0🌍 Public
Nnanegole
Last edited Nov 4, 2023
Created on Nov 4, 2023

A ThemeRiver visualization displays changes in Massachusetts home sale prices over time, stacked into flowing streams by bedroom count. The chart uses D3 v6 to load CSV data, transforms it via the `d3.stack` generator, and renders smooth SVG areas with `d3.area` and `curveBasis`. Time and price scales map dates to the x-axis and cumulative price ranges to the y-axis, while each stream is colored by housing category.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

hw6_me

This visualization shows a ThemeRiver chart tracking median house sale prices over time, segmented by property type and bedroom count. Seven categories—ranging from two-bedroom houses to three-bedroom units—are displayed as colored streams that flow and stack vertically. The chart uses D3 v6 with `d3.stack` and `stackOffsetSilhouette` to create the silhouette layout, while `d3.scalePoint` and `d3.area` handle the temporal axis and stream paths. Data comes from a CSV file containing quarterly sale prices, with each category assigned a distinct color from a ordinal scale.

Kkenny-wq
83% match
Loading thumbnail…

Data Visualization Homework 6: ThemeRiver

This interactive theme river visualizes the median sale prices of houses, grouped by number of bedrooms, in a geographic region over time. Using D3’s stack and stackOffsetWiggle functions, it displays fluctuating price bands as colored streams. A color legend and a dropdown menu for selection filter the data. The SVG renders with HTML tooltips and axis ticks, with data loaded from a local CSV file.

Dderrick373519@gmail.com
82% match
Loading thumbnail…

ThemeRiver of the House Property Sales

A ThemeRiver visualization displays median property sale prices over time for houses with different bedroom counts (2–5) in Melbourne, Australia. The stacked silhouette chart uses a custom year adjustment function to plot seasonal quarterly data from 2007–2019. Users can reorder the stream layers via a dropdown menu, which updates the selection and re-renders the SVG. The code uses d3.stack with stackOffsetSilhouette and d3.area to draw the streams, with interactive tooltips showing price and season per data point on mouse hover, while reading data from a CSV file.

Hhi4u2qzy@gmail.com
80% match
Loading thumbnail…

Fork of Data Visualization Homework 6: ThemeRiver

This visualization displays house property sales trends using a scatter plot, where each point represents a sales record from a CSV file, colored by property type and positioned by median house price (MA) over time. It uses D3 v5 with SVG rendering, including smooth animated transitions that move circles from the center to their final positions. The plot features axis labels, gridlines, and a categorical color legend built with `scaleOrdinal` and `schemeCategory10`. The visualization reads data from `ma_lga_12345.csv` and updates dynamically through a re-rendering function.

YYouSheng-Do
78% match
Loading thumbnail…

Untitled

This example shows a stacked area chart of house and unit sales over time, with the MA (moving average) values across seven property types. The chart uses a silhouette offset, centering the data around zero. A list on the side enables the user to reorder the stacking sequence, and the chart redraws accordingly. It is built with D3.js, using `d3.stack`, `d3.area`, `d3.scaleTime`, and `d3.scaleOrdinal`. The data comes from a CSV file loaded via `d3.csv`, and hover interactions highlight individual areas with a tooltip.

Nn90098@gmail.com
76% match
Loading thumbnail…

Theme River Graph

A theme river graph displays the median property value over time across Melbourne suburbs, colored either by property type or by number of bedrooms. Interactive buttons switch between grouping methods, and hovering reveals tooltips with details. The visualization uses d3.nest to aggregate data from a CSV, calculates yearly medians, and renders stacked areas with d3.area and d3.curveCardinal, offset by d3.stackOffsetSilhouette. The SVG output is driven by d3.scaleLinear axes, with color assigned via d3.scaleOrdinal and d3.schemeCategory10.

方方顗棠
76% match