Skip to main content
SimilarExport ZIP
100%

Untitled

✓ Published0🌍 Public
Jjenniferslagt
Last edited Jan 24, 2020
Created on Jan 22, 2020
Forked from Untitled

This grouped bar chart compares survey responses about police politeness across six education levels, from “no education” to university. Each education level is broken into five agreement categories, ranging from “completely disagree” to “completely agree.” The chart uses d3.scaleBand for the grouped bars and d3.scaleOrdinal for color encoding, rendering in SVG within a React framework. Data comes from a CSV file, with percentages displayed on the y-axis.

AI-generated description

A bare minimum HTML page.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

A grouped bar chart compares survey responses about police politeness across six education levels in the Netherlands. Each group represents a response option, from "Helemaal mee oneens" to "Helemaal mee-eens," with bars colored by education level. The chart uses D3.js v5 with React, rendering as animated SVG. It employs `d3.scaleBand` for group and bar positioning, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` for categorical colors, with data loaded from a CSV file. Clicking legend items filters the displayed bars.

Jjenniferslagt
91% match
Loading thumbnail…

Untitled

A grouped bar chart shows the correlation between education level and the perceived politeness of police contact, based on survey data from respondents. The chart displays the share of respondents (as a percentage) per education level for each of five Likert-scale responses, from “Helemaal mee oneens” to “Helemaal mee eens.” The code uses D3 v5 with SVG rendering, reading a CSV file, and applies scales such as `d3.scaleBand` and `d3.scaleLinear` for layout. A legend allows clicking on a category to filter the bars via a custom update function.

Mmab3105
89% match
Loading thumbnail…

Untitled

This interactive grouped bar chart visualizes the correlation between respondents' education level and their experiences with police contact, using data from a survey with responses ranging from "Helemaal mee oneens" to "Helemaal mee-eens". The chart displays education levels on the x-axis and the percentage of respondents on the y-axis for each response category, with a legend that allows users to click on education levels to filter which bars are displayed. Built with React and D3 v5, the visualization uses `d3.scaleBand` for the grouped and inner bar positioning, `d3.scaleLinear` for the y-axis, and `d3.scaleOrdinal` to assign colors to each education category, rendered as SVG with a black background.

Jjenniferslagt
87% match
Loading thumbnail…

Untitled

This visualization shows survey responses across six professional categories, with bars colored by five response levels ranging from "Not at all" to "Tremendously." Each category displays a cluster of bars for the different response rates. The chart uses d3.scale.ordinal for the x-axis, d3.scale.linear for the y-axis, and d3.svg.axis for the axes. Rectangles are animated into place using transition with random delays, and hover effects darken bar colors. A legend appears sequentially, and the y-axis fades in after the bars animate. The data comes from data.json.

EEagleV22
79% match
Loading thumbnail…

Untitled

A nested bar chart displays the distribution of three values across two groups and three categories. The visualization uses D3 v3’s ordinal scales (`d3.scale.ordinal`) and linear scale (`d3.scale.linear`) to position bars, with SVG rendering. Data is loaded from CSV (`data.csv`) and structured via `d3.nest` into hierarchical group and category levels. Axes are drawn with `d3.svg.axis`, and nested `<g>` elements group bars by group and category.

Mmab3105
76% match
Loading thumbnail…

Untitled

This bar chart displays the number of students for various grades and locations, with bars colored blue and axes labeled "Grades" and "Num_students." The visualization uses D3.js v6 to create an SVG rendering, employing `d3.scaleBand` for the categorical x-axis and `d3.scaleLinear` for the numeric y-axis. Data is hardcoded in an array of objects, while axes are generated with `d3.axisLeft` and `d3.axisBottom`. The chart includes a pink background rectangle and console logs for debugging scale behavior.

Hhanulik.ondrej@gmail.com
76% match
Loading thumbnail…

Untitled

A bar chart displays the percentage of survey respondents ranking emerging technologies as most important, with values from 38% for Big Data Analytics down to 1% for 3D Printing. Built with D3 v5 in a React application, the SVG uses `scaleBand` and `scaleLinear` to position bars, a `scaleOrdinal` color range for hue variety, and text labels above each bar showing the percentage. Data loads from a CSV file, and bar heights derive from the `max` domain.

Hhireign
76% match
Loading thumbnail…

Untitled

A stacked bar chart visualizes the percentage of technology adoption across categories, with each bar color-coded through an ordinal scale and labeled with its exact value. The chart uses d3.csv to load data, then d3.scaleBand and d3.scaleLinear to position and size the rectangles, while d3.scaleOrdinal assigns colors. Labels are added via SVG text elements, all rendered within a fixed-width SVG container.

Hhireign
75% match