javascript - 轴的数字格式 - Google Gauge

标签 javascript google-visualization

我正在尝试更改谷歌仪表轴的数字格式。默认情况下,轴值是一个整数(例如 0、120),但我想显示一个 £ 符号和格式为货币(例如 £0、£120)。我已经能够使用 NumberFormat 更改仪表底部显示的值的格式,但不能应用于仪表的其余部分。

基本仪表的代码如下:

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
<script type="text/javascript">
  google.charts.load('current', {'packages':['gauge']});
  google.charts.setOnLoadCallback(drawChart);

  function drawChart() {

        var data1 = google.visualization.arrayToDataTable([
          ['Label', 'Value'],
          ['Spend', 80],
        ]);
        var options1 = {
          width: 500, height: 300
        };

        // change number format to £
        var formatter = new google.visualization.NumberFormat(
        {pattern: '£###,###'});
        formatter.format(data1, 1);

        var chart = new google.visualization.Gauge(document.getElementById('chart_div1'));
        chart.draw(data1, options1);

  }
</script>
</head>

<body>
 <div id="chart_div1"></div>
</body>
</html>

如何在仪表外侧的数字上添加一个 £ 符号?谢谢。

最佳答案

您可以向 majorTicks 提供一个字符串数组来指定您自己的......

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

function drawChart() {
    var data1 = google.visualization.arrayToDataTable([
      ['Label', 'Value'],
      ['Spend', 80],
    ]);
    var options1 = {
      width: 500, height: 300,
      majorTicks: [
        '£0', '', '', '', '£100'
      ]
    };

    // change number format to £
    var formatter = new google.visualization.NumberFormat({
      pattern: '£###,###'
    });
    formatter.format(data1, 1);

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

关于javascript - 轴的数字格式 - Google Gauge,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35154091/

相关文章:

javascript - 谷歌图表中的水平间隔?

javascript - Google Charts BarChart OnClick 或 OnSelect

使用 RegEx 数组进行 JavaScript 字符串测试

Javascript 函数调试 - 为什么这个过滤器函数不能正常工作?

javascript - 如何使用jscodeshift在文件开头插入一行

java - 如何在 google api 图表的堆积柱形图中使用条形底部的注释显示轴值?

javascript - 如何在 Google 图表上定位十字线?

javascript - 是否可以向柱形图中的一个 google-chart 栏添加多个标签?

javascript - 错误 [ERR_REQUIRE_ESM] : require() of ES Module while using SSR (Inertiajs)

javascript - 更改数组项的子元素(语法)