chart.js different x axis and tooltip format
<p>I am trying to setup a bar chart using the Charts.js v2 library.  </p>

<p>The issue i'm running into is i want to format the x axis labels differently to the tooltip labels.</p>

<p>For instance, if i have a label like "Super long label that will be trimmed" along the x axis, with the below code that would shown as "Super long label that...".</p>

<pre><code>Chart.scaleService.updateScaleDefaults('category', {
  ticks: {
    callback: function(tick) {
        var characterLimit = 20;
        if ( tick.length &gt;= characterLimit) {
            return tick.slice(0, tick.length).substring(0, characterLimit -1).trim() + '...';;
        } 
        return tick;
    }
  }
});
</code></pre>

<p>Full fiddle: <a href="https://jsfiddle.net/kvszjr7g/3/" rel="nofollow">https://jsfiddle.net/kvszjr7g/3/</a></p>

<p>This works correctly.</p>

<p>But the tooltips that are shown when you hover over the bar are also trimmed. What i would like is for the full text of the label to be shown in the tooltip.</p>

<p>I've tried to use a copy of the string in the above method, that's why i've added <code>tick.slice</code>. Whatever i've tried up to this point always effects both the x axis labels and tooltip labels.</p>

<p>I'm pretty lost at this point, what would be the best way to approach this?</p>