Scatter Plot

100%

✓ Published1🌍 Public

Last edited Jul 13, 2020

Created on Jul 13, 2020

A scatter plot displays the total earnings of the top six Dota 2 teams, encoding each team’s name on the y-axis and its earnings on the x-axis. Circles are sized to half the bandwidth of the categorical scale. Built with d3.csv, d3.scaleLinear, and d3.scaleBand, the chart uses axes created via d3.axisLeft and d3.axisBottom, and renders SVG circles with formatting via d3.format.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Customizing Axes

A horizontal bar chart displays the top six Dota 2 teams by earnings, using custom tick formatting that abbreviates large numbers with an “s” prefix and then converts “G” to “B” to show values in billions. The chart removes axis domains and gridlines from the y-axis while adding a custom axis label and title. It uses d3.csv, d3.scaleLinear, d3.scaleBand, d3.axisLeft, and d3.axisBottom, rendering as SVG. The data comes from a local CSV file with team names and earnings.

PPushkov Fedor

81% match

Loading thumbnail…

Scatter Plot in D3

This scatter plot visualizes the maximum number of players for various games by year from 2004 to 2008, using data loaded from a CSV file. Circles represent each data point, positioned via `d3.scaleLinear` for the x-axis and `d3.scalePoint` for the y-axis, with axes generated by `d3.axisBottom` and `d3.axisLeft`. The SVG rendering includes labeled axes, grid lines, and a title, all styled with CSS. The code uses D3 v7’s modular imports and follows a tutorial by Curran Kelleher.

SSimon Hackbert

71% match

Loading thumbnail…

Making a Scatter Plot

A scatter plot displays final power scores for ten teams, with each team’s score plotted along the x-axis and team names along the y-axis. The chart uses a linear scale for scores and a point scale for categorical team labels, with grid lines extending from both axes. D3 v5’s `csv`, `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom` methods render the SVG, while styled circles, a title, and an axis label clarify the data.

HHirsh Gupta

71% match

Loading thumbnail…

Company Data Scatter Plot

This scatter plot visualizes company data, showing the relationship between the number of employees and revenue, with the market value encoded by the size and color of each circle. The visualization uses D3 v6 APIs including `d3.csv`, `d3.scaleLinear`, `d3.scaleSqrt`, `d3.extent`, `d3.axisBottom`, and `d3.axisLeft`. Data is loaded from a remote CSV file, rendered as SVG circles on a linear scale for both axes, with a square-root scale determining the circle radius. The plot uses colorful circles colored via `d3.scaleOrdinal` with the `d3.schemeCategory10` palette.

Bbogasamudramvamsikrishnareddy

71% match

Loading thumbnail…

Making a Bar Chart

This example shows a horizontal bar chart comparing esports teams by their total earnings, using a CSV dataset loaded from `data.csv`. The visualization renders as SVG, with each team represented by a steelblue rectangle sized according to its earnings value. The code imports specific D3 v5 modules—`csv`, `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom`—to parse the data, map earnings to a linear x-scale and team names to a banded y-scale, and generate the corresponding axes. Margins and an inner plotting area are defined to position the chart within a 960×500 SVG canvas.

PPushkov Fedor

71% match

Loading thumbnail…

Scatter Plot

A scatter plot displays individual data points positioned by two numeric variables, with each point rendered as a small circle. The visualization uses D3.js v6 and is built with a simple SVG container. The code applies the `d3.scaleLinear` function to map x- and y-values to pixel coordinates, then appends `circle` elements to the chart area. Axes are generated with `d3.axisBottom` and `d3.axisLeft`. The data is loaded from an external CSV file using `d3.csv`, and the plot updates dynamically once the data is parsed.

JJames Huang

70% match

Loading thumbnail…

D3 Scatter plot

This scatter plot visualizes the global sales of top-rated video games from 2016, with each game represented as a circular point. The data, loaded from a local CSV file, maps game names along the x-axis and their sales figures in millions along the y-axis. The visualization is built with D3 v6, using functions like `d3.scaleBand` and `d3.scaleLinear` to manage the axes, while `d3.select`, `d3.append`, and `d3.axisBottom` handle the SVG element creation and axis rendering. Each dot is positioned using the computed scales, and steelblue fill distinguishes the data points.

KKwasi Acquaye

69% match

Loading thumbnail…

Scatter Plot

A scatter plot ranks the top ten countries by their all-time Olympic medal counts, with circles positioned along a linear scale for medal totals and a categorical axis for country names. The visualization uses D3 v5 APIs including `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom` to construct the SVG chart, with data loaded from a CSV file. Grid lines extend across the plotting area, and the title highlights the dataset's focus on Olympic medal hauls.

Ssriramvsharma

69% match