Question

我一直试图找到详细解答。但没有运气，所以也许你们可以帮助我。

所以我正在使用Google Scripts构建此图表。我使用这个在Index.html文件中构建了图表。

google.visualization.ColumnChart();

所以我收集了数据，并创建了一个数据表。

var dataTable = new google.visualization.DataTable();
    dataTable.addColumn('date', 'Week');
    dataTable.addColumn('number', 'Build');
    dataTable.addColumn('number', 'GP');

同样将这些选项添加到我的图表中。

var options = {'title':'Production',
                   'width':1366,
                   'height':768,
                   'vAxis': {'format': 'currency'}
                   };

图表显示出奇妙！但我有一个小问题。值保存在＆＃34;数字＆＃34;数据类型实际上是货币值。但不是在工具提示中表示，而是像常规数字一样表示。它们没有逗号分隔，没有小数点，特别是没有美元符号。这是我所谈论的Screenshot。如何将这些特定自定义添加到工具提示中。有什么想法吗？

谢谢你们先进的帮助！

此致
Sicariuxs

Answer 1

Google提供了number formatter

在这里，我使用格式化程序格式化数据第二列中的数字这样可以正确显示工具提示。

我还在垂直轴的图表选项中提供了一种格式，它与格式化程序分开。

angular.module('Y', [
  'ngRoute',
  'mobile-angular-ui',
  'Y.controllers.Main'
])

.config(function($routeProvider) {
  $routeProvider.when('/', {templateUrl:'home.html',  reloadOnSearch: false})
                .when('/cityPage', {templateUrl:'cityPage.html',  reloadOnSearch: false})
                .when('/category-prduct', {templateUrl:'category-prduct.html',  reloadOnSearch: false})
                .when('/product-description', {templateUrl:'product-description.html',  reloadOnSearch: false})
                .when('/my-winni', {templateUrl:'my-winni.html',  reloadOnSearch: false})
                .when('/gift-box', {templateUrl:'gift-box.html',  reloadOnSearch: false});
});

google.load('visualization', '1', {'packages': ['corechart'], 'callback': drawChart});

function drawChart() {
  var data = new google.visualization.DataTable();
  data.addColumn('string', 'Department');
  data.addColumn('number', 'Revenues');
  data.addRows([
    ['Shoes', 10700],
    ['Sports', -15400],
    ['Toys', 12500],
    ['Electronics', -2100],
    ['Food', 22600],
    ['Art', 1100]
  ]);

  var chart = new google.visualization.ColumnChart(document.getElementById('numberformat_div'));

  // create number formatter
  var formatter = new google.visualization.NumberFormat({
    prefix: '$',
    negativeParens: true
  });

  // format data in second column
  formatter.format(data, 1);

  chart.draw(data, {
    vAxis: {
      format: '$#,##0.00;($#,##0.00)'
    }
  });
}

Answer 2

您需要自定义工具提示字符串并自行格式化字符串以将其显示为货币。以下是如何做到这一点：

Number.prototype.formatMoney = function(c, d, t){
var n = this, 
    c = isNaN(c = Math.abs(c)) ? 2 : c, 
    d = d == undefined ? "." : d, 
    t = t == undefined ? "," : t, 
    s = n < 0 ? "-" : "", 
    i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "", 
    j = (j = i.length) > 3 ? j % 3 : 0;
   return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
 };

然后，只需将参数传递给工具提示并使用formatMoney函数，即 build_amount.formatMoney(2)

如何使用Google Scripts更改工具提示中的数字格式

2 个答案: