Skip to content

Tooltip positioner limitations #9930

@joshkel

Description

@joshkel

Feature Proposal

Extend tooltip positioners' behavior:

  • Make the Chart object available to positioners so that they can see the chart area - as a third parameter?
  • Allow the positioner's return object to optionally include xAlign and yAlign, overriding any other values for those options.
  • Document Tooltip.options, in the TypeScript types and possibly sample code.

Feature Use Case

I'm experimenting with placing tooltips in the corner of the chart area, instead of next to the cursor, so that I can include additional information without cluttering wherever the mouse is. I tried using a custom positioner to do this, but I ran into a few problems:

  • The positioner doesn't seem to have a clean way of accessing the chart area, to know what the corner of the chart area is.
  • I'd like to position on the top right corner or the bottom right corner, depending where the mouse cursor is - in other words, I'd like to use yAlign: "top" for the top and yAlign: "bottom" for the bottom. However, the positioner can only return x, y coordinates; it can't return xAlign and yAlign.
  • I may want to be able to customize the positioner's behavior based on the current tooltip options. I see where a positioner can access this.options, but I'm not certain if that's intended. (For example, the TypeScript type definitions and JSDoc don't seem to document Tooltip.options.)

See https://codesandbox.io/s/chartjs-tooltip-positioner-yytcq?file=/src/index.js for a hackish prototype of a "corner" positioner, with comments on how the feature proposal would help.

(I realize I could bypass a lot of this with external tooltips. I'd like to use a positioner instead, but if I should be using external tooltips, I can live with that.)

Possible Implementation

I can submit a PR if this seems reasonable.

Thanks!

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions