Tooltip
Learn about chart tooltips and how to customize their trigger, appearance, and content.
Tooltips provide additional information when hovering over data points or chart areas. You can control how they are triggered, how smoothly they follow the mouse, and how their content is formatted.
Direct settings
These are the input fields shown directly in the Tooltip panel:
| Setting | Description |
|---|---|
| Id | A text field to set a unique identifier for the tooltip element |
| Trigger | Choose how the tooltip is activated: Item triggers the tooltip when an individual data item (bar, pie slice, point, etc.) is hovered; Axis triggers the tooltip based on the mouse position relative to an axis, useful for comparing values across multiple series at the same axis position |
| Transition | The time in seconds that the tooltip takes to follow the mouse. Higher values create a smoother, more animated movement; lower values make it snap instantly to the cursor |
| Padding | The space in pixels between the tooltip text and the edge of the tooltip box. Larger values create more breathing room inside the tooltip |
| Compose Text | Opens the Compose Text dialog to customize the tooltip content with dynamic placeholders for data values and formatting options |
Sections
Expandable sub-panels with additional styling options:
| Section | Description |
|---|---|
| Background | Opens the Background shared setting to style the tooltip background area — background color, border color, and border width |
| Axis Pointer | Opens the Axis Pointer sub-panel to configure the indicator line that follows the mouse along an axis |
| Text Style | Opens the Text Style shared setting to customize the tooltip text — overflow behavior, width, height, font, text border, and text shadow |
Axis Pointer
The axis pointer adds a visual indicator (such as a line or crosshair) that follows the mouse position along an axis, helping users read values more precisely. Configure its type, target axis, and appearance.
| Setting / Subsection | Description |
|---|---|
| Type | Choose the pointer style: Line (a single line along the axis), Shadow (a shaded band along the axis), Cross (both horizontal and vertical lines crossing at the cursor), or None (no pointer indicator) |
| Axis | Choose which axis the pointer follows: Horizontal Axis, Vertical Axis, Radial Axis, or Angle Axis |
| Label | Opens the Label shared setting to customize the text that appears alongside the axis pointer |
| Horizontal Line Style | Opens the Line Style shared setting to customize the appearance of the horizontal pointer line — color, width, type, and shadow |
| Vertical Line Style | Opens the Line Style shared setting to customize the appearance of the vertical pointer line — color, width, type, and shadow |
| Shadow Style | Opens the Shadow shared setting to add and style a drop shadow for the shadow-type pointer |