Remove empty space in between hAxis on Google Charts

Question

I have a "vertical" material designed bar chart that receives values like this:

[1, 10],
[580, 12],
[10000, 1]

So it renders the xAxis like this:

Is there any way for me to remove the empty values of the hAxis and just leave the numbers that have values (i.e. 5000, 10000 and the smaller ones).

Answer 1

try using string values for the x-axis, instead of numbers...

['1', 10],
['580', 12],
['10000', 1]

see following working snippet...

google.charts.load('current', {
  packages:['bar']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    ['1', 10],
    ['580', 12],
    ['10000', 1]
  ], true);

  var options = {
    bars: 'vertical',
    chart: {
      title: 'Number of payments by amount',
    },
    hAxis: {
      title: 'Amount'
    }
  };

  var chart = new google.charts.Bar(document.getElementById('chart'));
  chart.draw(data, google.charts.Bar.convertOptions(options));
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart"></div>