Scatterplot with Voronoi

100%

Scatterplot with Voronoi

✓ Published0🌍 Public

Last edited Nov 29, 2017

Created on Nov 29, 2017

This interactive scatterplot visualizes the playing styles of Renju players based on their ratings and PCA-reduced performance metrics. Each data point represents a player, positioned by principal component coordinates and colored or grouped by whether they are human or AI. The view includes a Voronoi overlay that partitions the plot space around each point, highlighting nearest-neighbor relationships among players. The chart updates dynamically with a title, legend, and control panel, allowing users to explore patterns in playing style and rating within the context of a Voronoi diagram. Built with D3 v3, it renders in SVG with animation support.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/ZenoZero/'>ZenoZero</a>'s block: <a href='http://bl.ocks.org/ZenoZero/e48ba09c69b6ab93d7688de37feae498'>fresh block</a>

forked from <a href='http://bl.ocks.org/ZenoZero/'>ZenoZero</a>'s block: <a href='http://bl.ocks.org/ZenoZero/ca453706bbed6fe99feeb3267572868e'>fresh block</a>

forked from <a href='http://bl.ocks.org/ZenoZero/'>ZenoZero</a>'s block: <a href='http://bl.ocks.org/ZenoZero/0d376bf8525e303726151ebfe217d7a5'>fresh block</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Scatterplot with Voronoi

This example visualizes the playing styles of Renju players using a scatterplot that maps PCA results of player ratings and AI similarity scores. A Voronoi overlay partitions the plot space around each data point, and hovering reveals tooltips while clicking a player highlights their position and dims others. The page also includes a radar chart comparing three players across six AI metrics. Built with D3.js v3 and jQuery, it uses SVG for rendering and includes animated transitions when updating the plot.

ZZenoZero

97% match

Loading thumbnail…

Scatterplot with Voronoi

This scatterplot visualizes the playing styles of Renju players, using a PCA projection to position each player based on their strategic similarity to various AI opponents. The plot distinguishes between human and AI players by color, with point sizes reflecting player ratings. A Voronoi diagram partitions the space, and hovering over a cell triggers a tooltip. Users can interactively highlight a specific player by name, which enlarges the matching point and dims others. The visualization is built with D3.js (v3) and jQuery, combining a custom scatterplot module with a radar chart (by Nadieh Bremer) to compare individual players against a set of AI style metrics.

ZZenoZero

97% match

Loading thumbnail…

Scatterplot with Voronoi

This scatterplot visualizes the playing styles of Renju players, comparing humans and AIs. Each point represents a player, positioned by PCA of style similarity metrics. A Voronoi overlay partitions the space around each point, and clicking a point highlights its Voronoi cell and displays a radar chart comparing the player's style to six AI opponents. The visualization uses D3.js with SVG rendering and animation, and includes interactive controls for exploring player similarities. The chart is built with D3 v3 and includes a radar chart component (designed by Nadieh Bremer) that appears below the scatterplot to show detailed player attributes. The view also includes a legend and a title area for context. The main visualization focuses on showing the relative positions of players in a reduced dimensional space, with the Voronoi cells making proximity relationships clear.

ZZenoZero

96% match

Loading thumbnail…

Scatterplot with Voronoi

This interactive visualization compares the playing styles of Renju (Gomoku) players using a scatterplot with Voronoi tessellation, enhanced by an animated radar chart. Built with D3.js v3, it plots player style similarities to AI opponents, with a Voronoi overlay partitioning the space to highlight nearest-neighbor relationships. The scatterplot supports interactive exploration, while a separate radar chart (created by Nadieh Bremer) displays each player's multi-dimensional performance metrics across six AI axes (slowrenju, pela, whose, renjusolver, yixin, carbon). The page includes a legend, control panel, and uses Bootstrap for layout, with SVG rendering and animation to visualize strategic game playing styles.

ZZenoZero

94% match

Loading thumbnail…

Scatterplot with Voronoi

This interactive scatterplot uses a Voronoi overlay to visualize Gomoku playing styles, plotting players based on PCA-reduced coordinates derived from their game statistics. Each point represents a player, colored by whether they are a human or an AI, with their rating shown. Hovering over a Voronoi cell highlights the corresponding player and displays nearby opponents, offering a quick way to explore clusters and relationships in the data. Built with D3 v3, the visualization uses SVG and animation to create a smooth, responsive experience, with a side panel for legends and controls.

ZZenoZero

91% match

Loading thumbnail…

Scatterplot with Voronoi

This interactive scatterplot visualizes the playing styles of Gomoku players, mapping each player’s PCA-reduced strategy metrics onto a two-dimensional plane. The view is enhanced with a Voronoi overlay that partitions the space around each point, making it easy to compare nearest-neighbor relationships and identify clusters of similar playing styles. Points are colored and labeled by player, with a legend and controls for filtering. The visualization is built with D3 v3, uses SVG for rendering, and includes smooth animated transitions between states, supporting exploration of how players group by style characteristics and rating.

ZZenoZero

91% match

Loading thumbnail…

Scatterplot with Voronoi

This visualization presents the playing styles of Gomoku players, projected into a two-dimensional PCA space, and distinguishes between human players and AI opponents. The scatterplot uses Voronoi tessellation to partition the space, with each cell colored according to its associated data point. The code relies on the D3.js library (version 3) to render the SVG, and includes interactive features such as zooming and highlighting specific players by name. A separate radar chart, created with a custom `RadarChart` function, compares three players’ similarity to various AI strategies across multiple axes.

ZZenoZero

90% match

Loading thumbnail…

Scatterplot with Voronoi

This scatterplot visualizes the playing styles of Gomoku players by mapping each player’s strategic similarity to various AIs onto a two-dimensional PCA projection. The plot is accompanied by a radar chart that compares individual players’ similarity scores across multiple AI opponents. Built with D3 v3 and jQuery, the visualization uses a Voronoi tessellation for interactive hover effects and supports zooming, highlighting, and dynamic legend filtering. The code loads player data from `result_g.dat` and `result_r.dat` files.

ZZenoZero

89% match