Skip to main content
SimilarExport ZIP
100%

Fork of Fly

✓ Published0🌍 Public
AAsrar Al Qassem
Last edited Mar 15, 2024
Created on Mar 15, 2024
Forked from Fly

This bar chart visualizes cancer deaths in the USA for 2019, comparing three cancer types: liver, kidney, and lip/oral cavity. The code loads CSV data from a GitHub gist using `d3.csv`, filters for USA and year 2019, and maps the selected values to a dataset. It uses `d3.scaleBand` and `d3.scaleLinear` to position bars, with `d3.axisBottom` and `d3.axisLeft` for axes. The SVG rendering includes rotated x-axis labels and a title, with bars filled with steelblue.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Pink Face

This example shows a bar chart of randomly selected cancer types and their death counts for the USA, titled “Cancer Deaths in the USA (Random Selection).” It loads a CSV dataset via `d3.csv`, filters it to USA records, and picks three random column names to build the dataset. The visualization uses `d3.scaleBand` for the x-axis, `d3.scaleLinear` for the y-axis, and renders SVG rectangles as bars, with `d3.axisBottom` and `d3.axisLeft` for the axes.

AAsrar Al Qassem
81% 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
79% match
Loading thumbnail…

Fork of HTML Starter

This visualization uses a scatterplot to show cancer mortality trends in the USA from 1990 to 2019, with each circle representing a specific cancer type’s annual death count. It displays data from a CSV file loaded via D3’s `csv` function, with time-scaled x-axis and linear y-axis. React manages the component state and lifecycle, while D3’s `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom` render the axes. Hovering over a circle triggers a tooltip with details, and a color-coded legend identifies each cancer type.

NNandini Maddula
79% match
Loading thumbnail…

Fork of Fork of Line Chart

This line chart visualizes US cancer case counts from 2010 to 2022, with time on the x-axis and case numbers on the y-axis, rendered as an SVG path with grid lines and axis labels. The code loads CSV data from a GitHub gist, parses the year and cases fields, and uses d3.scaleTime, d3.scaleLinear, d3.extent, d3.max, d3.axisBottom, d3.axisLeft, and d3.line to generate the chart. The visualization includes a title and styled axis tick marks, with axis labels colored blue and the line stroke in blue.

Ssaivinay143
78% match
Loading thumbnail…

Fork of Fork of Line Chart

This line chart visualizes US cancer cases from 2009 to 2022, plotting yearly case counts as a red path. The code uses d3.csv to load data from a GitHub gist, then applies d3.scaleTime and d3.scaleLinear for the axes, with d3.axisBottom and d3.axisLeft generating gridlines. A d3.line generator maps years to x-coordinates and case numbers to y-coordinates within an SVG, with margins and axis labels styled via external CSS.

JJyothicherukuri
78% match
Loading thumbnail…

Fork of Cancer Survival Rates

This visualization shows a network of cancer types in the United States, with the country as a central red node connected to various blue cancer-type nodes. The code uses D3.js v6 with `d3.forceSimulation`, `d3.forceLink`, `d3.forceManyBody`, and `d3.forceCenter` to position nodes, along with `d3.drag` for interactivity. Data is loaded from a CSV file using `d3.csv` and rendered as SVG elements, with labels displaying each cancer type.

AAsrar Al Qassem
78% match
Loading thumbnail…

Fork of Fork of HTML Starter

This animated scatter plot cycles through four cancer types—Liver, Breast, Prostate, and Thyroid—using D3.js to visualize death rates in the US from 1990 to 2019. Each cancer type is encoded with a distinct symbol (star, square, circle) and the chart updates every two seconds with a smooth transition, while a dynamic title indicates the currently displayed cancer type. The reusable chart component supports axes labels, margins, and configurable data accessors.

Rrobertotienonyaranga@gmail.com
77% match
Loading thumbnail…

Fork of Line Chart

This example displays a line chart of U.S. cancer cases from 2009 to 2022, with the year on the x-axis and case counts on the y-axis. It loads CSV data from a GitHub gist using `d3.csv`, parses the values, and renders the chart as an SVG with `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and a `d3.line` path generator. The chart includes grid lines, axis labels, and a title, all styled via CSS.

NNikhilMakkena
76% match