title: How to compare one value to another in chartJS
body: <p>I have been working on a broadband management website.I want to show the user how much data he/she  has used.For example if the total data they have in their name is 300GB.If they have used 150GB the remaining is 150GB right?.How to do i visualize this using a doughnut chart,Using ChartJS.</p>
  
  <p>I have some code going but im not sure how to accomplish this please help me out</p>
  
  <pre><code>    var ctx = document.getElementById('myChart').getContext('2d');
  var constdata=document.getElementById("constantdata").textContent;
  var data=document.getElementById("data").textContent;
  console.log(data);
  var chart = new Chart(ctx, {
      // The type of chart we want to create
      type: 'doughnut',
  
      // The data for our dataset
      data: {
          datasets: [{
              label: 'My First dataset',
              backgroundColor: ['red','green'],
              borderColor: 'rgb(255, 99, 132)',
              data: [300,150] //300 being the total data,150 being the data used
          }]
      },
  
      // Configuration options go here
      options: {}
  </code></pre>
  
  <p>But the above code isnt working out.Assume a doughnut chart,If the used data is 150GB(out of 300).The doughnut 
  chart must be like image1(please refer image 1)</p>
  
  <p>But im getting image2(please refer image 2)</p>
  
  <p><a href="https://i.stack.imgur.com/nFTym.png" rel="nofollow noreferrer">https://i.stack.imgur.com/nFTym.png</a> //image 1</p>
  
  <p><a href="https://i.stack.imgur.com/MG99s.png" rel="nofollow noreferrer">https://i.stack.imgur.com/MG99s.png</a>   //image 2</p>