Skip to main content
SimilarExport ZIP
100%

Content Classification

✓ Published1🌍 Public
GGracedata
Last edited Dec 16, 2020
Created on Dec 5, 2020
Forked from Hello VizHub

This interactive stacked bar chart displays the breakdown of seven content classification categories per session, sourced from a CSV file. A dropdown menu selects the session, and a checkbox toggles sorting by total value. Built with React and D3.js v6, the visualization uses `d3.csv` for data loading, `d3.stack` for layering, `scaleBand` for categories, and SVG transitions for animated updates.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Content Classification Frequency

This visualization displays stacked bar charts showing the frequency of content classifications across different sessions, with severity levels color-coded from dark to light green. A dropdown menu allows selection of a specific session, while a checkbox reorders the bars by the most severe category. The interactive SVG chart uses D3 v6 APIs including `d3.stack` for stacking, `d3.scaleBand` for the x-axis, and `d3.legendColor` for the legend. Data comes from a CSV file hosted on GitHub, and updates are animated with D3 transitions.

GGracedata
88% match
Loading thumbnail…

Content Classification Frequency

This visualization displays stacked bar charts showing the frequency of content classifications across different sessions, with severity levels color-coded from dark to light green. A dropdown menu allows selection of a specific session, while a checkbox reorders the bars by the most severe category. The interactive SVG chart uses D3 v6 APIs including `d3.stack` for stacking, `d3.scaleBand` for the x-axis, and `d3.legendColor` for the legend. Data comes from a CSV file hosted on GitHub, and updates are animated with D3 transitions.

GGracedata
88% match
Loading thumbnail…

Content Classification

This stacked bar chart visualizes how stress perception decomposes across seven content classification categories, with each bar segmented by severity levels from a CSV dataset. A dropdown menu switches between experimental sessions, while a checkbox toggles sorting by total magnitude versus classification order. The visualization uses D3 v6 scales (d3.scaleBand, d3.scaleLinear, d3.scaleOrdinal), d3.stack for layering, and d3.legendColor to display a severity legend, with animated transitions on axes and rectangles.

Yyuxinzhou0312
85% match
Loading thumbnail…

Stacked Bar Graph

This stacked bar graph visualizes three numeric values per category from a CSV file, with each bar segment colored by series and a legend identifying the categories. Built with D3 v7 and React, it uses `d3.csv` to load data, `d3.stack` to compute stacked segments, and `d3.scaleBand` and `d3.scaleLinear` for positioning. SVG rendering includes axes, a title, and a legend, with colors from `d3.schemeCategory10`.

Hharsha
78% match
Loading thumbnail…

Content Classification Frequency

This visualization shows how subjective stress levels are distributed across seven life categories for each session, using stacked horizontal bars colored by stress intensity. Users select a session from a dropdown and can optionally sort categories by severity. The chart is built with D3 v6, using `d3.stack`, `d3.scaleBand`, and `d3.scaleLinear`, with data loaded via `d3.csv` from a GitHub-hosted CSV file. Animated transitions update the bars smoothly, and a `d3.legendColor` legend maps stress levels to a green color scale.

Yyuxinzhou0312
78% match
Loading thumbnail…

Activity6Task-2

This stacked bar chart visualizes the changing composition of categories A through D across the years 1995-2003. A radio button toggle transitions the rendering between a full stacked bar layout and a narrow, offset view that reveals individual category values. Built with D3 v4, the visualization uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.stack` to process the CSV data, while SVG `rect` elements are animated via `transition` and `attr` calls. The color scale `d3.scaleOrdinal` distinguishes the four categories.

HHanuReddy
75% match
Loading thumbnail…

Stacked Bar Graph

This example shows a stacked bar graph where each bar represents a total value composed of three categorical segments, using data from an external CSV file. The visualization renders as an SVG chart with a light gray background, axes, a title, and a color-coded legend. It loads the dataset with `d3.csv`, transforms the columns into numeric values, and uses `d3.stack` to arrange the segments. The chart draws rectangles via SVG and scales the axes using `d3.scaleBand` and `d3.scaleLinear`, with colors assigned by `d3.scaleOrdinal` and `d3.schemeCategory10`.

NNukaShravanKumar
75% match
Loading thumbnail…

Untitled

This interactive stacked area chart displays the changing values of multiple categories over time, using the D3.js library (version 2) with SVG rendering and animations. The chart employs a silhouette offset layout to visualize data from a CSV file, with color-coded layers representing different groups. Hovering over a layer highlights it and shows a tooltip with the category name and its specific value, while mouse movement on the chart also triggers a vertical guideline.

LLAOKE1997
75% match