title: Where do chart.js positioners go for tooltips to move downward
body: <p>I am wanting to move the tooltip downwards a few pixels instead of always at the top of each stack (on stacked bar chart).</p>
  
  <p>I found this in the <a href="https://www.chartjs.org/docs/latest/configuration/tooltip.html#position-modes" rel="nofollow noreferrer">docs</a> about <code>positioners</code>, but I cannot understand the structure of code and where it should actually go.</p>
  
  <pre><code>    Chart.Tooltip.positioners.custom = function(elements, eventPosition) {
          var tooltip = this;
  
          return {
              x: 0,
              y: -50
          };
      }
  </code></pre>
  
  <p>For reference, you can see where I've tried to place it <a href="https://jsfiddle.net/1ez0Lo8a/7/" rel="nofollow noreferrer">here</a> ( not much wonder why its not working )</p>
  
  <p><a href="https://www.chartjs.org/docs/latest/configuration/tooltip.html#tooltip-configuration" rel="nofollow noreferrer">Config</a> seems to have a <code>position</code> and <code>yPadding</code>, neither of which seem to have effect I want when I put them in the tooltips options:</p>
  
  <pre><code>tooltips: {
              yAlign: 'top',
              position: 'nearest',
              yPadding: 50
  }
  </code></pre>
  
  <p><code>yPadding</code> distorts the tooltip, I'm not sure why but it muddles up the caret and box.</p>