Tool tips in Highcharts are enabled by the tooltip.enabled Boolean option, which is true by default. In Highcharts 4, the default shape of the tooltip box has been changed to callout. The following shows the new style of tooltip:

For the older style of tooltip shape, we can set the tooltip.shape option to square, which we will use in the following exercises.

Tooltip's content formats are flexible, which can be defined via a callback handler or in the HTML style. We will continue from the example in the previous section. As the chart is packed with multiple lines and columns, we can first enable the crosshair tool tip to help us align the data points onto the axes. The crosshairs configuration can take either a Boolean value to activate the feature or an object style for the crosshair line style. The following is the code snippet to set up crosshairs with an array of x- and y-axis configurations for the gray color and dash line styles:

            tooltip : {
              ...