Skip to main content
SimilarExport ZIP
100%

Fork of Area Death's

✓ Published0🌍 Public
NNikitha123171
Last edited Mar 26, 2023
Created on Mar 26, 2023
Forked from Area Death's

This example shows the crime index across different countries over time, with the data plotted as a smooth, orange area chart. The chart uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisLeft`, `axisBottom`, and `area` with `curveBasis` to create the filled curve. It is rendered as an SVG inside an HTML page, and the data is loaded from a CSV hosted on GitHub, with axis labels and a title styled via CSS.

AI-generated description

This line chart shows one week of temperature (in degrees Celcius) in San Francisco. The data comes from Data Canvas - Sense Your City.

Made in this video:

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Area Death's

This visualization displays the Crime Index across different countries using an area chart, with countries on the x-axis and crime index values on the y-axis. The code uses D3 v5 APIs including `d3.scaleTime`, `d3.scaleLinear`, `d3.axisLeft`, `d3.axisBottom`, and `d3.area` with `curveBasis` to render the smooth filled path in SVG. Data is loaded from a CSV via `d3.csv` and converted from strings to numbers and dates. The chart includes labeled axes, grid lines, and a red title, with orange fill styling applied through CSS.

NNikitha123171
94% match
Loading thumbnail…

Fork of Fork of Area Death's

This visualization shows the crime index across different countries, with the x-axis displaying countries as time-scaled values and the y-axis representing the crime index. The chart uses a filled orange area path rendered with d3.area and a basis curve, while axes are created using d3.axisBottom and d3.axisLeft. Data is loaded as CSV from a GitHub gist, with country values parsed as dates and crime index as numbers. The SVG rendering includes a red title and purple axis labels, with d3.scaleTime and d3.scaleLinear mapping the data ranges.

NNikitha123171
92% match
Loading thumbnail…

Fork of Fork of Area Death's

This area chart displays the number of deaths per year, with the x-axis representing years and the y-axis representing the death count. The chart uses a smooth curve to connect data points, rendered as an SVG with a yellow fill. Built with D3 v5, it employs `scaleTime` and `scaleLinear` for axes, `area` with `curveBasis` for the smoothed path, and `axisBottom` and `axisLeft` for labeled ticks. The data, sourced from a CSV file, is loaded via `csv` and parsed into date and numeric values.

GGogineni44
87% match
Loading thumbnail…

Fork of Area Death's

This fork of "Area Death's" displays a single area chart from a CSV dataset, plotting average life expectancy against a time series of years. The chart uses D3 v5’s `select`, `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom` to construct the SVG axes, while the `area` generator with `curveBasis` and explicit `y0`/`y1` settings fills the orange region below the line. The reduced data, sourced from Data Canvas - Sense Your City, is parsed by converting the year string into a `Date` object and the life-expectancy values into numbers, with the final graphic rendered in an SVG canvas and styled via the `styles.css` class definitions.

GGogineni44
86% match
Loading thumbnail…

Fork of Area Death's

This fork of "Area Death's" displays a single area chart from a CSV dataset, plotting average life expectancy against a time series of years. The chart uses D3 v5’s `select`, `scaleTime`, `scaleLinear`, `axisLeft`, and `axisBottom` to construct the SVG axes, while the `area` generator with `curveBasis` and explicit `y0`/`y1` settings fills the orange region below the line. The reduced data, sourced from Data Canvas - Sense Your City, is parsed by converting the year string into a `Date` object and the life-expectancy values into numbers, with the final graphic rendered in an SVG canvas and styled via the `styles.css` class definitions.

GGogineni44
86% match
Loading thumbnail…

Fork of Area Death's

This area chart visualizes death by stroke, plotting average life expectancy against years. The visualization uses d3.area() with a curveBasis for smooth interpolation, d3.scaleTime() and d3.scaleLinear() for axes, and d3.axisBottom() and d3.axisLeft() with gridlines. Data is loaded via d3.csv() from a GitHub gist, rendered as an SVG, and styled with orange fill and a red title. The chart includes axis labels for years and life expectancy.

Cchandanagandla
85% match
Loading thumbnail…

Fork of Area Death's

This area chart depicts average life expectancy over time, with a title reading “Death By stroke,” using data from a CSV file. D3 v5 constructs time and linear scales, generates a basis-curved area path via `d3.area`, and renders SVG axes through `axisBottom` and `axisLeft`. The visualization includes custom axis labels and a red title, with orange fill for the area. Data is loaded asynchronously using `d3.csv` from a GitHub gist, and the chart is sized to the SVG’s width and height attributes.

Kkollirohit2000
85% match
Loading thumbnail…

Fork of Area Death's

This area chart displays yearly review counts as a single orange filled curve, titled “Death By stroke,” with axes labeled “Year” and “review_count.” Built with D3 v5, it uses `d3.csv` to load data from a GitHub gist, `scaleTime` and `scaleLinear` for positioning, and `area` with `curveBasis` to generate the smooth path. Axis ticks are styled via `axisBottom` and `axisLeft`, while titles and labels are rendered as SVG text elements.

SSANEEM MOHAMMAD
85% match