Powers Scatterplot with Veroni (Character Show Me)
A scatterplot of Marvel character attributes uses Voronoi tessellation for interactive hover targeting. Users select X and Y axes from six power metrics (Strength, Intelligence, Speed, Durability, Power, Combat) via dropdown menus, while a character selector highlights a specific hero in yellow with full opacity. Points are sized by each character’s Total stat, colored by alignment (green for good, dark red for bad, grey for neutral), and animated with `transition.attr` for radius growth and position changes. The code uses d3-scale, d3-axis, d3-transition, and d3.Delaunay to compute the Voronoi cells for tooltip display. Data comes from a CSV of Marvel characters.
AI-generated descriptionPowers Scatterplot for Marvel Data
Data from: https://gist.github.com/LeahMitchell/8ad46fbcac8d7420bcd5b97b1a245f43#file-readme-md
Code References:
Veroni Graph: https://bl.ocks.org/Fil/f49b5cf943a0210212994aa5860ac4a8
https://observablehq.com/@didoesdigital/9-may-2020-d3-scatterplot-with-voronoi-tooltips
Tool Tip:
https://www.d3-graph-gallery.com/graph/interactivity_tooltip.html
https://chartio.com/resources/tutorials/how-to-show-data-on-mouseover-in-d3js/