Block IV Projections

100%

Block IV Projections

✓ Published1🌍 Public

Last edited Nov 18, 2019

Created on Nov 18, 2019

Forked from Line Chart with Multiple Lines

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.

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

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

94% match

Loading thumbnail…

Line Chart with Multiple Lines

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.

SSean Moore

84% 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

79% 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

75% 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

72% match

Loading thumbnail…

Projections for SSN

This example displays temperature changes in San Francisco over a week using a time-series line chart rendered as SVG. The code loads data from a CSV file and maps timestamps to the x-axis and temperature to the y-axis, with a smooth curve via `d3.line` and `curveBasis`. It uses `d3.scaleTime`, `d3.scaleLinear`, and `d3.axisLeft`/`axisBottom` to build axes, while `d3.extent` sets domains. The visualization includes labeled axes and a title, styled with custom CSS for the maroon line and grid ticks.

SSean Moore

72% match

Loading thumbnail…

fresh block

A single black line chart plots monthly values from a small JSON dataset, with light gray circles marking each data point. Hovering a circle turns it red, displays the exact value above it, and draws a dashed vertical guide line to the baseline. The visualization uses D3 v4 with SVG rendering, applying `d3.scaleTime`, `d3.scaleLinear`, and `d3.line` for the chart, plus mouseover handlers to toggle the interactive details. Axis labels show abbreviated month-year formats, with the final value annotated in larger monospace text.

NNpfn

67% match

Loading thumbnail…

Linechart2

This example shows multiple time series as colored lines, with each line representing a distinct category tracked over time on a shared axis. It uses D3 v6 to load a CSV dataset with `d3.csv`, group the data by category with `d3.group`, and render the lines with the `d3.line` generator. The visualization sets up a linear x-axis for years and a y-axis for values, applying a categorical color scale via `d3.scaleOrdinal`. The SVG is appended to a `div` container with explicit margins and dimensions, and axes are drawn using `d3.axisBottom` and `d3.axisLeft`.

Nnicolekevans

66% match