Scatter Chart Example

100%

Scatter Chart Example

✓ Published0🌍 Public

Last edited Mar 23, 2023

Created on Mar 23, 2023

This scatter chart plots North American video game sales against European sales, with each point representing a video game title. The chart uses dark blue, semi-transparent markers to visualize the relationship between the two regional markets. Built with Plotly's JavaScript library, the visualization loads data from a CSV file containing video game sales figures, then extracts the NA_Sales and EU_Sales columns to create the scatter plot. The chart includes labeled axes and a title, with the Plotly.newPlot function handling the rendering.

AI-generated description

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

Similar vizzes

Loading thumbnail…

scatter-plot

This scatter plot visualizes video game sales, comparing NA_Sales on the x-axis against EU_Sales on the y-axis, with each circle’s color representing a different game publisher or developer. The visualization uses d3.csv to load the dataset, d3.scaleLinear to map data values to pixel coordinates, and d3.axisLeft and d3.axisBottom to render the axes. Circles are drawn as SVG elements within a React framework, with their fill color determined by a switch statement that assigns distinct colors to known studios and a default brown for others. The chart also includes axis labels for the variables plotted.

SSheela2930

86% match

Loading thumbnail…

3D Scatter plot graph

This 3D scatter plot visualizes video game sales data, comparing North American and Japanese sales figures across different game titles and release years. The example uses Plotly's JavaScript API to render two interactive three-dimensional traces: one for North American sales and one for Japanese sales, with sales values plotted on the z-axis, years on the y-axis, and game names on the x-axis. The code loads the dataset using the `d3.csv` function from the D3 library and constructs the chart with `Plotly.newPlot`, styling markers with custom colors, sizes, and opacity settings.

Aadapavaishnavi12

85% match

Loading thumbnail…

3D Scatter plot graph

This example visualizes video game sales data in a 3D scatter plot, comparing North American and Japanese sales across different years and game titles. The code uses Plotly.js to render the scatter3d traces, with two marker series distinguished by color: one for North America and one for Japan. Data is loaded from a CSV file using D3.js’s `d3.csv` function, and the `unpack` helper maps specific columns to the x, y, and z axes. The chart is embedded in an HTML div and styled with a brief CSS file.

Aadapavaishnavi12

85% match

Loading thumbnail…

Bonus ice scatter

This 3D scatter plot visualizes video game sales data, showing Global Sales on the x-axis, Year on the y-axis, and Regional Sales on the z-axis. Two traces distinguish North American and European sales as separate scatter point sets. The visualization uses Plotly’s `scatter3d` type within `Plotly.newPlot`, with data loaded via D3’s `d3.csv` from a GitHub-hosted CSV file. Axis titles and fonts are configured through the layout’s scene object, and marker styling includes adjustable sizes, colors, and opacity levels.

TTejamod

84% match

Loading thumbnail…

A Scatter Plot

This scatter plot visualizes video game sales across regions, showing each game’s release year on the x-axis and its sales figures on the y-axis, with points colored by genre. A dropdown menu lets viewers switch between regional and global sales attributes. The visualization uses React with D3 v6 scales (`scaleTime`, `scaleLinear`, `scaleOrdinal`) and SVG rendering. Hovering over the color legend filters the displayed points by genre, while a native SVG `<title>` element provides tooltips on each circle. Data comes from a Kaggle dataset of video game sales.

RRED98310

83% match

Loading thumbnail…

Fork of scatter-plot

This scatter plot visualizes global video game sales data, comparing North American and European sales on the x- and y-axes while mapping Japanese and global sales to point radius dimensions. The visualization uses D3 v6’s `csv` loader, `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` functions, rendering circles as SVG elements. Point colors are determined by the game’s publisher, with a custom `marker()` function that assigns distinct colors to specific developers like Ubisoft Montreal and Rockstar North, while defaulting to brown for others. The chart includes axis labels and a title, with styling applied via CSS.

Aajaysonu

82% match

Loading thumbnail…

Fork of BONUS 1: 3D Scatter Plot

This 3D scatter plot visualizes video game sales data, showing the relationship between North American, European, and other regional sales as points in three-dimensional space. Each marker represents a game, with its position determined by the sales figures on the x, y, and z axes. The visualization uses Plotly's `Plotly.newPlot` method and `scatter3d` trace type, while D3.js is employed to load and parse the CSV data from a GitHub Gist. The layout configures axis titles with green font styling, and markers are rendered as translucent circles with red color and borders.

Ppemmasaniprudhvinadh

81% match

Loading thumbnail…

Fork of Scatter Plot For > 5 million Video Game Sales

A scatter plot displays video game sales across global, NA, EU, JP, and other regions, filtering to titles with over five million in global sales. Using D3 v6, it renders animated SVG circles that transition when users switch axes via dropdown menus built with a custom menu component. The reusable chart uses `selection.join` and `transition` from D3, with data loaded from a GitHub Gist CSV file.

PPeter Cordone

80% match