title: How to show percentage (%) in chart js
body: <p>I want to show a percentage sign in the chart.I take data from my database from controller and show the data from vue js file.Here is my chart code.</p>
  
  <pre><code>&lt;script&gt;
  import { Doughnut } from 'vue-chartjs';
  
  export default {
      props:['appurl'],
      extends: Doughnut,
      data(){
          return{
              item:[],
          }
      },
      mounted() {
          this.getData();
      },
      methods:{
          setChartLoader: function(e) {
              this.$emit('setChartLoader', e);
          },
          renderDoughnutChart(serviceName,serviceData){
              this.renderChart({
                  datasets: [{
                      data: serviceData,
                      backgroundColor: [
                          'rgba(41, 121, 255, 1)',
                          'rgba(38, 198, 218, 1)',
                          'rgba(138, 178, 248, 1)',
                          'rgba(255, 100, 200, 1)',
                          'rgba(116, 96, 238, 1)',
                          'rgba(215, 119, 74, 1)',
                          'rgba(173, 92, 210, 1)',
                          'rgba(255, 159, 64, 1)',
                          'rgba(247, 247, 247, 1)',
                          'rgba(227, 247, 227, 1)',
                      ],
                  }],
  
                  // These labels appear in the legend and in the tooltips when hovering different arcs
                  labels: serviceName,
              }, {responsive: true, maintainAspectRatio: false, cutoutPercentage: 80})
          },
          getData(){
              axios.get(this.appurl+'/dashboardgetdatadoughnut').then(response =&gt; {
                  this.item = response.data;
                  this.setChartLoader(false);
                  this.renderDoughnutChart(this.item.serviceName,this.item.serviceCount)
              }).then(function(){
  
              });
          }
      },
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>Here is my controller</p>
  
  <pre><code>public function doughnutData()
  {
      $serviceNameArray = array();
      $serviceConfirmed = DB::table('bookings')-&gt;whereDate('booking_date', date('Y-m-d'))
          -&gt;select('status',DB::raw('round(count(*) *100 / (select count(*) from bookings WHERE booking_date = curdate())) as count'))
          -&gt;groupBy('status')-&gt;get();
  
      $serviceCount = array();
  
      foreach($serviceConfirmed as $name)
      {
          array_push($serviceNameArray,$name-&gt;status);
          array_push($serviceCount,$name-&gt;count);
      }
  
      return ['serviceName'=&gt;$serviceNameArray,
          'serviceCount'=&gt;$serviceCount];
  }
  </code></pre>
  
  <p>I want to show 67% in the chart but i can not show the % sign</p>
  
  <p><a href="https://i.stack.imgur.com/QKYEN.png" rel="noreferrer"><img src="https://i.stack.imgur.com/QKYEN.png" alt="enter image description here"></a></p>