tooltipTemplate equivalent in Chart.js 2.0 ?

Can’t find anything on this. What I want to do is to show percentages in the pie chart. Below worked in Chart.js 1.0

    this.chart = new Chart(ctx, {
        type: 'pie',
        animateRotate: true,
        responsive: true,
        animationEasing: "easeOut",
        animationSteps: 40,
        tooltipTemplate: " <%%=label%%>: <%%= value %%> - <%%= numeral(circumference / 6.283).format('(0[.][00]%%)') %%>",
        data: topBrowsers
    });

skarmklipp 2016-04-22 12 24 16

Author: Fantashit

1 thought on “tooltipTemplate equivalent in Chart.js 2.0 ?

  1. @etimberg thanks for the swift response! I’ll try that out!

    Edit:

    Noticed that it should be tooltips instead of tooltip

    {
      tooltips: {
        callbacks: {
          // tooltipItem is an object containing some information about the item that this label is for (item that will show in tooltip). 
          // data : the chart data item containing all of the datasets
          label: function(tooltipItem, data) {
            // Return string from this function. You know the datasetIndex and the data index from the tooltip item. You could compute the percentage here and attach it to the string.
          }
        }
      }
    }

    Complete example

      this.chart = new Chart(ctx, {
          type: 'pie',
          options: {
              tooltips: {
                  callbacks: {
                      label: function(tooltipItem, data) {
                          var value = data.datasets[0].data[tooltipItem.index];
                          var label = data.labels[tooltipItem.index];
                          var percentage = Math.round(value / totalSessions * 100);
                          return label + ' ' + percentage + '%%';
                      }
                  }
              },
          },
          data: topBrowsers
      });

Comments are closed.