Skip to main content
SimilarExport ZIP
100%

Fork of Line Chart

✓ Published1🌍 Public
Nnishanththouta16@gmail.com
Last edited Apr 1, 2025
Created on Apr 1, 2025

A simple line chart tracks six years of sales data, with a black polyline connecting points across evenly spaced, band-scaled year categories. The chart uses D3 v6 to build an SVG, applying `d3.scaleBand` and `d3.scaleLinear` to map coordinates and a `d3.line` generator to create the path. Axes are drawn with `d3.axisBottom` and `d3.axisLeft`, while text labels appear for both variables, all with the dataset embedded directly in `index.html`.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Line Chart

This example shows a line chart of sales over time, with axes labeled "Year" and "Sales," rendered as an SVG inside an HTML page. The visualization uses d3.scaleTime and d3.scaleLinear to map data to pixel coordinates, d3.axisBottom and d3.axisLeft for tick marks and labels, and d3.line to generate the red path. Data is loaded as CSV from a GitHub gist, with years parsed via d3.timeParse. The code also references a React starter, though the displayed version runs with vanilla JavaScript and D3 v5.

MMar-99
85% match
Loading thumbnail…

Fork of line chart

This example visualizes yearly total sales with a line chart, plotting date values against sales figures on Cartesian axes. The SVG rendering uses d3.scaleTime and d3.scaleLinear to map the data domain, while d3.axisBottom and d3.axisLeft generate the tick marks and labels. Data loads from a CSV file at a GitHub gist URL, and the line path is drawn using d3.line. The visualization removes axis domain lines, adds axis labels, and styles the path with a black stroke.

Rrohinikotha
85% match
Loading thumbnail…

Fork of Line chart

This line chart visualizes yearly sales data from a remote CSV file, mapping time on the x-axis and sales values on the y-axis. The code uses D3 v7’s `d3.csv` to load and parse data, `d3.scaleTime` and `d3.scaleLinear` for scales, and `d3.line` to generate a steelblue path. Axes are rendered with `d3.axisBottom` and `d3.axisLeft`, with custom formatting for years, and the SVG output is sized 800 by 400 pixels. The visualization demonstrates a clean, minimal line chart with labeled axes and no interactivity.

Mmadipadiga.raviteja@gmail.com
85% match
Loading thumbnail…

Fork of Line Chart

This fork of a line chart visualizes monthly sales data for 2022, plotting sales figures against months. The chart uses D3 v5 and renders as an SVG, with a purple line connecting data points. It employs `d3.scalePoint` for the x-axis, `d3.scaleLinear` for the y-axis, and `d3.line` to generate the path. Data is loaded from a CSV file via `d3.csv`, with axis labels and a title styled through CSS. The visualization includes gridlines via the y-axis tick size.

MM
85% match
Loading thumbnail…

Fork of Line Chart for ice 7

This fork shows sales figures from 2001 to 2010 as a single thick maroon line plot. It uses D3 v5 to map time-series data from a CSV file onto a Cartesian coordinate system, with a linear y-axis for sales and a time-based x-axis for years. The SVG output features gridlines from axis ticks, axis labels, and a title, all styled via an external CSS file.

Eeravellisaimeghana
85% match
Loading thumbnail…

Fork of Line Chart

This visualization shows a line chart of annual sales data, with the x-axis representing time in years and the y-axis representing sales figures. The chart includes labeled axes with gridlines and the line itself rendered in red. Built with React and D3 v5, the code uses `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` to construct the visualization from CSV data. The SVG rendering approach separates React integration concerns from D3’s data joins, following a starter pattern for scalable complexity.

VVenkata Sai Preetham
84% match
Loading thumbnail…

Fork of Fork of Line Chart

This example shows the annual sales of automobiles from 2003 to 2018 as a single blue line, with red tick labels and a pink y-axis label on a black background. The chart uses d3.scaleTime and d3.scaleLinear to map data, d3.axisBottom and d3.axisLeft for gridlines, and d3.line to generate the path. Data is loaded asynchronously from a GitHub-hosted CSV file using d3.csv, and the visualization is rendered as SVG.

RRahulSai05
83% match
Loading thumbnail…

Fork of Fork of Fork of Line Chart

This visualization shows product sales from 2015 to 2022, with time mapped to the x-axis and sales figures on the y-axis. The line chart uses a red stroke to trace the sales trend across years. The code loads CSV data from a gist URL using d3.csv, converts the Year column to Date objects and Sales to numbers, then renders the chart with d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.line. The SVG output includes gridlines via tickSize and axis labels, with the margin and inner dimensions calculated for layout.

Sspandhanabadekol
83% match