Skip to main content
SimilarExport ZIP
100%

Saiteja_ICE_6_Line Chart

✓ Published0🌍 Public
Ssaitejak1619@gmail.com
Last edited Mar 7, 2026
Created on Mar 7, 2026
Forked from D3 Starter

This multi-series line chart displays monthly trends in screen time, sleep hours, and productivity by aggregating daily records from the digital usage dataset into monthly averages. Three colored lines, generated with d3.line and scaled using d3.scaleTime and d3.scaleLinear, allow direct comparison of how these behavioral metrics change over time. The SVG chart includes gridlines, labeled axes, a legend, and uses d3.rollup to compute monthly means from the CSV data before rendering.

AI-generated description

This chart shows monthly trends in screen time, sleep hours, and productivity using aggregated averages from the digital usage dataset. It allows comparison of how these behavioral metrics change over time and highlights differences among the three variables.

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE_7_Line Chart

This line chart visualizes monthly average screen time from a digital usage dataset, with each point representing the mean daily screen time for that month. The chart includes labeled axes, styled tick marks, and hover tooltips for data inspection. Built with D3 v7, it loads data from a CSV file, parses dates with `d3.timeParse`, groups entries by month using `d3.rollup`, and renders axes via `d3.axisBottom` and `d3.axisLeft`. An SVG canvas with a white background and drop shadow presents the final visualization.

Ssaitejak1619@gmail.com
85% match
Loading thumbnail…

Saiteja_ICE_6_Combined Chart (Bar + Line)

This combined bar and line chart displays monthly average notifications as light-blue bars on a left axis, with the average productivity score overlaid as an orange line on a right axis, facilitating comparison between the two metrics across time. The visualization aggregates daily records from a digital usage dataset by month using `d3.rollup` and `d3.timeMonth.floor`, then renders the result in SVG with D3 v7’s `scaleBand`, `scaleLinear`, `axisLeft`, and `line` generator.

Ssaitejak1619@gmail.com
84% match
Loading thumbnail…

ICE_7_Area Chart

This area chart visualizes the average monthly screen time from a digital usage dataset. Using D3.js v7, the example groups daily records by month, calculates mean hours, and renders a smooth area with axes, gridlines, and interactive tooltips. Data is loaded as CSV from a GitHub gist, with dates parsed and scales computed via `d3.scaleTime` and `d3.scaleLinear`. The SVG output includes rotated month labels and labeled axes for clarity.

Ssaitejak1619@gmail.com
79% match
Loading thumbnail…

Saiteja_ICE5

This visualization summarizes a 150-row CSV dataset of simulated digital behavior records, showing key performance indicators like average app usage time and sleep hours in a left-hand card. An adjacent SVG bar chart, built with D3.js v7, displays the distribution of social media platforms using aggregated frequency counts. The page loads the remote CSV via JavaScript’s `fetch()`, parses it with `d3.csvParse`, and computes rollups with `d3.rollups`. A scrollable preview table shows the first eight rows to verify parsing.

Ssaitejak1619@gmail.com
79% match
Loading thumbnail…

Line chart - ICE 7

This line chart visualizes monthly Sales, Profit, and Expenses across 160 data points, using three distinct colored lines with circular markers to highlight each metric. Rendered as an SVG using D3 v7, the chart employs a point scale for the x-axis and a linear scale for the y-axis, with axes labeled and tick text rotated for readability. Data is loaded from a CSV file via d3.csv, and tooltips are provided through SVG title elements appended to the markers. A legend identifies the three series, which show linear growth trends throughout the months.

GGuntupalli Mohan kalyan
77% match
Loading thumbnail…

ICE 7 LINE CHART

This line chart visualizes the relationship between age and sleep hours using five data points. The SVG rendering relies on d3.line to generate the path, with d3.scaleLinear mapping the age and sleep domains to pixel coordinates. Axes are added via d3.axisBottom and d3.axisLeft. The chart applies a steelblue stroke to the line and includes margins for layout.

Bbhargavinalamothu@gmail.com
77% match
Loading thumbnail…

ice 6 multi_series

This multi-series chart tracks Sales, Revenue, and Profit trends for daily business metrics from January to July 2024. It overlays three colored lines on a time-based x-axis, with a combined bar chart highlighting selected sales data points. The visualization uses D3.v7 to render SVG elements, employing `d3.scaleTime` for the date axis, `d3.scaleLinear` for the value axis, and `d3.line` for drawing the series paths. An interactive legend identifies each metric, and the chart includes axis labels for clarity.

HHarshithaDontha@my.unt.edu
75% match
Loading thumbnail…

ICE- 7 Line Chart

This line chart shows the relationship between study hours and average total marks, with a single line tracing how marks change as study time increases. The chart uses D3.js v7 to load CSV data from a GitHub gist and render an SVG visualization, employing `d3.line()` to generate the path and `d3.scaleLinear()` for both the x- and y-axes. The data, which includes fields for StudyHours and AverageTotalMarks, is fetched asynchronously via `d3.csv()` and converted to numeric values before plotting. Axes are appended using `d3.axisBottom()` and `d3.axisLeft()`, with the line styled as a steelblue stroke without markers.

Cchalasanigayaetiri@gmail.com
75% match