ICE-7 Sanjana Line Chart

100%

ICE-7 Sanjana Line Chart

✓ Published0🌍 Public

Last edited Mar 29, 2026

Created on Mar 29, 2026

This line chart tracks cumulative song popularity for the top four singers over time, revealing how each artist’s total popularity grows across released years. The code filters a CSV dataset using `d3.rollups` and `d3.groups`, then sorts by singer and computes running sums of popularity. It renders with D3 v7’s `d3.line`, `d3.scaleLinear`, and `d3.axisBottom`/`axisLeft`, applying `curveMonotoneX` for smooth paths and a color legend via `d3.scaleOrdinal`. The SVG is drawn inside a fixed 800×500 canvas.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 Sanjana Area Chart

This stacked area chart visualizes the cumulative popularity of the top four music artists across years, using data from a songs CSV file. Built with D3.js, it employs `d3.stack()` to layer cumulative values and `d3.area()` with a step-after curve to render each singer’s contribution. The chart includes axes, labels, and an HTML legend, with colors mapping to artists via `d3.scaleOrdinal`. Data is aggregated in `index.js` before rendering through an SVG canvas.

Mmynedisanjana@gmail.com

89% match

Loading thumbnail…

ICE-7 Pie Chart

This pie chart visualizes the distribution of song streams across the top six singers from a CSV dataset, showing each singer’s share as a labeled slice with percentages for segments larger than 10%. The visualization is built with D3.js v7, using `d3.pie` and `d3.arc` to generate the slices, `d3.rollups` to aggregate stream counts by singer, and `d3.scaleOrdinal` with `schemeCategory10` for coloring. A legend on the right lists all singers with their exact percentage shares, while the SVG renders in a white rounded container.

Mmynedisanjana@gmail.com

81% match

Loading thumbnail…

ICE-7 Resusable Scatter Plot

This scatter plot visualizes song performance by comparing streams against popularity, with each point colored by singer and displayed on a reusable scatter plot component built with D3 v7. The visualization uses `d3.scaleLinear` for both axes, `d3.scaleOrdinal` with `d3.schemeCategory10` for color encoding, and `d3.axisBottom`/`d3.axisLeft` for axis rendering. Data loads from an external CSV file containing song attributes, and the reusable `scatterPlot` function manages SVG rendering, including axis labels and a categorical legend. The chart is designed with margins to accommodate labels and legend placement.

Mmynedisanjana@gmail.com

78% match

Loading thumbnail…

ICE-7 Resusable Pie Chart

This reusable scatter plot, titled "Song Performance Analysis," visualizes the relationship between a song's number of streams and its popularity score. Each circle represents a song, positioned by the linear scales from `d3.scaleLinear()`, with color assigned to the singer using the ordinal color scheme from `d3.scaleOrdinal`. The code loads a songs.csv dataset from a GitHub gist, converts numeric fields, and renders the chart in SVG. It constructs the visualization by merging axes, labels, and a categorical legend, all within a reusable `scatterPlot` function that accepts data and dimension parameters.

Mmynedisanjana@gmail.com

76% match

Loading thumbnail…

ICE 7 LINE CHART - SAKETH SARA

This line chart displays music revenue from 2015 to 2022, plotting seven data points with a red line and white-stroked dots on a fixed 750×420 SVG canvas. The visualization uses D3 v7 to map year values to x- and y-coordinates, with light gray grid lines and labeled axes. An interactive tooltip appears on hover, showing the exact revenue for each point. The chart is rendered as scalable vector graphics, with styling controlled through a separate CSS file.

Ssarasaketh3@gmail.com

75% match

Loading thumbnail…

ICE 6 -1

This visualization displays the average popularity of songs across different genres, sorted from highest to lowest. The code uses D3 v7 to load CSV data, roll up the dataset with `d3.rollups`, and compute mean popularity per genre. Bar heights are mapped with `d3.scaleBand` and `d3.scaleLinear`, rendered as SVG rectangles, with axes from `d3.axisBottom` and `d3.axisLeft`. The chart is titled and rendered entirely in SVG.

Ssakethpapareddy@gmail.com

72% match

Loading thumbnail…

ICE 7 - Line Chart

This line chart visualizes the total daily streams of the song “Shape of You” on Spotify throughout 2017, with the y-axis scaled in millions for readability. The red polyline shows the trend over time, supported by a time-based x-axis and numeric y-axis with gridlines. Built with D3 v7 in a React context, the code loads a CSV dataset, parses dates using `d3.timeParse`, and renders axes and the line via SVG paths. Gridlines are generated using `d3.axisBottom` and `d3.axisLeft` with custom tick formatting.

DDaniel Mata

72% match

Loading thumbnail…

ICE7-Line-Sivani

A line chart displays health scores across years from 2019 to 2023, with a steelblue line connecting red circular markers for each data point. The visualization uses D3.js v7 with an SVG rendering approach, employing `d3.scaleLinear` for both axes, `d3.line` to generate the path, and `d3.axisBottom`/`d3.axisLeft` for tick marks. Data is loaded asynchronously from a local CSV file via `d3.csv`, with the x-axis formatted as integers and axes labeled "Year" and "Health Score".

Ssivaniammisetti2002@gmail.com

71% match