Skip to main content
SimilarExport ZIP
100%

Fork of Assignment 7 Multi-Line Time Series Plot

✓ Published0🌍 Public
NNita
Last edited Mar 30, 2024
Created on Mar 30, 2024

This fork of Assignment 7 displays a multi-line time series plot using D3 v6 with SVG rendering. The visualization plots fruit and vegetable price data from an external CSV URL over time, with each line representing a different product category. The code sets up a 600x600 SVG canvas with specified margins, uses `d3.csv` to load the dataset from a GitHub raw URL, and incorporates the d3-legend library for potential legend functionality. The implementation translates the main graph group within the SVG and positions it with explicit coordinates.

AI-generated description

CS 360 Assignment 7 Time Series With

Annie Huynh

CSV URL:https://raw.githubusercontent.com/Ahuynh111/gist-practice/main/fvPrices.csv

Note: Different data set from previous assignments

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Assignment 7 Multi-Line Time Series Plot

This example shows a multi-line time series of average prices for four gourd varieties (bottle, bitter, smooth, and snake gourd) in Nepal, with each commodity rendered as a distinct colored line over time. The chart uses d3.csv to load data from a GitHub raw CSV file, d3.group to organize the data by commodity, and d3.legendColor to display a color legend. Axes are drawn with d3.axisBottom and d3.axisLeft, while the lines are generated using d3.line within an SVG rendering.

CCurran Kelleher
80% match
Loading thumbnail…

Fork of Fork of ice7_2

This example shows a line chart of revenue aggregated by product category from a CSV dataset. D3.js (v7) loads the data, rolls up categories, and sums their revenue. It renders an SVG with axes, a steelblue polyline, and orange data points. The code uses `d3.scalePoint`, `d3.scaleLinear`, `d3.axisBottom`, `d3.axisLeft`, and `d3.line` to draw the visualization.

Kkanaparthieshitha@gmail.com
79% match
Loading thumbnail…

assignment-2 fork

This static pie chart shows the distribution of fruit quantities. The visualization is rendered as an SVG, with each slice labeled by its corresponding fruit name. The code loads data from a CSV file hosted on a GitHub gist using `d3.csv`. It employs `d3.pie` to compute the arc segments, `d3.arc` for the path geometry, and `d3.scaleOrdinal` with `d3.schemeCategory10` for coloring. The chart is centered within a 600x400 SVG canvas, with a title placed above the plot.

GGanesh Raju Yadav
79% match
Loading thumbnail…

Fork of Fork of Fork of Reusable D3 Scatter Plot

This fork of a reusable D3 scatter plot displays sales data over time, with a line connecting red circular markers on a steelblue stroke. The code uses the D3.js v6 API, including `d3.csv`, `d3.scaleLinear`, `d3.extent`, `d3.axisBottom`, `d3.axisLeft`, and `d3.line`, to load CSV data and render an SVG. It includes axis labels and a custom Share Tech font. A separate `scatterPlot.js` module defines a reusable chart function with setters for configuration.

HHariniPotla@my.unt.edu
78% match
Loading thumbnail…

Fork of Fork of assignment 7 PieChart

This dashboard displays four coordinated D3 v7 charts from a 200-row CSV dataset: a scatter plot of units sold versus profit colored by region, a pie chart of revenue distribution across regions, a line chart of monthly revenue trends, and an area chart of cumulative monthly revenue. Each visualization uses SVG rendering with scales, axes, and color encoding via `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.pie`, `d3.arc`, and `d3.rollups` for aggregation. The interactive layout includes grid lines and legends within styled chart sections.

Sshyamraghav12@gmail.com
78% match
Loading thumbnail…

Fork of Assignment-2

This interactive SVG pie chart visualizes the distribution of fish species from a CSV file fetched from a GitHub gist. D3 groups the data by species to calculate counts, then uses `d3.pie` and `d3.arc` to render the chart with tooltips on hover. A legend displays species names and counts, color-coded via `d3.scaleOrdinal`.

Bbhavyasrireddy267@gmail.com
78% match
Loading thumbnail…

Fork of Fork of HTML Starter

This example presents a health data visualization comprising three charts: a bar chart of Var1, a line chart showing Var2 over time, and a pie chart of Var3. It loads CSV data from a GitHub gist and uses D3.js v7 to render SVG elements. The bar chart maps data points to horizontal bars, the line chart uses scales and a line generator to plot the time series, and the pie chart uses `d3.rollups` to aggregate categories. The code includes axes and margin conventions for the line chart.

Aakhilakura@my.unt.edu
78% match
Loading thumbnail…

Fork of Fork of D3 Starter

This visualization presents daily sales, revenue, and profit trends from a CSV dataset across two SVG charts. The first chart displays three overlaid time-series lines for each metric, with colored dots for each data point. The second combines bars for sales with a line for profit, using hover-triggered tooltips for interactivity. Built with D3 v7, it uses `d3.csv` for data loading, `d3.scaleTime` and `d3.scaleLinear` for axes, and `d3.line` for path generation. Gridlines, axis labels, and a legend support readability.

Ssainishanthreddyk@gmail.com
78% match