observablehq / observablehq/plot

Offset for tips

Open
#2,024 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
HTML
Stars
5.4k
Forks
244
PR merge metrics
No merged PRs in 30d

Description

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

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

No files or tests are named in the issue. Start by tracing tooltip positioning and the handling of anchor, dx, and dy; done means supporting a dynamic offset that remains correct as the tooltip anchor changes, with coverage for movement in each direction.

Written by the indexing model from the issue text.

Assessment

Domain
data-visualization
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.