Kankerscatter

100%

✓ Published0🌍 Public

Last edited May 29, 2018

Created on May 29, 2018

Kankerscatter plots cancer prevalence (x-axis) against five-year survival rates (y-axis) for 18 cancer types, with each point representing a sex. Connecting lines link male and female rates for the same cancer type. Hovering reveals a tooltip with the exact prevalence and survival values. Two buttons toggle between a full view of all cancers and a zoomed view focusing on rare cancers (low prevalence), using animated transitions of the axes and points. The visualization uses an SVG scatterplot with axes, gridlines, and a clear legend, and is implemented with D3.js.

AI-generated description

A responsive scatterplot, showing prevalence and survival rates of different types of cancer for both sexes. Use the buttons to zoom in on the rare types of cancer.

More explication here, live here (Dutch).

forked from <a href='http://bl.ocks.org/maartenzam/'>maartenzam</a>'s block: <a href='http://bl.ocks.org/maartenzam/af5c4590b47a22a15a06cc81b026a753'>Cancer scatterplot</a>

forked from <a href='http://bl.ocks.org/AndresAnayaIsaza/'>AndresAnayaIsaza</a>'s block: <a href='http://bl.ocks.org/AndresAnayaIsaza/41fbd3d019daa58a518f3eb2cbb36cfb'>Cancer scatterplot</a>

mit Licensed

Similar vizzes

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

93% match

Loading thumbnail…

Kankerscatter

AAndresAnayaIsaza

93% match

Loading thumbnail…

Reusable D3 Scatter Plot

This interactive scatter plot visualizes cancer mortality trends in the USA, cycling through liver, breast, and prostate cancer datasets. Built with D3 v6 as a reusable chart, it animates between cancer types every 3 seconds, updating the y-axis and point symbols (star, square, circle) accordingly. The chart leverages SVG rendering and custom symbol mappings to distinguish cancer types, with axes and margins configured for readability.

Bbhavana.bayyapu@gmail.com

77% match

Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This animated scatter plot cycles through four cancer types in the U.S., plotting yearly death rates using D3’s reusable chart pattern. Each type—liver, breast, prostate, and thyroid cancer—is represented by a different symbol (star, square, circle, square), with the data updating every two seconds. The chart uses SVG rendering and smooth transitions, with axes labeled "Years" and "Number of Death", while a dynamic title indicates the currently displayed cancer type.

Rrobertotienonyaranga@gmail.com

76% match

Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This animated scatter plot cycles through cancer incidence data from the U.S., visualizing death rates for liver, breast, prostate, and thyroid cancers over time. Using D3 v3, it maps years to the x-axis and population to the y-axis, with each cancer type distinguished by a unique symbol (star, square, circle). The chart updates every two seconds, transitioning smoothly between datasets while rotating through the cancer types, with a title indicating the current type. Built as a reusable module, it demonstrates animated transitions, SVG rendering, and dynamic symbol mapping in a clean, informative design.

AArun

76% match

Loading thumbnail…

Fork of Fork of Fork of HTML Starter

This animated scatter plot visualizes cancer mortality rates in the U.S. from 1999 to 2019, cycling through four cancer types—Liver, Breast, Prostate, and Thyroid—using distinct D3 symbols. The chart updates every two seconds, redrawing points with a smooth transition, while the title and axes labels adapt to reflect the selected cancer type. Built with reusable D3 modules, the visualization highlights year-over-year death trends with a clean, animated design.

Vviveknaroju999@gmail.com

75% match

Loading thumbnail…

Reusable D3 Scatter Plot

This animated scatter plot cycles through cancer types—liver, breast, prostate, and thyroid—displaying death rates over time using the Iris Dataset-inspired structure. Built with reusable D3.js components and SVG rendering, the visualization updates every 2 seconds, transitioning between datasets while updating the title and axis labels. Symbols vary by cancer type (circle, square, star) and axes represent years and number of deaths, with smooth transitions on each refresh.

AAsrar Al Qassem

75% match

Loading thumbnail…

Cancer Survival Rates

This visualization uses overlapping semi-transparent areas to compare cancer survival rates for females and males from 1977 to 2013. The chart highlights the trend in survival percentages over time for each sex, with pink representing females and light blue representing males. The code uses D3 v5’s `scaleTime`, `scaleLinear`, `area`, and `csv` to load and parse data, then renders the areas and axes via SVG. A legend and labeled axes clarify the visualization, which sources data from the five-year cancer survival rates by sex and race.

AAsrar Al Qassem

74% match