删除 Google Charts 上 hAxis 之间的空白答案

【问题标题】：Remove empty space in between hAxis on Google Charts删除 Google Charts 上 hAxis 之间的空白
【发布时间】：2020-08-13 07:53:29
【问题描述】：

我有一个“垂直”材料设计的条形图，它接收如下值：

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

所以它像这样渲染 xAxis：

我有什么办法可以删除 hAxis 的空值，只留下有值的数字（即 5000、10000 和更小的数字）。

【问题讨论】：

您是否尝试过使用hAxis.logScale = true 的对数刻度？
是的，变化不大。当它是 VERTICAL 条形图材料时 - 确切地被认为是 hAxis？
hAxis 应该始终是水平的（从左到右），vAxis 应该始终是垂直的（从下到上）
您在这里尝试做什么有点不清楚。如果数据点差异很大，这样的格式总会有差距。

标签： javascript charts google-visualization google-developer-tools google-barchart

【解决方案1】：

尝试在 x 轴上使用字符串值，而不是数字...

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

请参阅以下工作 sn-p...

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>

【讨论】：