score:1

Accepted answer

It seems that you have a typo in your positioner function. You should use plotY insted of ploty property:

tooltip: {
    positioner: function(width, height, point) {
        return {
            x: point.plotX,
            y: point.plotY,
        }
    }
}

Live demo: http://jsfiddle.net/BlackLabel/poxv4wq1/

API Reference: https://api.highcharts.com/highcharts/tooltip.positioner

EDIT:

The positioner function return a tooltip coordinates relative to the entire chart. The values point.plotX and point.plotY are relative to the plot area, so you need to add chart.plotTop and chart.plotLeft values:

    positioner: function(width, height, point) {
        var columnWidth = this.chart.series[0].options.pointWidth;

        return {
            x: point.plotX + this.chart.plotLeft,
            y: point.plotY - columnWidth / 2 + this.chart.plotTop - height
        };
    }

Live demo: http://jsfiddle.net/BlackLabel/0cjftrsy/

score:0

ok, becouse of the label styles. The position of the toolTip is of.

This how i fixed it.

This example worked with http://jsfiddle.net/fqbkozpr/1/

 return {
        x: Math.max(point.plotX, width), // To the right.
        y: point.plotY + height, // Make sure to be under the line
      };

Related Query

More Query from same tag