Skip to main content
SimilarExport ZIP
100%

sample

✓ Published0🌍 Public
Kkandulasunny17@gmail.com
Last edited Oct 22, 2024
Created on Oct 22, 2024

This example plots sales data as a scatter plot, encoding BMI on the x-axis, age on the y-axis using a band scale, and smoker status as color via an ordinal scale with Tableau10 scheme. It loads CSV data from a GitHub repository, renders SVG circles with tooltips on mouseover, and includes axes, a legend, and labels. The code leverages D3 v6 APIs such as `d3.csv`, `scaleLinear`, `scaleBand`, `scaleOrdinal`, `axisLeft`, and `axisBottom`.

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…

Activity6_question-3

This example displays a scatter plot of car data, showing the relationship between BMI (on the x-axis) and age (on the y-axis), with points colored by smoking status via a Tableau10 ordinal color scale. The visualization loads a CSV file from a GitHub repository using D3’s `csv` function, then applies linear scales with `scaleLinear` and renders circles as SVG elements. Axes are generated with `axisLeft` and `axisBottom`, while a legend is manually constructed to map colors to the smoking categories. The chart fills the browser window using `window.innerWidth` and `window.innerHeight`.

Kkandulasunny17@gmail.com
81% match
Loading thumbnail…

Question3

This scatter plot displays sales data, plotting total sales on the x-axis against order numbers on the y-axis, with each point colored by customer using an ordinal scale with the Tableau10 scheme. It loads a CSV from GitHub using d3.csv, renders circles in an SVG, and includes axes, a legend, and interactive tooltips that show product details on hover. The visualization uses d3.scaleLinear, scaleBand, axisLeft, and axisBottom for positioning and scaling.

Kkandulasunny17@gmail.com
79% match
Loading thumbnail…

Sale Sample Data

This example presents a dark-themed bar chart titled “Sales by Product Line,” aggregating sales data from a CSV file fetched from a GitHub gist. It uses d3.js v7 APIs including `d3.csv`, `d3.rollups`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal` to group records by product line, sum their sales, sort descending, and encode values as bar heights with a Tableau10 color scheme. The SVG rendering includes rotated x-axis labels, horizontal grid lines, axis titles, and a legend, all styled via CSS custom properties.

RRamdas Dheeraj
77% match
Loading thumbnail…

Fork of Activity6_question3

This scatter plot visualizes sales data from a CSV file, showing the relationship between total sales and order number, with colors differentiating customers. It uses D3 v6's `scaleLinear`, `scaleBand`, and `scaleOrdinal` to map the data, rendering circles as SVG elements with axes, labels, a legend, and interactive tooltips that display product and sales figures on hover.

Kkandulasunny17@gmail.com
76% match
Loading thumbnail…

sample

This example displays an animated pie chart of product sales aggregated by category using d3.rollup to sum sales values from a CSV dataset. The chart renders with SVG and includes a legend, with hover interactions that enlarge arcs via dl.arc’s hoverArc and show category totals as text. The code uses d3.pie, d3.arc, and d3.scaleOrdinal with color transitions triggered by mouse events.

SSaiHarshitManda@my.unt.edu
76% match
Loading thumbnail…

question3.6

A scatter plot displays sales data from a CSV file, plotting total sales on the x-axis and order numbers on the y-axis with circles colored by customer. The visualization includes axes, a legend, and interactive tooltips showing product and sales details. It uses D3 v6 APIs including `csv`, `scaleLinear`, `scaleBand`, `scaleOrdinal`, `axisLeft`, and `axisBottom`, with SVG rendering and the Tableau10 color scheme.

Nnikhithaaitha22@gmail.com
76% match
Loading thumbnail…

Activity6_Question-3

A scatter plot maps daily sales over time, using D3.js v7 with `d3.scaleLinear` for axes and `d3.scaleOrdinal` with `d3.symbolsFill` to encode product categories as distinct point shapes. A legend, built via `d3.symbol`, lists each category. Data loads from a remote CSV file, parsed with `d3.csvParse` and `d3.timeParse`; sales figures are numeric. The chart includes labeled x- and y-axes, and points render as SVG paths within an HTML page styled by CSS.

Kkandulasunny17@gmail.com
75% match
Loading thumbnail…

question-3

This example visualizes a scatter plot of height and weight data, with points colored by category using skyblue, lightgreen, and orange. The SVG rendering uses D3 v7 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to map the data to axes and draw circles. The code loads data from a GitHub Gist URL and applies a custom parsing function to convert numeric fields. Axis labels are styled with green Times New Roman text, and the plot fills the browser window.

Aajaykumarakula00@gmail.com
75% match