Skip to main content
SimilarExport ZIP
100%

Line Chart with Multiple Lines

✓ Published3🌍 Public
SSean Moore
Last edited Nov 18, 2019
Created on Nov 13, 2019

This line chart displays multi-year budget estimates for Block IV SSN submarines, with each line representing a different submarine class and its projected delivery dates. The visualization uses D3 v5 with SVG rendering, employing `scaleTime` for both axes, `scaleOrdinal` for color mapping, and a `line` generator with `curveBasis` smoothing. A color legend is built using a custom `colorLegend` function, while the data is sourced from Data Canvas - Sense Your City and processed via D3's `nest` and `descending` sorting to order the lines.

AI-generated description

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

MIT Licensed

Similar vizzes

Loading thumbnail…

Block IV Projections

A multi-line chart displays budget projections for Block IV SSN over time, with each line representing a distinct SSN and its delivery estimates. The chart uses D3's `scaleTime` for both axes, `line` with `curveBasis` for smoothing, and `nest` to group data by SSN, colored via `schemeCategory10`. A custom `colorLegend` function renders the legend. The data, sourced from a CSV file, is parsed into `Date` objects for the x and y axes, showing delivery dates against budget years.

SSean Moore
84% match
Loading thumbnail…

Block IV Projections

This visualization displays budget estimates for Block IV SSNs across fiscal years, using a line chart. Time-based axes for both year and delivery date plot data points from the "blockiv_ssn.csv" dataset. The code renders the chart with SVG, using `scaleTime` and `scaleOrdinal` for scaling, `axisBottom` and `axisLeft` for axes, and a custom `colorLegend` loop to differentiate SSNs by color. Lines are generated via `line` with `curveBasis`, and groups are sorted by descending last delivery year.

SSean Moore
82% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays projected delivery dates by report year for multiple Social Security Number (SSN) groups, with each line representing a distinct category color-coded using `d3.scaleOrdinal` and `schemeCategory10`. The chart includes labeled axes, a title, and a color legend rendered as SVG circles and text. It uses `d3.line` with `curveBasis` smoothing, `d3.nest` to group data by SSN, and `d3.axisBottom` and `d3.axisLeft` for ticks. Data comes from a CSV of modified SSN records, parsed with `d3.csv` and converted to JavaScript `Date` objects.

SSean Moore
78% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart tracks projected delivery dates against report years for multiple social security number categories over time. The visualization uses D3 v5 with scales, axes, and a line generator with curveBasis smoothing to render each category as a distinct colored path. Data is loaded from a CSV file and grouped using d3.nest. The chart includes a custom color legend component and axis labels, with temperature data sourced from the Data Canvas – Sense Your City project.

SSean Moore
78% match
Loading thumbnail…

Line Chart with Multiple Lines

This line chart displays how vessel valuations change over time, with each line representing a different vessel and color-coded according to a categorical scale. The data comes from a CSV file loaded from VizHub. The visualization uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `scaleOrdinal`, `line` with `curveBasis`, `nest` for grouping, and `axisLeft`/`axisBottom` for axes, rendering to SVG with a custom `colorLegend` function.

Nnataliaokuneva
77% match
Loading thumbnail…

Line Chart with Multiple Lines

This example visualizes projected delivery dates for Social Security numbers across multiple report years, using a smooth, curved line to show the relationship between report year and projected delivery time. The chart employs time-scaled axes on both dimensions, with a maroon line path rendered in SVG. Built with D3 v5, it uses d3.csv to load external data, d3.scaleTime for temporal scaling, d3.line with d3.curveBasis for the smoothed path, and d3.axisBottom and d3.axisLeft for labeled axes with grid ticks.

SSean Moore
76% match
Loading thumbnail…

Multiple Line Chart

This multi-line chart displays military spending trends from 2001 to 2020 across eight countries, with the y-axis showing spending amounts and the x-axis representing years. The visualization uses D3 v5 to render an SVG, applying `scaleLinear` for both axes, `line` with `curveBasis` for the path, and `nest` to group data by country. The chart includes axis labels, a title, and a single maroon line path, though the nested data structure is logged but not separately rendered as distinct lines.

KKinjal-Goyani
75% match
Loading thumbnail…

Fork of Multiple Line Chart

This visualization displays military spending trends from 2001 to 2020 across multiple countries, with each country’s annual spending plotted as a line over time, and the aggregated data using all points rather than separating by nation. It employs D3 v5’s `scaleLinear` for both axes, `line` with `curveBasis` to smooth the path, and `nest` to group the dataset by country, though the chart ultimately draws a single combined line. The SVG rendering includes custom axes with gridlines, a title, and axis labels, sourced from a CSV file containing country, year, and spending values.

KKinjal-Goyani
74% match