Skip to main content
SimilarExport ZIP
100%

Presentation_Task2

✓ Published0🌍 Public
Rrikhitakoganti12
Last edited Jul 25, 2023
Created on Jul 25, 2023

This visualization shows a red line chart tracking product prices from 2019 to 2023, with each year plotted as a point connected by a path. The data, loaded from a CSV file containing shopping mall transaction records, is aggregated by year. The code uses D3 v7 to create an SVG graphic, employing `d3.scaleBand` for the x-axis years, `d3.scaleLinear` for the price range, and `d3.line` to generate the path. Axes are added with `d3.axisBottom` and `d3.axisLeft`, and text labels identify the year and price dimensions.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity8_Task3_linechart

This line chart shows the cost of sales from 2000 to 2013, with each year mapped along a band scale and cost values along a linear scale. The SVG visualization draws a thick yellow polyline through the data points, which are loaded from a local CSV file. The chart uses d3.scaleBand and d3.scaleLinear for positioning, d3.axisBottom and d3.axisLeft for tick marks, and d3.line to generate the path. Axis labels are added as SVG text elements in blue.

Rrikhitakoganti12
78% match
Loading thumbnail…

Presentation_Task1

This chart displays the relationship between product quantity and price for five product categories, with each category represented by a distinct color: Clothing, Food & Beverage, Technology, Cosmetics, and Shoes. The data comes from a remote CSV file loaded via the `csv` function, and the visualization is rendered as an SVG using D3.js v5. The code uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to construct the axes, and `select` appends the chart to the body. Each data point is drawn as a circle with a fixed radius, and the color is determined by the category using a custom switch function.

Rrikhitakoganti12
78% match
Loading thumbnail…

Activity8_Task3

This visualization shows the cost of sales from 2000 to 2013 using a line chart rendered as an SVG. The code loads data from a CSV file using `d3.csv` and maps the cost values to numeric format. It uses `d3.scaleBand` for the year axis and `d3.scaleLinear` for the cost axis, with the line drawn using the `d3.line` path generator. Axis labels are styled in red with large font sizes, and the chart includes a light green stroke for the line.

Ssaikrishnabussa
77% match
Loading thumbnail…

Activity8_Task3

This visualization presents the cost of sales from 2000 to 2013 using a line chart rendered as an SVG. The code loads data from a CSV file and employs D3’s scaleBand for the x-axis and scaleLinear for the y-axis, drawing the line with d3.line. The chart includes axes, labels, and a thick light-green stroke to highlight the trend over time.

Ssaikrishnabussa
77% match
Loading thumbnail…

Presentation_task3

This pie chart visualizes the number of unique products purchased across different shopping malls, with each slice colored and labeled by product count. Built with D3 v5, the visualization uses `d3.pie` and `d3.arc` to generate segments, `d3.scaleOrdinal` for color mapping, and `d3.format` for numeric tick labels. Data is loaded from a CSV file via `d3.csv`, and the SVG rendering includes interactive legends displaying mall names and corresponding values.

Rrikhitakoganti12
77% match
Loading thumbnail…

Activity8_Task3

This example visualizes the cost of sales from 2000 to 2013 using a line chart, with the x-axis representing each year and the y-axis showing cost values. The line is rendered as a single SVG path with a lightgreen stroke, and both axis labels are styled in red with a large font. The code loads data from a local CSV file using `d3.csv`, maps the cost values to numbers, and builds the scales with `d3.scaleBand` and `d3.scaleLinear`. The SVG chart is created via `d3.select` and positioned with margins, while axes are added using `d3.axisBottom` and `d3.axisLeft`.

HHarshithaAmbilpur
76% match
Loading thumbnail…

Activity8Task3-linechart

This line chart displays the cost of sales from 2000 to 2013, with a light green stroke highlighting the trend across yearly data points. The visualization uses D3 v7 to load a CSV file via `d3.csv`, map years to a `d3.scaleBand` for the x-axis, and costs to a `d3.scaleLinear` for the y-axis. The line is drawn using `d3.line`, with red axis labels and a centered title. The SVG rendering approach is visible, with margins and axes configured for clarity.

Ssreekarthanda@gmail.com
76% match
Loading thumbnail…

Activity8_Task4

This area chart visualizes the cost of sales from 2000 to 2013, using a smooth curve to connect annual data points and a light green fill beneath the line to emphasize the trend. The visualization is built with D3 v5, employing `scaleTime` and `scaleLinear` for axes, along with `line` and `area` generators with `curveBasis` to create the smooth path. Data is loaded from a CSV via `d3.csv`, parsed into `Date` and numeric cost values, and rendered as an SVG with styled axis labels and tick marks.

Rrikhitakoganti12
76% match