line chart

100%

✓ Published0🌍 Public

Nnagarjuna1968

Last edited Mar 28, 2022

Created on Mar 28, 2022

This line chart displays alcohol sales over time, with years on the x-axis and total sales on the y-axis. The visualization uses D3 v5 APIs including `scaleTime` for the date-based x-axis, `scaleLinear` for the y-axis, `axisBottom` and `axisLeft` for the axes, and `line` for the path generator. The chart reads data from a CSV file hosted on GitHub, parses the year values, and renders the colored line path in SVG. Gray gridlines extend from the ticks, with axis labels and a cursive font for annotation.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

line chart

This line chart shows total electronic sales over time, with years on the x-axis and sales figures on the y-axis. The visualization uses an SVG canvas with D3 v5, importing specific functions like `scaleLinear`, `scaleTime`, `axisLeft`, `axisBottom`, and `line` to generate the plot. Data is loaded from a CSV file via the `csv` function and parsed with `d3.timeParse` to format date values. The chart includes grid lines, axis labels, and a black line path styled with CSS class `.line_path`, all rendered using D3’s low-level SVG API.

Kkranthireddyskr

83% match

Loading thumbnail…

Line Chart

This line chart visualizes annual sales data, displaying the trend of sales values over time on a red path. The SVG chart uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` to construct the axes and line generator. It parses dates with `d3.timeParse` and loads data from an external CSV file. Grid lines are styled through tick marks, with blue tick labels and a rotated Y-axis label for clarity.

KKiran3295

82% match

Loading thumbnail…

line chart

This example shows cosmetics sales totals over a series of years, with a red line tracing the trend across a time-based x-axis and a linear y-axis. The visualization uses D3 v5 with an SVG rendering approach, employing `scaleTime` and `scaleLinear` to map data, `axisBottom` and `axisLeft` for gridlines, and the `line` generator to create the path. Data is loaded as CSV from a GitHub gist, with dates parsed using `d3.timeParse`.

RRakshithaRao27

82% match

Loading thumbnail…

Line chart

This line chart visualizes yearly sales data using a time-series line graph. The SVG rendering uses D3.js v7 with `d3.csv` for data loading, `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, and `d3.axisLeft` for axes, and `d3.line` to generate the path. Data comes from a remote CSV file accessed via a gist URL.

Rr79162810@gmail.com

81% match

Loading thumbnail…

Online Sales Line chart

This example shows online sales revenue over time as a line chart, with the x-axis representing years and the y-axis representing total revenue. It uses D3 v5 to load CSV data, parse dates with `d3.timeParse`, and render the visualization in SVG. The code employs `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` generators to construct the chart, with gridlines styled via tick marks and a styled purple stroke for the data path.

MManideeprenikindi

81% match

Loading thumbnail…

Line Chart

This example uses a line chart to show the sales of a company over time, with years on the x-axis and sales values on the y-axis. The visualization includes labeled axes, a title, and a red line path. Built with React and D3 v5, it loads CSV data from a GitHub Gist and renders the chart as SVG. The code uses `d3.scaleTime`, `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.line` to map the data to visual elements.

Mmanvithareddykarra

80% match

Loading thumbnail…

Line chart

This example displays a line chart of total sales per year, with a single steelblue path plotted against a time-scaled x-axis and a linear y-axis. The chart is a static SVG rendered in D3 v7. The code loads a CSV from a GitHub gist (titanic.csv), aggregates sales data by summing each year’s column, and uses `d3.scaleTime`, `d3.scaleLinear`, `d3.line`, and `d3.axisBottom`/`d3.axisLeft` to construct the visualization. The SVG is sized at 800x400 pixels with margins, and axis labels are added as text elements.

Ssriram.official9@gmail.com

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

79% match