[Chartjs]-Chartjs tooltip anchor point position on bar charts

by

4👍

✅

New modes can be defined by adding functions to the Chart.Tooltip.positioners map.
You can create your custom postitioning like in the Doc of chartjs:

    Chart.Tooltip.positioners.custom = function(elements, eventPosition) {
    /** @type {Chart.Tooltip} */
    var tooltip = this;

    /* ... */

    return {
        x: eventPosition.x,
        y: eventPosition.y
    };
}

you need to set your custom function into your options when rendering your chart:

tooltips: { 
            position : 'custom',   //<-- important same name as your function above      
            callbacks: {
              label: function(tooltipItem, data) {
               var label = Math.floor(tooltipItem.yLabel*100)/100+" "+data.datasets[tooltipItem.datasetIndex].label;
               return label;
              }
            }
          }

Look my full Fiddle example.

Leave a comment