Skip to main content
SimilarExport ZIP
100%

group 9 bar and scatter plot

✓ Published1🌍 Public
Llakshmisurekhamaddukuri@my.unt.edu
Last edited Apr 24, 2025
Created on Apr 7, 2025
Forked from D3 Starter

This interactive dashboard displays health metrics through four charts: a scatter plot of sleep duration versus sweet food intake colored by age group, a bar chart of average heart rate by consumer type, a pie chart showing cholesterol levels by alcohol intake, and box plots of heart rate grouped by sleep disorder and meat intake. Built with D3 v7, the charts use d3.scaleLinear, d3.scaleBand, d3.pie, and d3.quantile, with dropdown filters and tooltips. Data loads from a TSV file via d3-fetch, and all visualizations render as SVG with animations.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork 1

This interactive health dashboard explores relationships between lifestyle factors and health metrics using multiple D3.js v7 visualizations. A scatter plot shows sleep duration versus sweet food intake with jittered points colored by gender, while a bar chart displays average heart rate by consumer type. A pie chart breaks down cholesterol levels across alcohol consumption categories, and an animated box plot filters heart rate distributions by gender with hover tooltips. The dashboard uses `d3.rollups`, `d3.groups`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.pie` with transitions for smooth updates, loading TSV data from a GitHub gist.

Bboinapallyhimaja657@gmail.com
85% match
Loading thumbnail…

scatterplot

This scatterplot explores the relationship between sweet food intake and sleep duration, with each point colored by gender. The visualization uses D3.js v7 to load TSV data, apply jitter to reduce overplotting, and render SVG circles with interactive tooltips showing sleep, diet, age, and gender details. A linear scale maps intake frequency on the x-axis against sleep hours on the y-axis, with custom tick labels and axis titles. The code also demonstrates margin conventions, axis generation with `d3.axisBottom` and `d3.axisLeft`, and event handlers for mouse interactions.

Llakshmisurekhamaddukuri@my.unt.edu
79% match
Loading thumbnail…

Project

This visualization presents a health data dashboard with three SVG charts. It includes a pie chart showing gender distribution, a bar chart displaying age distribution using d3.bin, and a scatter plot correlating glucose levels with BMI using d3.scaleLinear. The code uses d3.csv to load data and d3.rollup for aggregation, rendering all charts with D3 v7's SVG API.

Ppavanbellam@my.unt.edu
78% match
Loading thumbnail…

Project

This interactive D3.js dashboard explores diabetes medication, gender, and age-group trends related to heart disease outcomes. It shows three SVG charts built from a merged CSV dataset, including a bar chart of heart disease cases by medication status, a pie chart of patient gender distribution, and a bar chart of cases across age groups. The code uses `d3.csv` to load data, `d3.select` to render SVG elements, and a custom tooltip for hover interactions. An embedded Power BI iframe complements the narrative with additional health analytics.

Ppavanbellam@my.unt.edu
77% match
Loading thumbnail…

Sleep Health- Interactive Visualization Dashboard

This interactive dashboard visualizes sleep disorder prevalence across low, medium, and high stress levels, using 100% stacked bars with animated transitions. Users filter by gender and toggle between all categories or disorders only, with hover tooltips and clickable legend items that isolate healthy versus disordered sleep groups. Built with React and D3 v7 (d3.scaleBand, d3.stack), the SVG chart renders from a CSV dataset and updates bins and counts dynamically. The animation and ordinal color scale highlight how higher stress correlates with increased Insomnia and Sleep Apnea rates.

Ccsabavath@wpi.edu
76% match
Loading thumbnail…

HeartDisease

This example visualizes the relationship between SleepTime and BMI using a scatter plot, where each point represents an individual, colored red or green based on HeartDisease status. The x-axis maps BMI and the y-axis maps SleepTime, with point sizes varying according to PhysicalHealth and MentalHealth values. It loads CSV data via d3.csv, scales the axes with d3.scaleLinear, renders circles in SVG, and uses d3.axisBottom and d3.axisLeft for the axes. The chart’s margins and dimensions adapt to the browser window.

Cchandanagandla
75% match
Loading thumbnail…

Activity 9.2

This pie chart visualizes glucose levels for patients with diabetes, where each slice represents a patient and the slice’s size corresponds to their Glucose value. The chart includes a legend that pairs each patient’s BMI with their glucose level, and the slices are sorted by glucose in descending order. The visualization uses D3 v5 APIs including `pie`, `arc`, `scaleOrdinal`, and `schemeCategory10` to generate the SVG paths and color encoding. Data is loaded from a CSV file hosted on GitHub, and the chart is rendered within an SVG element on an HTML page.

Ss.harshinisai01@gmail.com
75% match
Loading thumbnail…

test

This dashboard presents a multi-view analysis of Fitbit activity and sleep data, with a scatterplot, flow lane, parallel coordinate chart, correlation matrix, and heatmap for exploring multivariate relationships. Users can brush on plots to filter records, select clusters, and upload their own CSV files via a file picker. Built entirely with D3 v7, it leverages the brush API, linear scales, axis generation, data joins, event handling, and categorical color schemes to render interactive SVG visualizations.

DDaniel Z
75% match