Fork of Scatter Plot with Shape

100%

Fork of Scatter Plot with Shape

✓ Published0🌍 Public

Aaniteshterala2000

Last edited Jul 22, 2023

Created on Jul 22, 2023

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.

AI-generated description

MIT Licensed

Similar vizzes

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…

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

82% match

Loading thumbnail…

Reusable Scatter plot aSSIGNMENT

This interactive scatter plot visualizes healthcare data, plotting patient age against cholesterol levels with gender-based color coding (blue for male, pink for female). The visualization includes labeled axes, a title, and a legend, with a periodic redraw every five seconds. Built with D3.js, it uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs within a reusable `scatterPlot` function, rendering SVG elements. Data is loaded asynchronously via `csv` from a GitHub-hosted healthcare dataset, demonstrating a modular approach to creating configurable chart components.

Vvineelaramulapalli32

82% 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

82% match

Loading thumbnail…

Iterated Work: Heart Disease Scatter Plot

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.

RRyanYun0017

81% match

Loading thumbnail…

Scatter Plot with Shape

This scatter plot visualizes health expenditure data from a CSV file, showing expenditure by year and colored by gender. The visualization uses a D3.js v7 scatter plot with a shape legend to distinguish between male and female data points. The code leverages `d3.scaleLinear` for axes, `d3.scaleOrdinal` and `d3.symbolsFill` for shapes, and `d3.symbol` to generate the point markers. A custom `axes` module handles axis rendering with labels, while the `shapeLegend` module displays the gender categories. The plot loads data asynchronously via the `fetch` API and `d3.csvParse`.

KKhatera Alizada

81% match

Loading thumbnail…

Fork of Cars Scatter Plot

This scatter plot visualizes cardiovascular health data from a heart disease CSV, plotting each patient’s weight against their age as horizontal bars. The visualization uses D3 v5 with `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the y-axis, rendering SVG rectangles. Data is loaded via `d3.csv` from the `heart_disease_data.csv` file, with each bar’s width proportional to weight and height set by band width. The example is a fork of an original cars scatter plot, adapted to this medical dataset.

AAshtone Onyango

80% 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

80% match