Icons on the side of a scatter plot
Eight colored dot icons sit in a vertical strip on the left edge of a scatter plot, each linked by a connector line to a corresponding circle arranged in a vertical line at the center of the chart. A button labeled “MOVE” triggers a `d3.transition` that animates the circles from the centered, one-dimensional arrangement into a two-dimensional scatter plot with random x and y coordinates, while the icons remain fixed as a legend. The visualization uses D3 v4 with SVG elements, including markers for arrowheads, and demonstrates how a categorical axis can be represented by icons placed perpendicular to the plot’s main axes.
AI-generated descriptionBuilt with blockbuilder.org
forked from <a href='http://bl.ocks.org/GitNoise/'>GitNoise</a>'s block: <a href='http://bl.ocks.org/GitNoise/11a3f12671b2d7d99a8536bf4f26076b'>2 axis to 1 axis and back again!</a>
forked from <a href='http://bl.ocks.org/GitNoise/'>GitNoise</a>'s block: <a href='http://bl.ocks.org/GitNoise/41635bc3766d5fefd900629a14cc0be8'>Icons on the side of a scatter plot</a>