javascript 使用 Google Charts 工具饼图显示图例中的项目,即使 value = 0
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10422141/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Display item in legend even if value = 0 with Google Charts Tools Pie Chart
提问by Luke Shaheen
I'm using Google Charts Tools, specifically the Pie Chart.
我正在使用 Google Charts Tools,特别是Pie Chart。
Naturally, if a item has a value of 0, it is not displayed in the pie (since it occupies 0% of the pie). However, it doesn't display in the legend either.
自然,如果一个项目的值为 0,它就不会显示在饼图中(因为它占据饼图的 0%)。但是,它也不显示在图例中。
How can I manipulate the initialization options to still show a 0 value item in the legend, so that users can see that the item exists, it just has a 0 value?
如何操作初始化选项以在图例中仍然显示 0 值项目,以便用户可以看到该项目存在,它只有一个 0 值?
回答by Okan Kocyigit
setting sliceVisibilityThreshold
as zero will solve your problem.
设置sliceVisibilityThreshold
为零将解决您的问题。
function drawVisualization() {
// Create and populate the data table.
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['Work', 11],
['Eat', 0],
['Commute', 2],
['Watch TV', 2],
['Sleep', 7]
]);
// Create and draw the visualization.
new google.visualization.PieChart(document.getElementById('visualization')).
draw(data, {title:"So, how was your day?",
sliceVisibilityThreshold:0
});
}
?
回答by MD Shahrouq
I was recently adding the Google Charts and was facing problem in it, for Adding zero value in it.
Thanks for @ocanal, I used sliceVisibilityThreshold:0, but in some other way.
我最近添加了 Google Charts 并在其中遇到了问题,因为在其中添加了零值。
感谢@ocanal,我使用了sliceVisibilityThreshold:0,但以其他方式使用。
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['B-TRIPS', <?php echo $arr_get_a_org['total_trips']; ?>],
['Reimbursed', <?php echo $arr_get_a_org['reimbursed_trips']; ?>],
['Approved', <?php echo $arr_get_a_org['approved_trips']; ?>],
['Pending', <?php echo $arr_get_a_org['pending_trips']; ?>]
// ['Sleep', <?php echo $arr_get_a_org['total_trips']; ?>]
]);
var options = {
title: 'OVERVIEW',
backgroundColor:'#e2e1e0',
pieSliceText:'value',
sliceVisibilityThreshold :0
};
var chart = new google.visualization.PieChart(document.getElementById('piechart'));
chart.draw(data, options);
}
</script>
As the way of defining of options have changed, for more info check out Google Chart site
由于选项定义的方式发生了变化,有关更多信息,请查看Google Chart 站点
回答by Slade
What I did is much sketchierbut produced the results I was looking for. I'm working in the Google Apps Script editor itself and utilized an excel formula to force the 0% to show.
我所做的要粗略得多,但产生了我正在寻找的结果。我正在使用 Google Apps Script 编辑器本身,并使用 excel 公式强制显示 0%。
=IF(<formula> = 0%, 1E-20%, <formula>)
=IF(<formula> = 0%, 1E-20%, <formula>)
Basically, in the excel column values, if the value was 0 (or 0% in my situation), I'd replace that cell with 1-E20%. It mimics an actual value (so shows up in the legend), but the other values will still add up to 100% as this value is so miniscule it doesn't affect the pie chart.
基本上,在 excel 列值中,如果值为 0(或在我的情况下为 0%),我会用 1-E20% 替换该单元格。它模拟了一个实际值(因此显示在图例中),但其他值仍然会加起来为 100%,因为这个值非常小,不会影响饼图。