Iterated Work: Heart Disease Scatter Plot

100%

Iterated Work: Heart Disease Scatter Plot

✓ Published0🌍 Public

Last edited Sep 30, 2021

Created on Sep 29, 2021

This scatter plot shows the relationship between patient age and maximum heart rate from the Heart Disease UCI dataset, with points colored by gender (crimson for female, dark blue for male). The visualization uses D3 v5 with SVG rendering, employing `d3.axisBottom` and `d3.axisLeft` for gridlined axes, `d3.scaleOrdinal` for the categorical color mapping, and the `d3-legend` library for the color legend. The data is loaded via `d3.csv` from a GitHub gist, with the sex attribute transformed from numeric codes to strings for labeling.

AI-generated description

This is a scatter plot about how the age of the patient affect the maximum heart rate in the dataset. The original dataset comes from Kaggle Dataset: Heart Disease UCI

This visualization shows The Github Gist: Heart Disease UCI

The XAxis represents the age of a certain patient The YAxis represents the maximum heart rate achieved.

In the Legend, red and blue color represent the gender of patient

This is the iterated work forked from Heart Disease Scatter Plot.

I made several changes learned from Vizhub: "Stylized Scatter Plot with Color Legend"

1. I added gridlines on X and Y axis to make the plot more readable.
1. The 'Sex' attribute in dataset is transfered into string ['Female','Male'].
1. Color Legend is added to the plot for illustration.

MIT Licensed

Similar vizzes

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

93% match

Loading thumbnail…

Reusable Scatter Plot of Heart Disease Dataset

This interactive scatter plot visualizes the Heart Disease UCI dataset from Kaggle, mapping patient age on the x-axis and maximum heart rate achieved on the y-axis, with points colored by sex (red for female, blue for male). Built with D3.js, the visualization uses a reusable scatter plot module that supports dynamic axis updates, animating through different x-axis attributes (age, thalach, restecg) every two seconds using `setInterval` and `transition().duration(1000)`. The SVG renders axes via `axisLeft` and `axisBottom`, with data loaded asynchronously via `csv`.

RRyanYun0017

90% match

Loading thumbnail…

Heart Disease Scatter Plot

This scatter plot shows the relationship between patient age and maximum heart rate achieved using data from the Heart Disease UCI Kaggle dataset. Each blue circle represents an individual patient, with age plotted along the x-axis and maximum heart rate along the y-axis. The visualization loads CSV data via `d3.csv`, parses numeric fields, and renders circles as SVG elements with `d3.scaleLinear` for both axes. Axis labels are added manually using SVG text elements, while axes themselves are generated through `d3.axisLeft` and `d3.axisBottom`.

AAishwarya Manjunath

90% match

Loading thumbnail…

Fork of Scatter Plot with Menus - Heart Disease Dataset

This scatter plot visualizes heart disease patient data from the UCI dataset, mapping age against maximum heart rate achieved. Users can dynamically change both axes via dropdown menus, selecting from quantitative variables like resting blood pressure or categorical options like patient sex. Built with D3 v6, the visualization uses `scaleLinear` and `scalePoint` for axis scaling, with smooth transitions animating circle positions and radii. The plot renders as SVG, with circles colored by patient sex (red for female, blue for male) and axis updates triggered through custom menu components dispatching change events.

RRyanYun0017

88% match

Loading thumbnail…

Draft Heart attack dataset

This scatterplot uses a heart disease dataset from Kaggle to explore the relationship between maximum heart rate achieved and resting electrocardiographic results, with age on the vertical axis. Each circle represents a patient, colored by gender. The visualization is built with React and D3 v5, using `scaleLinear`, `scaleOrdinal`, `extent`, and `format` from D3, with SVG rendering via custom `AxisBottom`, `AxisLeft`, and `Marks` components. Axes are drawn with D3’s tick generation, and hovering shows tooltips via SVG `<title>` elements.

AAbdul Salam Almadani

83% match

Loading thumbnail…

Fork of Scatter Plot

This scatter plot visualizes heart disease data from the UCI Machine Learning Repository, allowing users to explore correlations between numeric attributes like age, cholesterol, and blood pressure. Dropdown menus let viewers select which columns map to the X and Y axes. The visualization is built using D3 v5, with `scaleLinear` for scaling axes, `axisLeft` and `axisBottom` for gridlines, and animated circle transitions via `transition().duration(2000)` with staggered delays. SVG rendering displays semi-transparent red circles, while axis labels and tick marks are styled through CSS.

AAshtone Onyango

83% match

Loading thumbnail…

03_02 Draft for Heart Attack possibility

This scatter plot explores factors linked to heart attack risk, plotting age against maximum heart rate achieved. Each point’s color indicates the patient’s gender, with opacity revealing overlapping points. The visualization uses the Vega-Lite API with D3.js to render interactive marks, pulling data from a UCI Heart Disease dataset. Tooltips display precise values for age and heart rate, aiding in pattern identification across demographic groups.

AAbdul Salam Almadani

83% match

Loading thumbnail…

Fork of Scatter Plot with Shape

This visualization is a scatter plot showing the relationship between patient age and heart rate, with data points shaped by gender. It uses D3 v7 to render symbols from the `symbolsFill` set, mapped via `scaleOrdinal`, and includes a custom legend for the shape encoding. The plot leverages `scaleLinear` for both axes and fetches healthcare data from a remote CSV. Key APIs include `d3.csvParse`, `d3.extent`, `d3.axisLeft`, `d3.axisBottom`, and the `d3.symbol` generator for drawing point shapes.

Aaniteshterala2000

81% match