Fork of Sea Turtle Survival (mock data)

100%

Fork of Sea Turtle Survival (mock data)

✓ Published0🌍 Public

Last edited Apr 3, 2021

Created on Apr 3, 2021

Forked from Sea Turtle Survival (mock data)

This stacked area chart visualizes mock sea turtle survival data for three species—Green, Loggerhead, and Hawksbill—over time, with each colored layer representing population counts. The chart uses D3 v4’s `d3.stack()`, `d3.area()`, and `d3.scaleTime()` to render the SVG paths, while `d3-area-label` positions the species labels inside each region. Axis ticks and gridlines are styled with CSS, and the y-axis title labels the population metric. Data is loaded from a CSV file, filtered to post-1900 dates, and the chart redraws responsively on window resize.

AI-generated description

A stacked area chart of Global CO2 Emissions.

The segments "Solids", "Liquids", and "Gas" are the forms of fossil fuels being burned.

Uses d3-area-label to position labels.

Inspired by Scott Judson’s Block: Global Carbon Emissions Area Chart.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Sea Turtle Survival (mock data)

This stacked area chart visualizes sea turtle population trends from 1910 to 1990, showing the decline of Green, Loggerhead, and Hawksbill species using mock data. The chart uses d3.stack with ascending order, d3.area with curveBasis smoothing, and d3.scaleTime for the x-axis. Label placement employs d3-area-label, while hover interactions reveal species names via SVG titles. The visualization renders as SVG within an HTML page, using d3-scale-chromatic’s schemeDark2 for categorical colors and d3.axisBottom and d3.axisLeft for gridlines and tick marks.

Ggaryz1997

95% match

Loading thumbnail…

Fork of Fork of Sea Turtle Survival (mock data)

This stacked area chart shows the survival of sea turtle species (Green, Loggerhead, and Hawksbill) from 1910 to 1990 using mock data. The chart renders as SVG with D3 v4, using `d3.stack` and `d3.area` with `curveBasis` to create smooth stacked areas. Labels are positioned via `d3.areaLabel`, while hover effects reveal species names through built-in SVG `<title>` tooltips. The y-axis includes gridlines and a rotated title, with data parsed from an external CSV file using `d3.csv`.

Ppreethamkesa

95% match

Loading thumbnail…

Fork of Sea Turtle Survival (mock data)

This stacked area chart shows the declining populations of three sea turtle species—Green, Loggerhead, and Hawksbill—from 1910 to 1990, using mock data. The visualization uses d3.v4 with d3.stack and d3.area to construct the layers, while d3-area-label positions the species labels along the curves. It employs d3.scaleTime and d3.scaleLinear for axes, d3.schemeDark2 for colors, and includes hover effects that turn areas black, with basic tooltips revealing species names.

Aaniosindustries

95% match

Loading thumbnail…

Sea Turtle Survival (mock data)

This stacked area chart displays the decline in sea turtle populations (Green, Loggerhead, and Hawksbill) from 1910 to 1990 using mock data. The chart uses `d3.stack` with `d3.stackOrderAscending` to layer the three species, and `d3.area` with `d3.curveBasis` for smooth paths. Labels are positioned via the `d3-area-label` library, while axes use `d3.axisBottom` and `d3.axisLeft`. The visualization renders in SVG, with hover effects that turn areas black and tooltips showing species names.

CChristine Lanser

93% match

Loading thumbnail…

Turtle Survival

This streamgraph visualizes the mock mortality rates of three sea turtle species (Green, Loggerhead, Hawksbill) from 1901 to 2000, showing their combined decline over time. The stacked area chart uses d3.nest to group data by year and d3.stack to layer the species’ counts. Each species is distinguished by a color from a d3.scaleOrdinal palette, with the SVG paths generated using d3.area. Axes are scaled with d3.scaleLinear, and data is loaded from a CSV file via d3.csv.

CChristine Lanser

87% match

Loading thumbnail…

Turtle test

This stacked area chart visualizes turtle population counts for three species—Green, Loggerhead, and Hawksbill—from 1940 to 2010, based on data from `data.csv`. The chart uses `d3.stack` with `d3.stackOrderAscending` to layer the areas and `d3.area` with `d3.curveBasis` to render smooth paths in SVG. The `d3-area-label` library positions white text labels within each area, while `d3.scaleOrdinal(d3.schemeDark2)` colors the series. Hovering turns areas black, and an interactive resize listener updates the chart’s dimensions.

CChristine Lanser

86% match

Loading thumbnail…

Untitled

A stacked area chart shows the changing levels of three turtle species—Green, Loggerhead, and Hawksbill—from 1901 to 2000, revealing a dramatic decline in all populations. The chart uses d3.area to render the stacked layers, with d3.scaleOrdinal and d3.schemeSet2 providing the color palette. Brushing, implemented via d3.brushX, allows zooming on the x-axis, while hovering highlights individual series by adjusting opacity. The d3-axis components handle the time-based and numeric scales, and the rendering is done with SVG.

CChristine Lanser

84% match

Loading thumbnail…

ICE-7 Area chart : Shreeti Upreti

This stacked area chart visualizes sea turtle population trends for three species—Green, Loggerhead, and Hawksbill—from 1910 to 1990, using data loaded from a CSV file. It shows a dramatic decline in all populations over the century, with each species represented by a distinct color from the d3.schemeDark2 ordinal scale. The visualization uses d3.stack with ascending order, d3.area with a curveBasis interpolation, and d3.scaleTime for the temporal x-axis. Interactive hover reveals species names via SVG title tooltips, while d3.areaLabel positions labels along the stacked areas.

SShreeti Upreti

78% match