ChartTooltipBase.HoverMode

Syntax

HoverMode: PP.HoverMode;

Description

The HoverMode property determines method of tooltip displaying.

Comments

Use JSON or the setHoverMode method to set the property value and the getHoverMode method to get the property value.

Example

To execute this example, the HTML page must contain the BubbleChart component named bubbleChart (see Example of Creating the BubbleChart Component). Determine new tooltip object and set a tooltip for data series with the index 0:

// Determine tooltip
var tooltip = new PP.Ui.ChartTooltip({
    HasMask: true, // Create tooltip text by template
    MaskText: "{%Name}. X: {%XValue:#,##.00}, Y: {%YValue:#,##.00}", // Tooltip template
    HoverMode: PP.HoverMode.MouseOver, // Tooltip is activated on the mouse hovering
});
// Set tooltip for the data series with the 0 index
var serie = bubbleChart.getSeries()[0];
serie.setTooltip(tooltip);

Hover the cursor over the bubble shown in the screenshot below. A tooltip with specified parameters is shown as the result:

Display the tooltip and set new position for it:

// Display tooltip
tooltip.show();
// Set new position for tooltip
tooltip.setPosition(tooltip.getTargetX() + 10, tooltip.getTargetY() + 10);

As the result tooltip position is changed:

See also:

ChartTooltipBase