Skip to main content
SimilarExport ZIP
100%

Crime data

✓ Published0🌍 Public
BBharath kumar
Last edited Apr 8, 2025
Created on Dec 1, 2024

A radial bar chart visualizes the relationship between student grades (A, B, C) and anxiety levels, using concentric rings where each ring represents an anxiety level and arc length encodes the count of students. The chart is built with D3 v7, using the `d3.arc()` API for the radial segments and `d3.scaleOrdinal()` for color encoding by grade. Data is loaded from a CSV file, with grid lines and axis labels indicating anxiety levels. Hovering over a segment reveals a tooltip showing the exact count.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

radialbarchart

This radial bar chart displays the distribution of grades (A, B, C) across different anxiety levels, using concentric rings where each ring represents an anxiety level and each arc segment corresponds to a grade's proportion of the total. The visualization uses D3.js (v7) with SVG and animation, employing `d3.arc()`, `d3.scaleOrdinal()`, and `d3.csv()` to load and process data from a GitHub gist. Interactive tooltips and legend hover effects highlight grade-specific arcs using `transition()`.

Vvyjayanthimamidipalli@gmail.com
88% match
Loading thumbnail…

Final project

This bar chart shows the relationship between students’ self-reported anxiety levels and their average grades, with anxiety ordered from “Very Low” to “Very High.” The visualization reveals how average grades shift across these five categories. Using D3 v7, the code loads a CSV from a GitHub gist, groups the data with `d3.rollup` to compute mean grades per anxiety level, and renders an SVG with `d3.scaleBand` and `d3.scaleLinear` axes. Bars change color on hover, and rotated x-axis labels improve readability.

Ssarikakannikanti@gmail.com
81% match
Loading thumbnail…

GroupedBarchart

This grouped bar chart compares anxiety levels across school grades and genders. The visualization displays clusters of bars for each grade, with individual bars representing male and female students, and color distinguishes anxiety severity categories. The code uses D3.js v7 with `d3.scaleBand` for grouping, `d3.scaleLinear` for the y-axis, and `d3.axisBottom`/`d3.axisLeft` for axes. Hover interactions trigger tooltip updates via `d3.select`. Data is pre-aggregated in the script, rendered as SVG using `d3.select` and `append` methods.

Vvyjayanthimamidipalli@gmail.com
79% match
Loading thumbnail…

Average Grade by Mental Health Status

This visualization shows the distribution of student anxiety levels as a pie chart, with each slice representing the proportion of students at a specific anxiety level. It uses d3.pie() and d3.arc() to render the pie, d3.scaleOrdinal() to assign colors, and d3.rollup() to count students in each anxiety category. Hovering displays a tooltip with the count and percentage, while clicking a slice populates a list of students in that anxiety level, showing their age, gender, sleep patterns, and stress levels. The data comes from a CSV file loaded via d3.csv().

Ddeekshakondam@gmail.com
78% match
Loading thumbnail…

groupedbarchart

This interactive grouped bar chart displays the number of students per grades (A, B, C) across different depression levels, using data from a CSV file on student grades and mental health. The visualization uses D3.js v7 and the `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisBottom` APIs for layout. Bars animate in on load via the `transition` method, and hovering reveals a tooltip with exact counts. A clickable legend toggles grade visibility by adjusting bar opacity.

Vvyjayanthimamidipalli@gmail.com
75% match
Loading thumbnail…

final project

This bar chart displays the average student grades (on a 3-point scale where A=3, B=2, C=1) grouped by self-reported stress level, sorted from highest to lowest average grade. The visualization uses D3 v7’s `d3.csv` to load remote CSV data about student grades and mental health, then applies `d3.group` and `d3.mean` to aggregate values. Rendered as SVG rectangles with a `d3.scaleBand` x-axis and `d3.scaleLinear` y-axis, bars change color on hover via CSS.

Ssarikakannikanti@gmail.com
75% match
Loading thumbnail…

Projec2

This example shows how student depression levels relate to their grades using a bar chart and a pie chart. The bar chart visualizes each student's depression level with color-coded bars, while the pie chart displays the distribution of depression levels across the dataset. Both charts use D3 v7's `d3.csv` to load data, `scaleBand` and `scaleLinear` for axes, and `d3.pie` and `d3.arc` for the pie slices. Interactive tooltips appear on hover, and the bar chart uses an event-driven `transition` for the tooltip's opacity changes.

Vvyjayanthimamidipalli@gmail.com
75% match
Loading thumbnail…

Anxiety and study hours by School Type

This visualization compares average anxiety levels and study hours across different school types using a grouped bar chart. It shows that each school type has paired pink and blue bars, representing the two metrics, allowing direct visual comparison between categories. The chart is built with D3 v7, using d3.csv to load the dataset, d3.rollups for aggregation, and d3.scaleBand for positioning. Hovering over a bar displays a tooltip with the exact values, while the SVG rendering includes a legend and rotated axis labels.

Ddeekshakondam@gmail.com
74% match