Claude mostly agrees with me [0], although it did suggest signal strength and blast radius (presumably as a map overlay) as possibilities. I guess those would ideally have a logarithmic alpha, fading towards the edge of the circle.
It did suggest some other novel rendering options for z-axis that might be worth exploring separately.
[0] https://claude.ai/share/7564a18b-ff42-438c-9db2-aa35db29432b
Originally posted by @mbrookes in #22683 (comment)
Claude output
Color saturation or hue
Encode z as color intensity instead of (or in addition to) size. Useful when you have four variables — x, y, size, and a categorical or continuous color dimension. Common in genomics (scatter plots where dot color = expression level, size = confidence).
Opacity/transparency
Z mapped to alpha. Used in density-aware plots where overlapping points need to visually "fade out" lower-confidence or lower-weight observations. Useful in financial data (trade volume as transparency).
Border/stroke thickness
Z encoded as the ring width of a hollow circle. Niche, but used in network node visualizations where the inner fill carries one variable and the outer stroke carries another.
Shape distortion (aspect ratio)
Stretching a circle into an ellipse where eccentricity encodes z. Rare, but appears in meteorological charts and some geospatial tools to encode directionality or anisotropic spread.
Animation frame / time
Z treated as a temporal dimension driving animation (the Hans Rosling Gapminder approach). Not a static encoding at all — z becomes the playback axis.
TODO
Is see two categories
same scales but for different features
The first options (Color saturation or hue / Opacity/transparency / Border/stroke thickness) are a variant of the exisinting zAxis.
We named them color and size because it's their default impact on the scatter chart. But the size one is just a way to generate a (number) => number scale function
So it could be reused by custom scatter renderer to impelemnt the edge case described.
Because they are fairly niche cases, I suggest we introduce a demo about how to create them but to not include them in the library. to avoid the performance/bundle size impacts for a usecase that is about less than 0.1% of the users
different New features
Those requires additional internals to be implemented
- Allow rendering ellipses in the scatter charts
- Support time animation in scatter charts
Claude mostly agrees with me [0], although it did suggest signal strength and blast radius (presumably as a map overlay) as possibilities. I guess those would ideally have a logarithmic alpha, fading towards the edge of the circle.
It did suggest some other novel rendering options for z-axis that might be worth exploring separately.
[0] https://claude.ai/share/7564a18b-ff42-438c-9db2-aa35db29432b
Originally posted by @mbrookes in #22683 (comment)
Claude output
Color saturation or hue
Encode z as color intensity instead of (or in addition to) size. Useful when you have four variables — x, y, size, and a categorical or continuous color dimension. Common in genomics (scatter plots where dot color = expression level, size = confidence).
Opacity/transparency
Z mapped to alpha. Used in density-aware plots where overlapping points need to visually "fade out" lower-confidence or lower-weight observations. Useful in financial data (trade volume as transparency).
Border/stroke thickness
Z encoded as the ring width of a hollow circle. Niche, but used in network node visualizations where the inner fill carries one variable and the outer stroke carries another.
Shape distortion (aspect ratio)
Stretching a circle into an ellipse where eccentricity encodes z. Rare, but appears in meteorological charts and some geospatial tools to encode directionality or anisotropic spread.
Animation frame / time
Z treated as a temporal dimension driving animation (the Hans Rosling Gapminder approach). Not a static encoding at all — z becomes the playback axis.
TODO
Is see two categories
same scales but for different features
The first options (Color saturation or hue / Opacity/transparency / Border/stroke thickness) are a variant of the exisinting zAxis.
We named them color and size because it's their default impact on the scatter chart. But the size one is just a way to generate a
(number) => numberscale functionSo it could be reused by custom scatter renderer to impelemnt the edge case described.
Because they are fairly niche cases, I suggest we introduce a demo about how to create them but to not include them in the library. to avoid the performance/bundle size impacts for a usecase that is about less than 0.1% of the users
different New features
Those requires additional internals to be implemented