Skip to main content
SimilarExport ZIP
100%

Fork of D3 Starter

✓ Published0🌍 Public
Mmaddulanagasanjana@gmail.com
Last edited Oct 20, 2025
Created on Oct 20, 2025
Forked from D3 Starter

This fork of the D3 Starter template visualizes global trends in CO₂ emissions, energy use, and GDP for the United States, China, and India from 1960 to 2020. It presents two charts: a multi-series line chart using `d3.line` and `d3.axisBottom`, and a combined bar and line chart using `d3.scaleBand` and `d3.scaleLinear`. The code aggregates data from the Our World in Data CO₂ dataset with `d3.group` and `d3.mean`, styling the output with custom SVG elements and a legend.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of D3 Starter

This D3.js visualization displays three climate change metrics—CO₂ levels, temperature anomaly, and global mean sea level—as multi-line trends over time, using red, blue, and green strokes to distinguish each series. It employs dual y-axes, with temperature and sea level sharing a left scale while CO₂ uses a right scale, rendered via `d3.line` path generators. The SVG output loads data from a remote CSV using `d3.csv`, converts numeric fields with unary plus operators, and applies `d3.scaleLinear` domains and `d3.axisBottom`/`d3.axisLeft`/`d3.axisRight` for tick marks. Axes are formatted with integer tick labels, and lines are drawn with a 2-pixel stroke width.

Ssrisailapu.rc@gmail.com
81% match
Loading thumbnail…

Fork of D3 Starter

This example presents two interactive charts built with D3 v7: a multi-series line chart tracking three quantitative variables over time, and a combined bar-and-line chart. The line chart uses `d3.line` to plot valueA, valueB, and valueC against year, while the bar chart draws valueA as rectangles via `d3.scaleBand` and overlays valueB as a line with a secondary `d3.scaleLinear`. Data is loaded asynchronously from a CSV file using `d3.csv`. The code also demonstrates axes, legends, and chart titles.

Mmaddulanagasanjana@gmail.com
78% match
Loading thumbnail…

Fork of D3 Starter

This fork of the D3 Starter demonstrates a minimal bar chart that displays population data for several countries, sourced from a local CSV file. The visualization maps each country to a rectangle, with the height and width fixed while the data is read and logged. Built with d3.v7, the example uses `csv`, `scaleLinear`, `max`, and `select` APIs to parse data and prepare scales, though the rendered rectangles do not yet reflect the data values. The chart is drawn as SVG within a 960x500 canvas, with the data population values multiplied by 1000 during preprocessing.

SSudipta-15
78% match
Loading thumbnail…

project d3

This visualization presents global CO2 emissions and population data through a series of linked charts. It shows a line chart of emission trends over the last twenty years, a scatter plot by country, a histogram of emission values, and bar charts highlighting the top and least populated countries. The code uses d3.csv to load the dataset, then employs d3.group, d3.sum, and d3.scaleBand, alongside d3.line, d3.axisBottom, and d3.axisLeft to render SVG charts.

Jjyothirmaijyothi2017@gmail.com
78% match
Loading thumbnail…

Fork of D3 Starter 3

This multi-series line chart shows the daily trends of sales, profit, and expenses over the first half of 2024, applying D3’s `scaleLinear` and `scaleUtc` to map the data. It renders three monotone curves via `d3.line()` and `d3.curveMonotoneX`, using ordinal colors for each series and displaying interactive tooltips on hover. The visualization includes rotated monthly axis ticks, a legend, and axis labels, all drawn as SVG elements.

Vvijaysaichigullapally1@gmail.com
78% match
Loading thumbnail…

Fork of D3 Starter

A horizontal bar chart displays population figures for nine countries, sourced from an embedded CSV file. The bars render as SVG rectangles, with each country's population scaled linearly along the x-axis and country names positioned using a band scale on the y-axis. The code uses d3.csv to load the data, d3.scaleLinear for the width mapping, d3.scaleBand for categorical spacing, and d3.select to append the rectangles.

Mminaadel6600
77% match
Loading thumbnail…

Fork of D3 Starter

This example displays a bar chart of average energy consumption by household appliance, sourced from a CSV file. It uses D3 v7 to load the data, construct linear and band scales, and render SVG rectangles for the bars, with rotated axes labels. The visualization adds a descriptive title and applies a blue fill to each bar via the `d3.scaleBand` and `d3.scaleLinear` APIs.

Mmaddulanagasanjana@gmail.com
77% match
Loading thumbnail…

Fork of Fork of HTML Starter

This example visualizes climate trends from 2010 to 2022 with a synthetic dataset of 156 monthly records. It combines sky-blue bars for rainfall on a left axis with tomato-colored temperature and green CO₂ lines on a right axis. The chart uses D3.js version 7, employing `d3.scaleTime` for the time axis, `d3.scaleLinear` for the dual quantitative scales, and `d3.line` for the path generation. `d3.select` appends SVG elements, while `d3.axisBottom`, `d3.axisLeft`, and `d3.axisRight` render the axes.

Vveginetiumeshchandra@lbrce.ac.in
77% match