Legend

About

A Tooltip object shows data values as you hover on the chart. You can add/remove it by setting its visible property. Other properties let you customize its appearance.

Properties

The following properties can be set:

Property Definition Type Default
visible Tooltip's visibility Boolean true
textStyle Tooltip text's style TextStyle { color: 'black', fontSize: 12, fontWeight: 'normal', fontFamily: 'system-ui, "Segoe UI", Roboto, "Helvetica Neue", sans-serif"'}
rectStyle Tooltip container's style RectStyle { cornerRadius: 0, stroke: 'black', strokeWidth: 1, strokeDashArray: 'none', fill: 'white'}

Example

In the examples below we show a default tooltip and then a tooltip with some styling.

 
                    
                        chart.layout.tooltip = {
                            rectStyle: {
                                cornerRadius: 5,
                                fill: 'lightblue',
                                stroke: 'blue'
                            },
                            textStyle: {
                                color: 'blue'
                            }
                        };

Comments

Contents