title: Chart.js - How To Show Value of Label as Percent of X and Y Values - Currently Always 100%
body: <p>I am using Chart.js along with a Chart.js plugin, chart-labels. I am wanting to show the labels at the top of the bar chart, and in the label show the percentage of the x value in relation to the y value (e.g., 16 is 94% of 17), but the label values are always 100% (which it seems like it is calculating 16y by 16x = 100).</p>
  
  <p>I haven't found a way to do this without the plugin, so I'm not sure if the plugin is the issue or not, or if the chart configuration is wrong.</p>
  
  <p>Any advice/help is appreciated! Here is a JSBin with the code: <a href="https://jsbin.com/dawenetuya/edit?html,js,output" rel="nofollow noreferrer">https://jsbin.com/dawenetuya/edit?html,js,output</a></p>
  
  <p>HTML and JS:</p>
  
  <pre><code>&lt;div style="width: 100%;"&gt;&lt;canvas id="myChart"&gt;&lt;/canvas&gt;&lt;/div&gt;
  
  var colors = '#cd1127';
  var ctx = document.getElementById("myChart");
  var myChart = new Chart(ctx, {
          type: 'bar',
          data: {
                  labels: ["Asset Taxes", "Excluded Assets", "Personal Injury and Property Damage", "Offsite Disposal", "Royalties", "Litigation", "Employment", "Operating Expenses"],
                  datasets: [{
                          data: [16, 14, 17, 13, 15, 12, 9, 11],
                          backgroundColor: '#cd1127',
                          borderColor: '#cd1127',
                          borderWidth: 1
                  }]
          },
          options: {
              responsive: true,
              legend: {
                  display: false
              },
              scales: {
                  yAxes: [{
                      ticks: {
                          min: 0,
                          max: 18,
                          beginAtZero:true
                      }
                  }]
              },
              plugins: {
                  labels: {
                      render: 'percentage',
                      showActualPercentages: true
                  }
              }
          }
  });
  </code></pre>
  
  <p>Here's a screenshot illustrating what I'm going for:
  <a href="https://i.stack.imgur.com/4gtJi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4gtJi.png" alt="Figure 1: All labels showing 100% instead of actual value"></a></p>