ice 7 scatter

100%

✓ Published0🌍 Public

Last edited Jul 3, 2022

Created on Jul 3, 2022

This scatter plot visualizes video game sales data, displaying each game as a circle positioned by sales volume and unit price, with color encoding the item category and a tooltip revealing the exact sale amount on hover. The visualization is built with the Vega-Lite API, using its `markCircle` and `encode` methods to map fields from the Iris dataset, and renders interactive tooltips through the vega-tooltip `Handler` class.

AI-generated description

Using the vegalite API to create a scatter plot on global sales of video games with tool tips to display the name of the video game when hovered upon

MIT Licensed

Similar vizzes

Loading thumbnail…

ice 7 scatter

This scatter plot visualizes global video game sales across years, with each circle representing a game and colored by genre. Hovering over a point reveals the game’s name via a tooltip. Built with Vega-Lite’s API (vl.markCircle), it encodes year and global sales on the x- and y-axes. The code uses vega-tooltip for interactivity, d3.csv to load the game sales dataset, and custom styling from a config file to adjust font sizes and axis colors.

TTejamod

93% match

Loading thumbnail…

ice 7

This example visualizes video game sales data from a CSV file, showing a scatter plot where each circle represents a game’s release year against its platform. The visualization cycles through different dimensions—marks, year, and global sales—every five seconds, updating the x-axis mapping dynamically. Built with D3.js, it uses `scaleLinear` for axes and `axisLeft`/`axisBottom` for rendering. The reusable `scatterPlot` module follows the Towards Reusable Charts pattern, with SVG circles for marks and animated transitions driven by `setInterval`.

TTejamod

85% match

Loading thumbnail…

ice 7 scatter

The visualization plots video game sales data from a CSV file, showing the relationship between sales figures and release year as animated scatter points. It cycles through different sales metrics—Global, NA, and EU—every two seconds using `setInterval`, updating the x-axis mapping via `scatterPlot()` from D3.js. The chart uses `scaleLinear` and `extent` for scales, with `axisLeft` and `axisBottom` for axes, rendered in SVG. Animated transitions between metrics reveal shifting sales distributions over time.

TTejamod

85% match

Loading thumbnail…

ICE-6 Scatter Plot 11554625

This scatter plot visualizes video game sales data from a CSV file, plotting North American sales on the x-axis against release year on the y-axis. Each circle represents a game, colored by genre using a custom `marker` function that maps genre names to specific colors (blue, yellow, or red). The visualization uses D3 v6 APIs including `csv` for data loading, `scaleLinear` for axes, and `axisLeft`/`axisBottom` for rendering scales. The SVG rendering fills the full browser window with a heading and styled tick labels.

MManohar Kowthavarapu

82% match

Loading thumbnail…

ICE-7 Scatter Plot 1

This scatter plot visualizes electronic sales data, showing the relationship between Year and Electronicsales, with points colored by Item type and tooltips revealing item names on hover. The visualization uses Vega-Lite’s API to encode quantitative fields on both axes, with zero-scaled domains for clearer trends. Data loads from a remote CSV file via d3.csv, while the chart renders in SVG using Vega’s renderer. Custom configuration adjusts axis tick colors, label font sizes, and tooltip styling to improve readability. The plot fills the entire viewport, adapting to window dimensions with a fitted autosize strategy.

SSaiSree0122

80% match

Loading thumbnail…

ICE7- Scatter plot

This interactive scatter plot visualizes global sales data for PlayStation 4 games, with each circle representing a game positioned by release year and worldwide sales. The visualization uses vega-lite-api to build the chart and d3.csv to load data from a Gist-hosted CSV file derived from the UCI Machine Learning Repository’s Auto MPG dataset. Publishers are distinguished by color, and hovering reveals the game title via vega-tooltip. The chart encodes quantitative fields for year and global sales, with a custom color encoding for the categorical publisher field.

Aanushaanumula

79% match

Loading thumbnail…

ICE7

This visualization presents a pie chart of video game sales by title, breaking down revenue across North America, Europe, and Japan. The chart uses an ordinal color scale and displays each game’s total sales and percentage in a legend. Built with D3 v5 and React, it loads CSV data and renders SVG paths using `d3.pie` and `d3.arc`, with legends and text labels positioned manually.

Ssatishnarne99@gmail.com

79% match

Loading thumbnail…

ice 7 Pie Chart

This example presents a pie chart of global video game sales, visualizing the market share of ten games as percentages of total sales. The chart uses SVG rendering with D3.js v5, fetching data from a CSV file via the `csv` function. It leverages `d3.pie` and `d3.arc` to generate segments, `scaleOrdinal` for color mapping, and custom text labels for percentages. A legend, added manually, lists game names alongside their sales figures in millions, with all values formatted using `d3.format`.

TTejamod

77% match