Skip to main content
SimilarExport ZIP
100%

Scatterplot of Breast Cancer

✓ Published0🌍 Public
RRidhima Saxena
Last edited Oct 23, 2021
Created on Oct 14, 2021

This scatterplot shows the relationship between clump thickness and cell size in the Breast Cancer dataset, with each point representing a sample. The code loads the CSV data from a GitHub gist using `d3.csv`, parses the numeric fields, and maps them to x and y positions via `d3.scaleLinear` with an auto-computed extent. Circles are rendered as SVG elements, and axes are added using `d3.axisLeft` and `d3.axisBottom`. The visualization fills the browser window, with margins and a fixed point radius, demonstrating a basic D3 v6 data-joining workflow.

AI-generated description

This visualization is a D3 scatterplot of cell thickness vs. cell size from the Breast Cancer dataset.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-6 Scatter Plot

This scatter plot visualizes the Breast Cancer Wisconsin dataset, showing the relationship between the radius and texture mean of cancer cells. Each point is colored blue or yellow to indicate a malignant or benign diagnosis, with axis labels for both dimensions. The visualization is built using D3 v6 within a React framework, loading CSV data via `d3.csv` and rendering SVG circles with `d3.scaleLinear`, `d3.extent`, and `d3.axisLeft`/`d3.axisBottom`. It uses JavaScript’s `innerWidth` and `innerHeight` to size the chart responsively.

KKetha
78% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This interactive scatter plot visualizes the Breast Cancer dataset, with points transitioning every two seconds between four numeric attributes: area, texture, perimeter, and radius standard error. Built with D3 v6, it uses `scaleLinear`, `axisBottom`, and `axisLeft` to render axes, while SVG circles are joined to data and updated via a `setInterval` callback that swaps the x-value accessor. The reusable chart pattern, defined in `scatterPlot.js`, accepts configurable width, height, margins, and radius, with animations handled through D3’s data join.

Aamiralitah
78% match
Loading thumbnail…

Breast Cancer Data Bar Chart

This bar chart visualizes breast cancer data, comparing two numeric attributes—perimeter_mean on the x-axis and radius_mean on the y-axis—across individual records. The chart uses D3 v7 to fetch a CSV dataset from a GitHub repository, then renders horizontal bars via SVG rectangles. Scales are created with d3.scaleBand for the categorical x-axis and d3.scaleLinear for the y-axis, while d3.axisBottom and d3.axisLeft generate the corresponding tick marks and labels. The code includes React components for reusable axes and marks, though the primary implementation in index.html directly manipulates the SVG.

HHemanthh81
76% match
Loading thumbnail…

Fork of Fork of Fork of 3D Scatter Plot with Breast Cancer

This visualization displays two scatter plots of breast cancer dataset features, including radius, texture, perimeter, and area measurements. The visualization combines a 2D scatter plot and a 3D scatter plot, both rendered using the Plotly.js library with data loaded via D3.js’s CSV parsing. The plots use marker styling with custom colors, symbol shapes, and opacity settings to distinguish between the two display modes. The 3D scatter plot explores relationships between radius, texture, and area features, while the 2D plot compares radius and texture with perimeter measurements.

Aamiralitah
76% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot- ICE7

This animated scatter plot, built with D3.js, visualizes breast cancer tumor data from a CSV file, cycling through different feature pairs on the x-axis. It shows the relationship between various cell measurements, with data points colored by cancer stage (orange for stage one, blue for stage two, black for stage three). The visualization uses an SVG with a custom `scatterPlot` function and a `setInterval` animation to swap the x-axis variable, while a legend and axis labels clarify the mapping.

Aamiralitah
75% match
Loading thumbnail…

DOM panzoom demo INTERACTIVE!

This interactive demo shows a scatterplot of breast cancer tissue measurements, with Clump Thickness on the x-axis and Uniformity of Cell Size on the y-axis. The visualization uses Vega-Lite’s interval selection bound to scales to enable brushing, while the panzoom library adds wheel-zoom and mouse-drag panning, restricted to Alt-key activation. Data is loaded via d3.csv from a remote GitHub dataset. The chart fills the viewport and uses custom config for larger axis labels and tooltips.

OOleJRask
73% match
Loading thumbnail…

Kankerscatter

A responsive scatterplot visualizes cancer prevalence (x-axis) and survival rates (y-axis) for 19 cancer types, with each type represented as two connected points (male and female). Users toggle between a full view of all cancers and a zoomed-in view focusing on rarer types. The visualization uses a D3.js SVG pipeline, with `d3.scale.linear` axes, `d3.svg.axis` for ticks, and `d3.tip` for interactive tooltips. Data comes from a local CSV (`cancerdata.csv`) and animations are handled through D3’s enter/exit transitions. The layout is generated from an SVG block with buttons controlling the zoom state.

AAndresAnayaIsaza
73% match
Loading thumbnail…

Kankerscatter

A responsive scatterplot visualizes cancer prevalence (x-axis) and survival rates (y-axis) for 19 cancer types, with each type represented as two connected points (male and female). Users toggle between a full view of all cancers and a zoomed-in view focusing on rarer types. The visualization uses a D3.js SVG pipeline, with `d3.scale.linear` axes, `d3.svg.axis` for ticks, and `d3.tip` for interactive tooltips. Data comes from a local CSV (`cancerdata.csv`) and animations are handled through D3’s enter/exit transitions. The layout is generated from an SVG block with buttons controlling the zoom state.

AAndresAnayaIsaza
73% match