我有两张图表： 1）google.charts.Bar 2）google.visualization.PieChart
代码为：https://jsfiddle.net/almiroleal/5w3n1cku/2/
google.charts.load('current', {'packages':['bar','corechart'], language:'pt_BR'});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Vendedores', 'Valor', 'n de vendas'],
['Vendedor 1', 24685.27, 298],
['Vendedor 2', 34415.24, 58],
['Vendedor 3', 76171.08, 615],
['Vendedor 4', 60106, 649],
['Vendedor 5', 38779.04, 445]
]);
var bar_options = {
chart: {
title: 'Vendas em Valores',
subtitle: 'por Vendedores'
},
series: {
0: { axis: 'valor'}, // Bind series 0 to an axis named 'valor'.
1: { axis: 'qtd' } // Bind series 1 to an axis named 'qtd'.
},
axes: {
y: {
valor: {label: 'total em R$'}, // Left y-axis.
qtd: {side: 'qtd de vendas', label: 'Qtd de Vendas'} // Right y-axis.
},
}
};
var chart = new google.charts.Bar(document.getElementById('grafico1'));
chart.draw(data, bar_options);
var data2 = google.visualization.arrayToDataTable([
['Vendedores', 'Valor'],
['Vendedor 1', 24685.27],
['Vendedor 2', 34415.24],
['Vendedor 3', 76171.08],
['Vendedor 4', 60106],
['Vendedor 5', 38779.04]
]);
var pie_options = {
title: 'Percentual de Vendas',
subtitle: 'por Vendedores',
is3D: true
};
var chart = new google.visualization.PieChart(document.getElementById('grafico2'));
chart.draw(data2, pie_options );
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="grafico1" style="width: 700px; height: 300px;"></div>
<div id="grafico2" style="width: 400px; height: 300px;"></div>
两者都已加载，但google.charts。栏会显示第一列的标签/工具提示的近似值;不会显示确切的值（条形图显示工具提示当用户将鼠标悬停在列上时）示例：“Vendedor 3”（Saller 3）的值应为76171.08，但显示为76 Mil（我使用的语言为：'pt_BR' ）。
google.charts.load（'current'，{'packages'：['bar'，'corechart']， 的语言： 'pt_BR表示'}）;
如何在google.charts.Bar图表中显示带小数的确切值？
有点奇怪。我尝试在同一页面上创建第三个图形google.visualization。 ColumnChart ，图形1出现时带有精确值的标签（不是近似值）。如果删除图形3，则值将返回显示近似值。使用ColumnChart的代码 https://jsfiddle.net/almiroleal/cumtdhnh/1/
google.charts.load('current', {'packages':['bar','corechart'], language:'pt_BR'});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Vendedores', 'Valor', 'n de vendas'],
['Vendedor 1', 24685.27, 298],
['Vendedor 2', 34415.24, 58],
['Vendedor 3', 76171.08, 615],
['Vendedor 4', 60106, 649],
['Vendedor 5', 38779.04, 445]
]);
var bar_options = {
chart: {
title: 'Vendas em Valores',
subtitle: 'por Vendedores'
},
series: {
0: { axis: 'valor'}, // Bind series 0 to an axis named 'valor'.
1: { axis: 'qtd' } // Bind series 1 to an axis named 'qtd'.
},
axes: {
y: {
valor: {label: 'total em R$'}, // Left y-axis.
qtd: {side: 'qtd de vendas', label: 'Qtd de Vendas'} // Right y-axis.
},
}
};
var chart = new google.charts.Bar(document.getElementById('grafico1'));
chart.draw(data, bar_options);
var data2 = google.visualization.arrayToDataTable([
['Vendedores', 'Valor'],
['Vendedor 1', 24685.27],
['Vendedor 2', 34415.24],
['Vendedor 3', 76171.08],
['Vendedor 4', 60106],
['Vendedor 5', 38779.04]
]);
var pie_options = {
title: 'Percentual de Vendas',
subtitle: 'por Vendedores',
is3D: true
};
var chart = new google.visualization.PieChart(document.getElementById('grafico2'));
chart.draw(data2, pie_options );
var col_options = {
chart: {
title: 'Vendas em Valores - column chart',
subtitle: 'por Vendedores'
},
series: {
0: { axis: 'valor'}, // Bind series 0 to an axis named 'valor'.
1: { axis: 'qtd' } // Bind series 1 to an axis named 'qtd'.
},
axes: {
y: {
valor: {label: 'total em R$', format: 'decimal'}, // Left y-axis.
qtd: {side: 'qtd de vendas', label: 'Qtd de Vendas'} // Right y-axis.
}
}
};
var chart = new google.visualization.ColumnChart(document.getElementById('grafico3'));
chart.draw(data, col_options);
}
<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="grafico1" style="width: 700px; height: 300px;"></div>
<div id="grafico2" style="width: 400px; height: 300px;"></div>
<div id="grafico3" style="width: 400px; height: 300px;"></div>
你能帮助我吗？
答案 0 :(得分：0)
使用NumberFormat类格式化data，
在绘制图表之前......
var formatNumer = new google.visualization.NumberFormat({pattern: 'decimal'});
formatNumer.format(data, 1);
请参阅以下工作代码段...
google.charts.load('current', {'packages':['bar','corechart'], language:'pt_BR'});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Vendedores', 'Valor', 'n de vendas'],
['Vendedor 1', 24685.27, 298],
['Vendedor 2', 34415.24, 58],
['Vendedor 3', 76171.08, 615],
['Vendedor 4', 60106, 649],
['Vendedor 5', 38779.04, 445]
]);
var formatNumer = new google.visualization.NumberFormat({pattern: 'decimal'});
formatNumer.format(data, 1);
var bar_options = {
chart: {
title: 'Vendas em Valores',
subtitle: 'por Vendedores'
},
series: {
0: { axis: 'valor'}, // Bind series 0 to an axis named 'valor'.
1: { axis: 'qtd' } // Bind series 1 to an axis named 'qtd'.
},
axes: {
y: {
valor: {label: 'total em R$', format: 'decimal'}, // Left y-axis.
qtd: {side: 'qtd de vendas', label: 'Qtd de Vendas'} // Right y-axis.
},
}
};
var chart = new google.charts.Bar(document.getElementById('grafico1'));
chart.draw(data, bar_options);
var data2 = google.visualization.arrayToDataTable([
['Vendedores', 'Valor'],
['Vendedor 1', 24685.27],
['Vendedor 2', 34415.24],
['Vendedor 3', 76171.08],
['Vendedor 4', 60106],
['Vendedor 5', 38779.04]
]);
var pie_options = {
title: 'Percentual de Vendas',
subtitle: 'por Vendedores',
is3D: true
};
var chart = new google.visualization.PieChart(document.getElementById('grafico2'));
chart.draw(data2, pie_options );
}<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="grafico1" style="width: 700px; height: 300px;"></div>
<div id="grafico2" style="width: 400px; height: 300px;"></div>