HeartDisease

100%

✓ Published0🌍 Public

Last edited Apr 9, 2023

Created on Mar 23, 2023

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.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Project

This scatter plot visualizes the relationship between BMI and heart disease status, using data loaded from a CSV file hosted on GitHub. The x-axis maps BMI values, while the y-axis encodes heart disease presence as a binary 0 or 1, with semi-transparent blue circles showing individual data points. Built with React and D3 v6, the code uses `d3.csv`, `scaleLinear`, `axisLeft`, and `axisBottom` to render the SVG chart across the full browser window, with custom margins and axis labels.

Sshreyasribearelly@gmail.com

83% match

Loading thumbnail…

Physical Health vs BMI Scatter Plot

This scatter plot visualizes the relationship between physical health and body mass index (BMI) using a dataset from Heart2020Cleaned.csv. Each blue circle with a black stroke represents an individual data point, with BMI mapped to the x-axis and PhysicalHealth to the y-axis. The visualization uses d3.v7’s `scaleLinear`, `axisBottom`, and `axisLeft` to render the axes, while circles are appended to an SVG via `selectAll` and `enter`. The code, written in plain JavaScript, also makes use of D3’s `csv` function for asynchronous data loading.

Cchandanagandla

81% match

Loading thumbnail…

Fork of Heart Disease Scatter Plot

This fork of a Heart Disease scatter plot shows the relationship between a patient’s BMI and the presence of heart disease, with the X-axis representing BMI and the Y-axis indicating heart disease status. The visualization uses D3 v6 to load CSV data from a GitHub gist, parse values with `d3.csv`, and map them to SVG circles via `d3.scaleLinear`. Axes are drawn with `axisLeft` and `axisBottom`, and the plot is rendered as an SVG canvas. The data originates from the Heart Disease UCI Kaggle dataset.

Ssahajm99@gmail.com

81% match

Loading thumbnail…

Visualizing correlations between heart disease patients' data

This interactive scatterplot displays correlations between heart disease patient attributes—such as age, cholesterol, and BMI—with heart disease status, using a red dot for each individual. Users select any attribute pair from the two dropdown menus to swap the axes, and the points animate smoothly into their new positions. The visualization is built with D3 v7, using the `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs for scaling and axes, while `transition.attrTween` or `transition().duration().delay()` handles the animation. The data comes from a CSV file loaded via `d3.csv`.

AAshtone Onyango

78% match

Loading thumbnail…

Heart Disease Scatter Plot

A scatter plot maps patient age against maximum heart rate achieved, with each circle colored by sex (red for female, blue for male). The visualization uses D3 v6 to load CSV data from a GitHub Gist based on the Heart Disease UCI Kaggle dataset. SVG circles are positioned with d3.scaleLinear scales and axes are rendered via d3.axisLeft and d3.axisBottom. The plot reveals heart rate patterns across age groups and sex differences in the dataset.

RRyanYun0017

78% match

Loading thumbnail…

Visualizing correlations between heart disease patients' data

This interactive scatter plot lets users explore correlations among heart disease patients by selecting any two metrics from dropdown menus, which map to the x- and y-axes. Each point represents a patient, colored by heart disease status, from a CSV dataset. Built with D3 v7, it uses scaleLinear, axisBottom, axisLeft, and transition().delay().duration() for animated point placement. The chart renders in SVG with adjustable margins and axis labels.

AAshtone Onyango

77% match

Loading thumbnail…

Area Chart - DV - Project

This is an area chart built with React and D3 v5, visualizing the relationship between BMI and Blood Pressure from a CSV dataset of diabetic patients. The chart uses D3's `scaleTime` and `scaleLinear` for axes, and `line` and `area` generators with a basis curve to draw a smooth line and a green filled region beneath it. Axis labels and tick lines are styled via CSS, and the SVG is updated dynamically after parsing the data with `csv`. The chart shows how blood pressure varies with BMI, highlighting a trend across the data points.

HHema1430

77% match

Loading thumbnail…

Fork of blood pressure

This visualization shows the relationship between age and sleep duration for a group of individuals, with each person represented as a point on a scatterplot and connected by a smooth line. The chart uses D3.js v5 to load CSV data from a GitHub gist, parse the numeric fields, and render the SVG visualization. It employs `d3.scaleLinear` for both axes, `d3.axisBottom` and `d3.axisLeft` for tick marks, and `d3.line` with `curveBasis` to create the curved trend line. The line is styled in maroon with a thick stroke, while gridlines and axis labels are formatted with custom CSS. The data source is a public dataset on sleep health and lifestyle.

Bbhavana.bayyapu@gmail.com

76% match