Line Chart ICE 7

100%

Line Chart ICE 7

✓ Published0🌍 Public

Ddiwashhumagain@my.unt.edu

Last edited Oct 25, 2025

Created on Oct 25, 2025

A line chart depicts the Consumer Price Index (CPI) trend over time, plotting annual values from a CSV dataset. D3.js scales map years to the x-axis and CPI values to the y-axis, with a `d3.line()` generator constructing the path. The SVG rendering includes axes via `d3.axisBottom` and `d3.axisLeft`, with rotated axis labels. Data loading uses `d3.csv` with row parsing to convert strings to numbers, while the chart fills the viewport and applies the Share Tech font.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7-3 Line Chart

This line chart visualizes the monthly Consumer Price Index (CPI) from the U.S. Bureau of Labor Statistics, showing percentage changes over time on a red line plotted against a time-scaled x-axis and linear y-axis. The code uses d3.csv to load the data, then applies d3.scaleTime, d3.scaleLinear, and d3.line to generate the SVG path. Gridlines are drawn via d3.axisBottom and d3.axisLeft, with tick sizing and labels configured. The chart displays a title and axis labels, rendered in an SVG canvas with dimensions defined in the HTML.

Hhossaphul

88% match

Loading thumbnail…

Area Chart ICE 7

This area chart visualizes the Consumer Price Index (CPI) over time, using a semi-transparent steel blue fill to emphasize trends. The chart is generated with D3.js, employing `d3.area` to build the shape, `d3.scaleLinear` for the axes, and `d3.axisBottom` and `d3.axisLeft` for ticks. Data is loaded from a CSV via `d3.csv`. The SVG rendering fills the entire viewport, and axis labels use the 'Share Tech' font.

Ddiwashhumagain@my.unt.edu

86% match

Loading thumbnail…

ICE - 7 Line Chart

A line chart displays annual sales over time, with a single thick maroon line tracing the trend. The visualization uses D3 v5 to load CSV data via `d3.csv`, parse dates with `d3.timeParse`, and construct scales with `scaleTime` and `scaleLinear`. Axes are generated using `axisBottom` and `axisLeft`, while the line path is created with the `d3.line` generator. The SVG rendering includes labeled axes and gridlines, with data sourced from a GitHub gist.

Nnehabaddam

84% match

Loading thumbnail…

Line Chart-ICE7

This line chart shows the price of Amazon stock over time from a CSV file. The x-axis represents the year, using a time scale, and the y-axis shows price values on a linear scale. The visualization is rendered as an SVG using D3 v5, with axes drawn via `d3.axisBottom` and `d3.axisLeft`, and the data line generated with `d3.line`. Grid lines are created via tick marks, and the chart includes labeled axes and a title.

KKiran Jyothi Bodduluri-11604571

83% match

Loading thumbnail…

ICE-7 Line chart

This line chart displays yearly run totals from a CSV file, using a blue line to show the trend over time. The D3 v5 code leverages `scaleTime` and `scaleLinear` to map data to axes, `axisBottom` and `axisLeft` for tick marks, and a `line` generator to create the path. The SVG is rendered with a grid and labeled axes, with data loaded via D3's `csv` function.

LLG0498

83% match

Loading thumbnail…

ICE-7-4 Area Chart1

This area chart displays the U.S. Monthly Consumer Price Index (CPI) over time, with the shaded region emphasizing the trend and magnitude of inflation. The visualization uses D3 v5’s `scaleTime`, `scaleLinear`, `area`, and `curveBasis` to generate a smooth, filled path. Axes are created with `axisBottom` and `axisLeft`, and data is loaded via `csv` from a provided URL. The SVG rendering includes labeled axes and a title, with the area fill styled in maroon.

Hhossaphul

82% match

Loading thumbnail…

ICE-7-Line Chart

This line chart visualizes the cost of living from 2000 to 2013, with the x-axis representing years and the y-axis showing cost values. The chart is rendered as an SVG using D3 v5, with the `scaleTime` and `scaleLinear` functions defining the axes, and the `line` generator creating the path. Data is loaded from a CSV file hosted on GitHub, and the chart includes axis labels, a title, and styled gridlines via the `axisLeft` and `axisBottom` components.

AAli Shah Solanki

82% match

Loading thumbnail…

ICE-7 line chart

This line chart displays the price (USD) of grocery items from an ICE-6 CSV dataset, using D3.js v7 with SVG rendering. It maps item names on the x-axis and price values on the y-axis, scaling the linear y-axis with `d3.scaleLinear` and `d3.max` for the domain. A categorical band scale (`d3.scaleBand`) positions items, and x-axis labels appear at the band centers. The chart is created by loading external CSV data via `d3.csv`, parsing numeric columns, and generating a path with `d3.line` while adding axes and labels through `d3.axisBottom`, `d3.axisLeft`, and SVG text elements.

UUday Kiran

81% match