[Chartjs]-PrimeNg bar chart how do I hide the bar labels?

by

3👍

✅

What I understand you want to hide labels from xAixs and yAxis and also want to change the width of bar line. To do all these please use below code :

<p-chart type="bar" [data]="data" [options]="options"></p-chart>

In component initialize the option for chart:

    this.option1= {
       title: {
            display: true,
            text: '% Utilization',
            position: 'left'
          },
      scales: {
          yAxes: [{
                        display: true,
                        scaleLabel: {
                            show: true,
                            labelString: 'Value'
            },
            ticks: {
              beginAtZero:true,
              max: 100,
              min: 0,
            }
                    }],
          xAxes: [{
            categoryPercentage:1,
            barPercentage:1,
            ticks: {
                display:false,
                beginAtZero:0
            }
        }]
      }
  }

To change the bar width use barThickness:4 and to hide lable use ticks property.
For more details check Chartjs Documentation

Leave a comment