有没有一种方法可以在Google图表中指定小数点分隔符?
默认情况下,它似乎是基于语言环境的,但是我需要使小数点分隔符成为“点”而不是某些语言环境的逗号(我的用户所在的语言环境是默认的逗号作为小数点分隔符,但被认为是过时/过时的)
从轴标签到工具提示,所有数字均适用。其余的语言环境选项将保持不变。
最佳答案
Google Visualization API提供了formatters,可用于在可视化文件中重新格式化数据
根据NumberFormat:
下面的示例演示如何将格式化程序应用于Salary
列,以便使用.
符号呈现其值(为此,使用NumberFormat对象的decimalSymbol
和groupingSymbol
属性)
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' });
}
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="table_div"></div>
更新
根据Customizing Axes,您可以使用
hAxis.format
和vAxis.format
控制标签编号的格式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' } });
}
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div id="table_div"></div>