Google图表 - 放置自定义格式化轴值

时间:2018-06-15 18:23:45

标签: charts google-visualization

我有一些数字数据(例如“1,2,3,4,5 ......”),我想根据它建立一个图表。但是,我想将其他文本显示为轴值,而不是原始数字。

例如,我想显示“一个”

而不是数字“1”

这可以用于谷歌图表吗?

1 个答案:

答案 0 :(得分:2)

使用对象表示法,您可以为每个刻度提供值(v:)和格式化值(f:

{v: 1, f: 'one'}

请参阅以下工作代码段...

google.charts.load('current', {
  packages: ['corechart']
}).then(function () {
  var data = google.visualization.arrayToDataTable([
    [1, 1],
    [2, 2],
    [3, 3],
    [4, 4],
    [5, 5]
  ], true);

  var options = {
    hAxis: {
      ticks: [
        {v: 1, f: 'one'},
        {v: 2, f: 'two'},
        {v: 3, f: 'three'},
        {v: 4, f: 'four'},
        {v: 5, f: 'five'}
      ]
    }
  };

  var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
  chart.draw(data, options);
});
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>