Fork of HTML Starter

100%

Fork of HTML Starter

✓ Published0🌍 Public

Last edited Mar 28, 2024

Created on Mar 28, 2024

This area chart visualizes automobile sales in India from 2008 to 2024, highlighting the trend in annual sales figures. The visualization uses D3.js v5 with SVG rendering to draw both a smooth line and an area fill beneath it, employing `scaleTime` for the temporal x-axis and `scaleLinear` for the y-axis. Data is loaded from a CSV file, parsed with `d3.timeParse` for dates, and rendered with `line()` and `area()` generators using `curveBasis` for smooth interpolation. The chart includes labeled axes and a titled heading, with the area styled in a light green tone.

AI-generated description

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

Similar vizzes

Loading thumbnail…

Fork of Area Chart

This fork of an area chart visualizes car sales in India from 2009 to 2019, combining a smooth line and a filled pink area to emphasize the sales trend over time. The SVG chart uses D3 v5's `scaleTime`, `scaleLinear`, `line`, and `area` generators with `curveBasis` for smoothing, along with `axisBottom` and `axisLeft` for labeled axes. Data is loaded via `csv` from a GitHub gist, and the year values are parsed with `d3.timeParse`.

Ppravallikayaram12

88% match

Loading thumbnail…

area fork

This area chart shows the sales of cars in India from 2009 to 2019, with a smooth line tracing yearly values and an orange filled region beneath it, using an SVG rendered with D3 v5. The visualization employs `d3.scaleTime` and `d3.scaleLinear` for the axes, `d3.line` and `d3.area` with `curveBasis` to create the smooth curve, and `d3.csv` to load the dataset, which is parsed with `d3.timeParse` for the year values. The chart includes labeled x and y axes with formatted tick marks.

AAkshay

87% match

Loading thumbnail…

Fork of Fork of ICE 7 Area Chart

This visualization shows car sales in India from 2009 to 2019 using a combined line and area chart, with a smooth basis curve overlaid on a pink area fill. Built with d3.v5, the code uses D3’s `line`, `area`, and `curveBasis` generators to render the SVG, while `scaleTime` and `scaleLinear` handle the temporal and numeric axes. The chart’s green tick labels and red axis titles are styled via CSS, as defined in the accompanying stylesheet. The dataset is loaded from a CSV file hosted on GitHub, with sales and dates parsed for rendering.

Ppavankalyan1507

86% match

Loading thumbnail…

Area Chart

This area chart visualizes car sales in India from 2009 to 2019. Using D3 v5, it renders an SVG with a smoothed line and a pink filled area beneath it, showing the sales trend over time. The code loads CSV data, parses dates, and uses `d3.scaleTime` and `d3.scaleLinear` for the axes. It employs `d3.line`, `d3.area`, and `d3.curveBasis` to generate the paths, with styled tick marks and axis labels from `d3.axisBottom` and `d3.axisLeft`.

Ppavankalyan1507

86% match

Loading thumbnail…

Fork of Fork of line chart section 3

A line chart displays car sales data from India across the years 2013–2021, with year on the x-axis and total sales on the y-axis. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `axisBottom`, `axisLeft`, and `line` generators to render an SVG path with red strokes. Data is loaded via `csv` from a GitHub Gist, with parsed years and numeric population values. Grid lines and axis labels are styled through CSS classes applied to the SVG elements.

Bbhargavarathod

86% match

Loading thumbnail…

Fork of HTML Starter

This example demonstrates a D3.js v7 line chart that visualizes the profit trends of an automobile sales company from 1985 to 2024. The visualization uses SVG rendering with a band scale for the years on the x-axis and a linear scale for profit values (in millions) on the y-axis. Red circular points mark yearly data values with tooltips on hover, connected by a red line to emphasize trends. The chart includes labeled axes, a title, and uses the Poppins font, with margins calculated from the window dimensions for a responsive layout. The source data is fetched from a CSV file hosted on GitHub.

Ppavan vasamsetti

85% match

Loading thumbnail…

Fork of Area Chart For Car sales

This chart visualizes car sales from 2013 to 2021, combining a smooth line and a filled red area to show sales trends over time. The data is loaded from a CSV file and parsed with `d3.csv` and `d3.timeParse`. The visualization uses `d3.scaleTime` and `d3.scaleLinear` for axes, with `d3.line` and `d3.area` generators employing `d3.curveBasis` for smoothing. SVG rendering includes gridlines, axis labels, and formatted tick values using `d3.format`.

GGARIDIDEEKSHITHREDDY

85% match

Loading thumbnail…

Fork of reusable scatter

This visualization shows the trend of automobile sales in India over a ten-year period using a combined line and area chart. The chart emphasizes the sales trajectory with a smooth curve, filling the area beneath the line to highlight the magnitude of change over time. Built with D3 v5, it uses `scaleTime` and `scaleLinear` for the axes, `line` and `area` generators with `curveBasis` for smooth rendering, and parses the data from a CSV file. The SVG output includes styled axes and gridlines via `axisBottom` and `axisLeft`.

Ttejasrikotipalli1@gmail.com

85% match