Styling the tooltips

Tooltips in Highcharts are enabled by the boolean option tooltip.enabled, which is true by default. Their content formats are flexible, which can be defined via a callback handler or in HTML style. We will continue from the example in the previous section. As the chart is packed with multiple lines and columns, first we can enable the crosshair tooltip for helping 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 : {
                crosshairs: [{
                     color: '#5D5D5D',
                     dashStyle: 'dash',
                     width: 2
                }, {
                     color: '#5D5D5D',
                     dashStyle: 'dash',
                     width: 2
  ...