如何在vAxis上显示每个可见y值后,谷歌图表显示百分比符号?现在我的图表只显示y轴上的整数值。
我研究了这个问题并找到了格式化程序,它只在我悬停在特定条形图(条形图上)时出现的工具提示中呈现百分号(%)。
如何让图表在条形图上的每个y轴值上显示%?
JS
google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawStuff);
$(document).ready(function(){
$(window).resize(function(){
drawStuff();
});
});
function drawStuff() {
var data = new google.visualization.arrayToDataTable([
['Product', 'Profitability'],
["Product 1", 12],
["Product 2", 11],
["Product 3", 10],
["Product 4", 9],
["Product 5", 8],
["Product 6", 7],
["Product 7", 6],
["Product 8", 5],
["Product 9", 4],
["Product 10", 3]
]);
var formatter = new google.visualization.NumberFormat(
{suffix: '%'});
formatter.format(data, 1); // Apply formatter to second column
var options = {
title: 'LEADERS',
width: '100%',
colors: ["#949494"],
legend: { position: 'none' },
chart: { title: 'LEADERS',
//subtitle: 'popularity by percentage'
},
bars: 'vertical', // Required for Material Bar Charts.
axes: {
x: {
0: { side: 'bottom'} // Top x-axis.
}
},
bar: { groupWidth: "90%" },
vAxis: { minValue: 0, maxValue: 100, format: '#\'%\''}
};
var chart = new google.charts.Bar(document.getElementById('div'));
chart.draw(data, options);
};
修改...
以下编辑在y轴刻度标记后实现了所需的%单位创建,但我无法使其工作。
setTimeout(function(){
$("text").each(function(){
if ($.isNumeric($(this).text()))
{
$(this).text($(this).text() + "%");
}
});
}, 250);