css chart.js barplot code example

Example 1: chart js x axis data bar

data: {
    datasets: [{
        barPercentage: 0.5,
        barThickness: 6,
        maxBarThickness: 8,
        minBarLength: 2,
        data: [10, 20, 30, 40, 50, 60, 70]
    }]
};

Example 2: chartjs horizontal bar data in front

options: {
  responsive: true,
    maintainAspectRatio: false,
      hover: {
        animationDuration: 0
      },
        animation: {
          duration: 1,
            onComplete: function() {
              let chartInstance = this.chart,
                  ctx = chartInstance.ctx;

              ctx.textAlign = 'center';
              ctx.textBaseline = 'bottom';

              this.data.datasets.forEach(function(dataset, i)
                                         {
                let meta = chartInstance.controller.getDatasetMeta(i);
                meta.data.forEach(function(bar, index) {
                  let data = dataset.data[index];
                  ctx.fillText(data, bar._model.x + 15 , bar._model.y + 5);
                });
              });
            }
        }
},