search

observablehq / plot

A concise API for exploratory data visualization implementing a layered grammar of graphics
https://observablehq.com/plot/
ISC License
4.25k stars 173 forks source link

Offset for tips #2024

Open spandl opened 5 months ago

spandl commented 5 months ago

By default, Plot positions tooltips automatically, changing the anchor so that the tooltip always remains within the canvas.

The tooltip is always positioned in the center of the element it is attached to. In some cases, it is desired that the position of the tooltip has an offset. However, because the anchor is changing depending where the tooltip is rendered, offset values dy and dx can't be used statically, as this value would need to be positive, negative or 0 depending on the anchor position.

The example below illustrates how the tooltip is overlapping the text of a data point. In some cases the tooltip would need to be moved up/down or left / right.

An additional parameter dOffset would be handy for dynamic positioning.

The parameters anchor and dy/dx can't be functions, therefor it is impossible to adjust these values at the moment.

image

mbostock commented 2 months ago

This reminds me of CSS’s margin-block and margin-inline, which are logical directions that depend on the orientation of text.

Would it be sufficient to just have a single offset that depends on the tip orientation? That feels easy to do.