Skip to main content
SimilarExport ZIP
100%

Line Chart

✓ Published1🌍 Public
LLikhitaMudagereShivaraj@my.unt.edu
Last edited Oct 26, 2025
Created on Oct 26, 2025

This line chart shows monthly value trends across multiple years, with a smooth monotone curve plotted over time. The visualization uses D3.js v7, specifically the `d3.scaleTime` and `d3.scaleLinear` axes, and renders the line via `d3.line` with a `d3.curveMonotoneX` curve. Data is loaded from a CSV file using `d3.csv`, and the chart outputs to an SVG canvas with labeled axes and tick marks. The styling adheres to BBC-like color themes and font choices, though the core plot focuses on the steelblue line and its temporal variation.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

LINE CHART

This line chart displays monthly revenue trends over time, with each data point marked by a circle and connected by a steelblue line. The visualization uses D3 v7’s `d3.scalePoint` for the categorical month axis, `d3.scaleLinear` for the revenue scale, and `d3.line` to generate the path. Data is loaded asynchronously from a CSV file via `d3.csv`, and rendered as SVG with axis labels and gridlines.

PP Manisha
83% match
Loading thumbnail…

Line chart.js!

This line chart visualizes yearly data from a CSV file, plotting values against years with a blue line on axes labeled "Year" and "Value." It uses D3 v7 to load the data via `d3.csv`, scales the x- and y-axes with `d3.scaleLinear`, and renders the line path using the `d3.line` generator. The chart explicitly appends axes, labels, and the line to an SVG element, with margins set to accommodate tick marks and text. The example demonstrates basic DOM manipulation and data binding in D3.

Vvishnupriya eupuri
83% match
Loading thumbnail…

Basic line chart

This basic line chart displays a time series of yearly values from a CSV file, with a single blue line tracing the data points. The visualization uses D3 v4 to parse the CSV columns, mapping the "year" field to a time-scaled x-axis and the "value" field to a linear y-axis. Axes are rendered with d3.axisBottom and d3.axisLeft, and the line path is drawn using d3.line with a stroke width of 2.5 pixels. The chart includes labeled axes and is designed as a reusable template, with customizable data file, column names, and labels in the script.

EEleonore9
82% match
Loading thumbnail…

Line Time 2

The chart displays a stepped line tracing a time series of monthly values from a CSV file, with data points highlighted by large circles. The visualization renders to an SVG element, using D3 v7’s `scalePoint`, `scaleLinear`, `line`, and `curveStep` APIs to construct the path, alongside `axisBottom` and `axisLeft` for the axes. Data is loaded via `csv`, sorted by date, and mapped onto the scales with a 0.5 padding factor. A title text element sits above the plotting area.

Ddiegobrivo
82% match
Loading thumbnail…

LINE CHART

This line chart visualizes monthly sales data for a six-month period, with a smooth monotone curve connecting sales values for January through June. The chart uses D3 v7 with an SVG rendering approach, employing `d3.scaleBand` for the categorical month axis, `d3.scaleLinear` for the sales values, and `d3.line` with `curveMonotoneX` to create the interpolated path. Circular markers highlight individual data points at each month's sales level, while axes are rendered using `d3.axisBottom` and `d3.axisLeft` with labels for "Month" and "Sales."

CChindamrohan321@gmail.com
81% match
Loading thumbnail…

Basic line chart

This line chart shows the relationship between two numerical values and time, plotting two series from a CSV file across the years 2010–2015. It uses d3.csv to load the data, then applies d3.scaleTime and d3.scaleLinear for axes, while d3.line constructs the paths. The chart renders in SVG, with each line styled via a separate stroke color. Axis labels are added using d3.axisBottom and d3.axisLeft, and the code includes configurable column names for easy reuse as a template.

EEleonore9
81% match
Loading thumbnail…

third

This example shows the monthly sales trend from 2021 to 2025 as a smooth line chart. The chart displays a single steelblue line with orange data points, with rotated month labels on the x-axis and a linear y-axis. Built with D3 v6, the code uses `d3.csv` to load `sales_trend.csv`, `d3.scaleTime` and `d3.scaleLinear` for axes, `d3.line` with `d3.curveMonotoneX` for the smoothed path, and `d3.axisBottom` and `d3.axisLeft` for tick marks. The SVG rendering includes a title and axis labels.

119h61a05c9@cvsr.ac.in
81% match
Loading thumbnail…

simple line chart from dataset

This line chart visualizes a small dataset of monthly values, mapping dates on the x-axis and numeric values on the y-axis, with a steelblue stroke for the line. It also includes an interactive tooltip: moving the mouse over the chart reveals a focus circle and a label showing the price formatted as currency. The visualization uses D3 v3 with `d3.time.scale`, `d3.svg.line`, `d3.svg.axis`, and `d3.bisector` for mouse-based lookup. Data is loaded via `d3.tsv` from a local JSON file, and the rendering is SVG-based.

LLRobergeon
81% match