Google图表 - 格式化vAxis而不是逗号

时间:2017-08-31 13:09:00

标签: javascript jquery charts formatting google-visualization

如何在google图表中格式化vAxis,以使用点而不是逗号显示垂直比例。 示例(现在):100,000 示例(然后):100.000

我知道诀窍是'格式'功能,但我不能像我想的那样工作。

我正在尝试将其格式化为:

vAxis: {minValue:0, format:'##.##'}

2 个答案:

答案 0 :(得分:1)

如果format选项不符合您的需求, 您可以使用ticks选项提供自定义标签

使用对象表示法,您可以同时提供...

v: - 轴的值
f: - 标签的格式化值

{v: 100000, f: '100.000'}

请参阅以下工作代码段

使用NumberFormat类,尝试创建格式
(不确定到底需要什么)

数据表方法getColumnRange用于查找y轴的范围

循环构建轴标签的每个刻度......

google.charts.load('current', {
  callback: drawChart,
  packages: ['corechart']
});

function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('number', 'x');
  data.addColumn('number', 'y0');
  data.addRows([
    [0, 500000],
    [1, 500000],
    [2, 200000],
    [3, 700000],
    [4, 400000]
  ]);

  var formatNumber = new google.visualization.NumberFormat({
    groupingSymbol: '.',
    fractionDigits: 0
  });

  var ticksY = [];
  var yRange = data.getColumnRange(1);
  for (var i = 0; i <= yRange.max; i=i+100000) {
    ticksY.push({
      v: i,
      f: formatNumber.formatValue(i)
    });
  }

  var options = {
    vAxis: {
      ticks: ticksY
    }
  };

  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>

答案 1 :(得分:0)

试试这个:

vAxis.format:{format:'##.##'}