Skip to main content
SimilarExport ZIP
100%

Melting Data for multiple lines - new un Data

✓ Published1🌍 Public
AAjit Singh
Last edited Jan 17, 2021
Created on Jan 16, 2021

This visualization displays world population estimates from 1950 to 2100 as multiple smoothed lines, one per region, colored by category. The chart uses d3.line with curveBasis, d3.scaleTime, d3.scaleLinear, and d3.nest to group data, while a custom colorLegend function renders the ordinal color scale with SVG circles and text. Data comes from UN population estimates CSV files, melted from wide to long format.

AI-generated description

An example including some commonly used features of SVG.

MIT Licensed

Similar vizzes

Loading thumbnail…

Melting Data for Multiple Lines

This visualization displays population over time by region, with multiple colored lines representing different world regions from 1950 to 2100. The chart uses D3 v5’s `nest()` to group data by region, `scaleTime` and `scaleLinear` for axes, and `line` with `curveBasis` to generate smooth paths. Data comes from UN population estimates and medium variant projections, processed by melting wide-format CSV data into tidy long format. A custom `colorLegend` function renders the categorical color scale, and the visualization includes gridlines, axis labels, and a title.

MMounikaBeerelly
94% match
Loading thumbnail…

Melting Data for Multiple Lines

This chart displays population estimates and projections from 1950 to 2100 for regions worldwide, using multiple lines colored by country and sorted by their final population values. The visualization relies on d3.csv to load UN data, d3.nest to group rows by region, and d3.line with curveBasis to generate smooth paths. A custom colorLegend module renders the categorical color scale, while axes are built with d3.axisLeft and d3.axisBottom, and the data is reshaped through a custom “melting” process that converts wide-format year columns into long-format rows.

Ssafdarawan
94% match
Loading thumbnail…

Melting Data for Multiple Lines

This example visualizes global population trends from 1950 to 2100, showing how different regions change over time as multiple lines. The chart uses `d3.line` with `curveBasis` to draw smooth paths, with color encoding via `d3.scaleOrdinal` and a custom `colorLegend`. Data is melted from wide to long format using a custom `melt` function that processes UN population estimates from two CSV files, concatenating historical estimates with medium-variant projections. The visualization includes axis labels, gridlines, and a legend, with regions sorted by their final population value.

Mmeihaoming
94% match
Loading thumbnail…

Melting Data for multiple lines

This example visualizes population estimates and projections by region from 1950 to 2100, using multiple overlaid lines to show trends over time. The view encodes time on a linear scale and population on a log-free axis, with a categorical color legend identifying each region. The underlying dataset is merged from two UN CSV files using a custom data-melting process that reshapes wide-format rows into long-format records. The chart uses d3.scaleTime, d3.scaleLinear, d3.nest, and d3.line with curveBasis to render smooth paths, while a reusable colorLegend component draws the SVG legend.

Pprincit
94% match
Loading thumbnail…

Melting Data Multiple Lines

The visualization shows population over time by region as multiple smoothed lines, with a color legend and axis labels. It uses D3 v5 APIs including `nest()` for grouping, `line()` with `curveBasis` for path generation, `scaleTime` and `scaleLinear` for axes, and `scaleOrdinal` with `schemeCategory10` for colors. Data is melted from UN population estimates and medium variant CSV files, spanning 1950 to 2100, rendered as SVG paths with multiply blend modes.

CCarloWK1202
94% match
Loading thumbnail…

Melting Data for Multiple Lines

This visualization shows population trends over time for world regions from 1950 to 2100, displayed as multiple smoothed line paths colored by region. The code uses D3 v5 with `d3.nest` to group data by region, `d3.line` with `curveBasis` for smoothing, and `d3.scaleTime`, `d3.scaleLinear`, and `d3.scaleOrdinal` for axes and color mapping. Data is melted from wide UN population CSV files using a custom `melt` function that reshapes yearly columns into long format, combining estimates and medium-variant projections.

CCurran Kelleher
94% match
Loading thumbnail…

Melting Data for Multiple Lines

This visualization shows population over time by region, with multiple lines representing different areas across a time series from 1950 to 2100. The chart displays data from UN population estimates and medium variant projections, processed through a melting technique that converts wide-format data into long format using `d3.csv`, `d3.timeParse`, and `d3.range`. The visualization uses `d3.scaleTime` and `d3.scaleLinear` for axes, `d3.nest` to group data by region, and `d3.line` with `curveBasis` for smooth paths. A color legend is implemented via a custom `colorLegend` component using `d3.scaleOrdinal` with `schemeCategory10`.

KKevinw97
94% match
Loading thumbnail…

Melting Data for multiple lines

This visualization shows world population estimates for different regions over time as multiple colored lines. It uses a line chart with an ordinal color scale to distinguish each region. The example loads data from CSV files, nests it by region using `d3.nest`, and renders smooth curves with `d3.line` and `curveBasis`. It also includes a custom color legend component and styled axes with grid lines.

AAjit Singh
94% match