title: Chart js custom datalabel from array
body: <p>I want to put datalabels from calculated array on top of every column. Values in my array are representing how much every bar is filled with another color. I made a function which is calculating those values in percentage. Any tip what to put in datalabels formatter section?</p>
  
  <p><a href="https://i.stack.imgur.com/qVECY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qVECY.png" alt="enter image description here"></a></p>
  
  <pre><code>var data1 = ['7.8', '5', '', '', '7.7', '7.8', '8.1', '7.8'];
  var data2 = ['8', '8', '', '', '8', '8', '8', '8'];
  var percentage = [];
  
  function calculate() {
    for (let i = 0; i &lt; 8; i++) {
      percentage.push(data1[i] / data2[i] * 100)
    }
  }
  
  calculate();
  var canvas = document.getElementById('myChart');
  var data = {
    labels: ['1','2','3','4','5','6','7','8'],
    datasets: [{
      //   xAxisID: "bar-x-axis2",
      data: data1,
      backgroundColor: ['#c3cd46', '#e31c24', '#FFFFFF', '#FFFFFF', '#c3cd46', '#267533', '#267533', '#267533'],
      datalabels: {
        display: false,
      },
    }, {
      data: data2,
      //  xAxisID: "bar-x-axis1",
      datalabels: {
        display: false,
      },
      backgroundColor: ['rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)', 'rgba(61, 146, 125, 1)'],
    }, {
      data: ['', '', '', '', '', '', '', '']
    }]
  };
  var option = {
    legend: {
      display: false,
    },
    tooltips: {
      enabled: false,
    },
    scales: {
      yAxes: [{
        scaleFontSize: 40,
        scaleLabel: {
          display: true,
        },
        ticks: {
          max: 10,
          min: 0,
          stepSize: 2,
          beginAtZero: true,
          callback: function(value) {
            return value + " h"
          }
        },
      }],
      xAxes: [{
        barThickness: 15,
        stacked: true,      
      }],
    },
    plugins: {
      datalabels: {
        anchor: 'end',
        align: 'top', 
        formatter: function(context) {
  
        },      
      }
    }
  };
  
  var myBarChart = Chart.Bar(canvas, {
    data: data,
    options: option
  });
  </code></pre>
  
  <p><a href="https://jsfiddle.net/L3rb10md/76/" rel="nofollow noreferrer">https://jsfiddle.net/L3rb10md/76/</a></p>