Question

有没有办法在Google Charts中指定小数点分隔符？

默认情况下，它似乎是基于语言环境，但我需要的是让小数点分隔符为＆＃34; dot＆＃34;而不是某些语言环境的逗号（我的用户所在的语言环境中，逗号为十进制分隔符是默认值，但被认为是过时的/过时的）

这适用于从轴标签到工具提示的所有数字。其余的语言环境选项将保持不变。

Answer 1

Google Visualization API提供formatters，可用于重新格式化可视化中的数据

根据NumberFormat：

描述如何格式化数字列。格式化选项包括指定前缀符号（如美元符号）或标点符号用作数千个标记。

以下示例演示了如何将格式化程序应用于Salary列，以便使用.符号（decimalSymbol和groupingSymbol NumberFormat属性来呈现其值对象用于此目的）

＆＃13;

google.load("visualization", "1", { packages: ["table"] });
google.setOnLoadCallback(drawChart);

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('number', 'Salary');
    data.addColumn('boolean', 'Full Time');
    data.addRows(5);
    data.setCell(0, 0, 'John');
    data.setCell(0, 1, 10000);
    data.setCell(0, 2, true);
    data.setCell(1, 0, 'Mary');
    data.setCell(1, 1, 25000);
    data.setCell(1, 2, true);
    data.setCell(2, 0, 'Steve');
    data.setCell(2, 1, 8000);
    data.setCell(2, 2, false);
    data.setCell(3, 0, 'Ellen');
    data.setCell(3, 1, 20000);
    data.setCell(3, 2, true);
    data.setCell(4, 0, 'Mike');
    data.setCell(4, 1, 12000);
    data.setCell(4, 2, false);

    var formatter = new google.visualization.NumberFormat({ prefix: '$',decimalSymbol: '.', groupingSymbol: '.' });
    formatter.format(data, 1); // Apply formatter to second column

    var view = new google.visualization.DataView(data);
    view.setColumns([0, 1]);

    
    var table = new google.visualization.Table(document.getElementById('table_div'));
    table.draw(view, { width: '420px', height: '240px' });
}

＆＃13;

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="table_div"></div>

＆＃13;

<强>更新

根据Customizing Axes，您可以使用hAxis.format和vAxis.format

来控制标签编号的格式

＆＃13;

google.load("visualization", "1", { packages: ["corechart"] });
google.setOnLoadCallback(drawChart);

function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Name');
    data.addColumn('number', 'Salary');
    data.addColumn('boolean', 'Full Time');
    data.addRows(5);
    data.setCell(0, 0, 'John');
    data.setCell(0, 1, 0.1000);
    data.setCell(0, 2, true);
    data.setCell(1, 0, 'Mary');
    data.setCell(1, 1, 0.2500);
    data.setCell(1, 2, true);
    data.setCell(2, 0, 'Steve');
    data.setCell(2, 1, 0.800);
    data.setCell(2, 2, false);
    data.setCell(3, 0, 'Ellen');
    data.setCell(3, 1, 0.2000);
    data.setCell(3, 2, true);
    data.setCell(4, 0, 'Mike');
    data.setCell(4, 1, 0.1200);
    data.setCell(4, 2, false);

    var formatter = new google.visualization.NumberFormat({ prefix: '$', decimalSymbol: '.', groupingSymbol: '.' });
    formatter.format(data, 1); // Apply formatter to second column

    var view = new google.visualization.DataView(data);
    view.setColumns([0, 1]);


    var table = new google.visualization.LineChart(document.getElementById('table_div'));
    table.draw(view, { width: '420px', height: '240px', vAxis: { format:'$#,##0.00'  }  });
}

＆＃13;

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="table_div"></div>

＆＃13;

Answer 2

也许，用正确的位置加载lib可以帮助一些人（为我工作）：

O(n)

更多信息：https://developers.google.com/chart/interactive/docs/basic_load_libs#loadwithlocale

Answer 3

如果数据来自具有模型的控制器，则可以只使用 model.data.replace（“，”，“。”）。这样Google图表可以显示您的浮动数据。

如何在Google Charts中指定小数点分隔符？

3 个答案: