0

The tooltip in a Highcharts Gantt show the start and end date of the hovered task, but I'm not able to translate the prefix used ("Start" and "End"):

tootip example

There is no options in Highcharts.lang for these text.

Christophe Le Besnerais
  • 3,895
  • 3
  • 24
  • 44

1 Answers1

0

That is caused by the default pointFormatter function:

            if (!milestone) {
                retVal += 'Start: ' + start + '<br/>';
                retVal += 'End: ' + end + '<br/>';
            } else {
                retVal += start + '<br/>';
            }

Source code: https://github.com/highcharts/highcharts/blob/master/ts/Series/Gantt/GanttSeries.ts#L116

As a solution you can implement your own pointFormatter, for example:

    tooltip: {
        pointFormatter: function() {
            var point = this,
                H = Highcharts,
                series = point.series,
                xAxis = series.xAxis,
                startOfWeek = xAxis.options.startOfWeek,
                formats = series.tooltipOptions.dateTimeLabelFormats,
                tooltip = series.chart.tooltip,
                ttOptions = series.tooltipOptions,
                format = ttOptions.xDateFormat,
                returnVal = '<b>' + (point.name || point.yCategory) + '</b>',
                start,
                end;

            if (!format) {
                format = H.splat(tooltip.getDateFormat(xAxis.closestPointRange, point.start, startOfWeek, formats))[0];
            }

            start = series.chart.time.dateFormat(format, point.start);
            end = series.chart.time.dateFormat(format, point.end);

            returnVal += '<br/>';
            returnVal += 'A1: ' + start + '<br/>';
            returnVal += 'A2: ' + end + '<br/>';

            return returnVal;
        }
    }

Live demo: https://jsfiddle.net/BlackLabel/a839yLsd/

API Reference: https://api.highcharts.com/gantt/tooltip.pointFormatter

ppotaczek
  • 36,341
  • 2
  • 14
  • 24
  • Yep that works! Note that since I'm using Typescript I had to cast `point` to `Highcharts.GanttPointOptionsObject` in order to access the `start` and `end` properties. – Christophe Le Besnerais Feb 05 '21 at 10:12