Change Vertical Line and Color bar chart in bar chart.js

0πŸ‘

βœ…

Working Demo: https://jsfiddle.net/usmanmunir/hz3gLj19/3/

Try this code:

let datas_1 = [97,70,87,43,35,18];
let colorHex_1 = ['#ebeef3', '#ebeef3', '#ebeef3', '#ebeef3', '#ebeef3', '#ebeef3'];
let labels_1 = ['10λŒ€', '12λŒ€', '30λŒ€', '40λŒ€', '50λŒ€', '60λŒ€μ΄μƒ'];

var ctx = document.getElementById("myChart");

var myBarChart = new Chart(ctx, {
  type: 'horizontalBar',
  data: {
    datasets: [{
      data: datas_1,
      backgroundColor: colorHex_1,
      borderWidth: 0,
      barPercentage: 1,
    }],
    labels: labels_1,
  },
  options: {
    responsive: true,
    legend: {
      display: false,
    },
    scales: {
      xAxes: [{
        display: false,
      }],
      yAxes: [{
        gridLines: {
          display: false,
        },
        maxBarThickness: 20,
      }]
    }
  }
});

Hope this helps.

Leave a comment