phlppchrtn

@phlppchrtn·2 public vizzes

Sequential scale

This example visualizes a color scale applied to a series of circles along a horizontal axis, showing how a sequential color interpolator maps numeric values to colors. The circles are positioned using a linear scale, while their fill colors are determined by `d3.scaleSequential` with the `d3.interpolatePlasma` interpolator. The code uses D3 v4 to bind an array of data values to SVG circles, rendering them within an SVG container. The visualization demonstrates the smooth gradient transitions of the plasma color scheme across the range of input values.

Apr 14, 2020

Loading thumbnail…

Let'Test selection D3 !

This example demonstrates how D3 selections manage the lifecycle of SVG circles through enter, update, and exit phases. Randomly generated data from a custom `data` function initially renders five blue circles, which are then updated to grey with a fixed radius of 11. The code explicitly uses `d3.select('svg')`, `.selectAll('circle')`, `.data()`, `.enter()`, `.exit()`, and `.remove()` while applying chained attribute and style modifications. Although an update with ten circles exists, it remains commented out, so only the initial static rendering is visible.

Apr 9, 2020