Skip to main content
SimilarExport ZIP
100%

Fork of Line Chart ice-7

✓ Published0🌍 Public
Ssushmithameher-patnam
Last edited Mar 13, 2023
Created on Mar 13, 2023
Forked from Line Chart ice-7

This example displays Honda stock prices over time as a red line chart, with the year on the x-axis and stock price on the y-axis. It uses d3.scaleTime and d3.scaleLinear to map the data, with d3.axisBottom and d3.axisLeft generating labeled ticks. The data is loaded from a CSV file using d3.csv and parsed with d3.timeParse. The chart is rendered as an SVG, with a line generator from d3.line drawing the path, and gridlines created via tickSize.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE7 Area Chart

This visualization displays Honda stock prices over time as a smooth, filled area chart. The code loads CSV data from a GitHub gist and uses d3.scaleTime, d3.scaleLinear, and d3.area with a curveBasis interpolation to render the SVG path. Axes are generated with d3.axisBottom and d3.axisLeft, featuring custom tick formatting and labels. The chart is built using D3 v6 within a React framework.

Ssushmithameher-patnam
86% match
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
84% 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
83% match
Loading thumbnail…

Fork of Line Chart- Data Visualization

This line chart displays Amazon stock prices over time, with the year on the x-axis and price on the y-axis. It uses d3.scaleTime and d3.scaleLinear to map the data, d3.axisBottom and d3.axisLeft for the labeled axes, and d3.line to generate the path. The data is loaded from a remote CSV file and parsed with d3.timeParse. The chart is rendered as SVG with gridlines from tickSize, axis labels, and styled line and text elements via CSS.

AAngel Alfredo
83% match
Loading thumbnail…

Fork of Line Chart

This example visualizes Tesla’s historical stock closing prices as a line chart over time. It first shows the price trend across the date range, then uses D3.js v7 to load CSV data, parse dates, and map the values to a time-based x-scale and linear y-scale. The code draws the line with a steelblue stroke, adds axes and labels, and relies on `d3.csv`, `d3.timeParse`, `d3.scaleTime`, and `d3.line`. The rendering uses SVG, with the data sourced from a remote CSV file hosted on GitHub.

Mmanthenasirisha06@gmail.com
82% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of fork of ICE-7

This example shows a line chart tracking sales data across specific years, with the x-axis representing time and the y-axis representing sales figures. The visualization uses D3 v5 to load CSV data from a GitHub gist, parse the dates, and render an SVG line path. It employs `scaleTime` and `scaleLinear` for axes, `axisBottom` and `axisLeft` for tick marks with custom styling, and `line` to generate the orange stroke path. The code also includes labeled axes and grid lines through `tickSize` and `tickPadding` settings.

Ssainitish1999
82% match
Loading thumbnail…

Fork of Fork of ICE-7

This example displays a line chart of sales data over time, with the x-axis representing years and the y-axis representing sales figures. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` APIs to build the axes, while a `line` generator creates the orange stroke path. Data is loaded from a CSV file hosted on GitHub Gist, and the year values are parsed with `d3.timeParse` to format them as dates. The SVG rendering includes custom axis labels and styled tick marks.

TTulluripallavi
82% match
Loading thumbnail…

Fork of ICE-7 Line Chart

This fork of an ICE-7 line chart visualizes the cost of sales from 2000 to 2013 using D3 v5. It renders an SVG line chart with time-scaled X-axis and linear Y-axis, using D3's `scaleTime`, `scaleLinear`, `axisBottom`, and `axisLeft` APIs. The chart loads CSV data from a GitHub gist, converts the Year field to `Date` objects, and draws a red line path via `line()`. The visualization includes labeled axes, a title, and grid lines generated through tick marks.

AAmrutha Mohan
82% match