Tooltip
Related Docs:
class Tooltip
| package config
Enable or disable animation of the tooltip. In slow legacy IE browsers the animation is disabled by default.
The background color or gradient for the tooltip.. .
In styled mode, the stroke width is set in the .highcharts-tooltip-box class.
The color of the tooltip border. When null, the border takes the color of the corresponding series or point.
The radius of the rounded border corners.
The pixel width of the tooltip border.. .
In styled mode, the stroke width is set in the .highcharts-tooltip-box class.
How many decimals to show for the point.change value when the series.compare option is set. This is overridable in each series' tooltip options object. The default is to preserve all decimals.
Since 2.1, the crosshair definitions are moved to the Axis object in order for a better separation from the tooltip. See xAxis.crosshair.
For series on a datetime axes, the date format in the tooltip's header will by default be guessed based on the closest data points. This member gives the default string representations used for each unit. For an overview of the replacement codes, see dateFormat.. . Defaults to:.
{. millisecond:"%A, %b %e, %H:%M:%S.%L",. second:"%A, %b %e, %H:%M:%S",. minute:"%A, %b %e, %H:%M",. hour:"%A, %b %e, %H:%M",. day:"%A, %b %e, %Y",. week:"Week from %A, %b %e, %Y",. month:"%B %Y",. year:"%Y". }
Enable or disable the tooltip.
Whether the tooltip should follow the mouse as it moves across columns, pie slices and other point types with an extent. By default it behaves this way for scatter, bubble and pie series by override in the plotOptions for those series types. .
For touch moves to behave the same way, followTouchMove must be true also.
Whether the tooltip should follow the finger as it moves on a touch device. If this is true and chart.panning is set,followTouchMove will take over one-finger touches, so the user needs to use two fingers for zooming and panning.
Callback function to format the text of the tooltip from scratch. Return false to disable tooltip for a specific point on series.
A subset of HTML is supported. The HTML of the tooltip is parsed and converted to SVG, therefore this isn't a complete HTML renderer. The following tags are supported: <b>, <strong>, <i>, <em>, <br/>, <span>. Spans can be styled with a style attribute, but only text-related CSS that is shared with SVG is handled.
Since version 2.1 the tooltip can be shared between multiple series through the shared option. The available data in the formatter differ a bit depending on whether the tooltip is shared or not. In a shared tooltip, all properties except x, which is common for all points, are kept in an array, this.points. Another feature that affects what properties are available, is dataGrouping.
Available data are: <dl> <dt>this.percentage (not shared) / this.points[i].percentage (shared)</dt>
this.point.name.this.series.name.
The HTML of the tooltip header line. Variables are enclosed by curly brackets. Available variables are point.key, series.name, series.color and other members from the point and series objects. The point.key variable contains the category name, x value or datetime string depending on the type of axis. For datetime axes, the point.key date format can be set using tooltip.xDateFormat.. .
Defaults to <span style="font-size: 10px">{point.key}</span><br/>
Padding inside the tooltip, in pixels.
The HTML of the point's line in the tooltip. Variables are enclosed by curly brackets. Available variables are point.x, point.y, point.change, series.name and series.color and other properties on the same form. Furthermore, point.y can be extended by the tooltip.valuePrefix and tooltip.valueSuffix variables. This can also be overridden for each series, which makes it a good hook for displaying units.. In styled mode, the dot is colored by a class name rather than the point color.
A callback function for formatting the HTML output for a single point in the tooltip. Like the pointFormat string, but with more flexibility.
A callback function to place the tooltip in a default position. The callback receives three parameters: labelWidth, labelHeight and point, where point contains values for plotX and plotY telling where the reference point is in the plot area. Add chart.plotLeft and chart.plotTop to get the full coordinates.. .
The return should be an object containing x and y values, for example { x: 100, y: 100 }.
Whether to apply a drop shadow to the tooltip.
The name of a symbol to use for the border around the tooltip. In Highstock 1.x, the shape was square.
When the tooltip is shared, the entire plot area will capture mouse movement or touch events. Tooltip texts for series types with ordered data (not pie, scatter, flags etc) will be shown in a single bubble. This is recommended for single series charts and for tablet/mobile optimized charts.. . See also tooltip.split, that is better suited for charts with many series, especially line-type series.
Proximity snap for graphs or single points. It defaults to 10 for mouse-powered devices and 25 for touch devices.. .
Note that in most cases the whole plot area captures the mouse movement, and in these cases tooltip.snap doesn't make sense. This applies when stickyTracking is true (default) and when the tooltip is shared or split.
Split the tooltip into one label per series, with the header close to the axis. This is recommended over shared tooltips for charts with multiple line series, generally making them easier to read.
CSS styles for the tooltip. The tooltip can also be styled through the CSS. class .highcharts-tooltip.
Use HTML to render the contents of the tooltip instead of SVG. Using HTML allows advanced formatting like tables and images in the tooltip. It is also recommended for rtl languages as it works around rtl bugs in early Firefox.
How many decimals to show in each series' y value. This is overridable in each series' tooltip options object.. The default is to preserve all decimals.
A string to prepend to each series' y value. Overridable in each series' tooltip options object.
A string to append to each series' y value. Overridable in each series' tooltip options object.
The format for the date in the tooltip header. If data grouping is used, the default is a smart guess based on how close the closest points are. It is pulled from the #plotOptions.dataGrouping.dateTimeLabelFormats array.