Skip to main content
100%

Scatter Plot

✓ Published1🌍 Public
Hhquazza@gmail.com
Last edited Feb 14, 2025
Created on Feb 14, 2025

This scatter plot visualizes country data by plotting total cost on the x-axis against total profit on the y-axis, with each point representing a sales record. Hovering a circle changes its fill to orange and displays a tooltip with the country, cost, and profit values, implemented using `d3.select` and event handlers. The chart uses `d3.csv` to load remote data, `d3.scaleLinear` for axes, and `d3.axisBottom` and `d3.axisLeft` to render scales. Data points are drawn as SVG circles via the `join` operator, with a legend title styled using a CSS class.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

Added content = d3.csv (line 3)

Tooltip - create in html, add details in json See line 13 and line 44+ in js file;

MIT Licensed

Similar vizzes