Saketh Sara ICE-7

100%

Saketh Sara ICE-7

✓ Published0🌍 Public

Last edited Oct 26, 2025

Created on Oct 26, 2025

This example shows a reusable scatter plot of sales versus profit for ten product categories, with each point colored steelblue and annotated with tooltips. The visualization is rendered as an SVG using D3 v7, employing `d3.scaleLinear` for axes and `d3.axisBottom`/`d3.axisLeft` for ticks. Data is loaded asynchronously from a local CSV file via `d3.csv`. The chart is wrapped in a custom `scatterPlot` function that accepts configuration options, demonstrating a modular approach for reuse.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-7 SAKETH SARA

This scatter plot displays the relationship between sales and profit for a set of products. The visualization maps sales values along the horizontal axis and profit along the vertical axis using d3.scaleLinear and d3.axisBottom/axisLeft. Data is loaded asynchronously from a CSV file via d3.csv with d3.autoType. Each product is rendered as an SVG circle with fill color #2563eb, and hovering reveals a custom tooltip showing the product name, sales, and profit values.

Ssarasaketh3@gmail.com

90% match

Loading thumbnail…

ICE 7

This example shows a reusable D3 scatter plot of product sales versus profit, with each circle representing an item and axes scaled to the data. It fetches CSV data from a GitHub Gist, falling back to embedded data if the request fails. The visualization is built with `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom`, and drawn as SVG circles. The plot is sized to the window and styled with the Share Tech font, using a minimal, full-screen layout.

Ssarasaketh3@gmail.com

86% match

Loading thumbnail…

ICE7-ScatterPlot

This example shows a reusable scatter plot of monthly e-scooter sales versus profit from an external CSV file, using an SVG rendering approach. The chart maps sales to the x-axis and profit to the y-axis with labeled axes, and displays steel-blue circles for each data point. The code uses d3.csv for data loading and d3.scaleLinear for scales, while the reusable chart function chainably configures dimensions, margins, and value accessors. The visualization is built with D3 v7 and rendered into a pre-existing SVG element.

LLokesh

83% match

Loading thumbnail…

LINE CHART - ICE 7 SAKETH SARA

This line chart compares sales and profit values across a series of products. It uses D3 v7 to load a CSV file, map the data to points, and render two smooth monotone lines in blue and green, with circular markers for each product. The SVG visualization includes rotated category labels, horizontal grid lines, a legend, and interactive tooltips that appear on hover. The chart uses `d3.csv` with `d3.autoType`, `d3.scalePoint`, and `d3.axisBottom` to construct the axes and visual encoding.

Ssarasaketh3@gmail.com

83% match

Loading thumbnail…

ICE7-Reusable storesales

This interactive scatterplot animates sales and profit data from a storesales CSV dataset, cycling through four axis configurations via `setInterval`. The visualization uses D3 v6 APIs including `scatterPlot`, `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` for data loading, with SVG rendering. Data points are colored by category—Furniture, Office Supplies, and Technology—using hardcoded color markers, while a legend and rotating axis labels update dynamically. The reusable scatterplot module accepts configurable accessors for x/y values, margins, and radius, demonstrating a modular approach to animated data exploration.

AAnanyaSamala

82% match

Loading thumbnail…

ICE7

This interactive scatter plot visualizes the relationship between sales and profit using a cleaned sales dataset loaded via D3’s `csv` method. It uses `d3.scaleLinear` for both axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and renders circles with SVG. A custom tooltip displays category, sales, and profit values on mouseover. The chart includes axis labels and a title, with data cleaning applied to handle formatting and invalid entries.

Ssrinathkarumuru@my.unt.edu

82% match

Loading thumbnail…

ICE7 - Scatter Plot

A reusable scatter plot built with D3.js 6.7.0 visualizes sales, profit, and discount data from a remote CSV file. The plot displays circles for each data point, with axes and labels, and each circle is rendered with a white stroke and black fill. Every two seconds, the plot cycles the x-axis between the Profit, Discount, and Sales columns, updating the axis labels and re-rendering the points accordingly. The implementation uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` for scaling and axis generation.

Kkuraakhila9@gmail.com

82% match

Loading thumbnail…

Ice7Q1

This interactive scatter plot visualizes Microsoft sales data, plotting revenue against profit for different product categories and scaling each point’s radius by order count. Hovering reveals a tooltip with category, revenue, and profit details. Built with D3.js v3, it uses `d3.svg.axis`, linear scales, and `d3.scale.category10` for coloring. Data loads from an external CSV file, and the chart is rendered as an SVG with mouseover transitions controlling tooltip opacity. The reusable `scatterPlot` function configures dimensions, margins, and accessor functions.

Ssrujana reddy

81% match