最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Google Visualization Issue with Small Values in Pie Chart - Stack Overflow

programmeradmin0浏览0评论

Apparently Google Visualization Pie Charts don't like very small values. I've created a JSfiddle to demonstrate the issue: /

When you load the fiddle, you'll see the pie chart has four categories as one would expect from examining the JS in lines 6-13. Now, try changing the third value in line 13 of the JS from 5 to 1 and then run the fiddle. You'll see that it changes the label on the pie graph to a new label of "other". Can anyone figure out a way around that? (This is particularly problematic in my situation, because we use the label 'other' in some situations to represent a pletely different group in the data.)

To satisfy the SO validator, here's my JS code from the fiddle:

function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Race'); data.addColumn('number', 'Percent'); data.addRows(4); data.setValue(0, 0, 'Black, non-Hispanic'); data.setValue(0, 1, 1370); data.setValue(1, 0, 'Hispanic'); data.setValue(1, 1, 40); data.setValue(2, 0, 'White, non-Hispanic'); data.setValue(2, 1, 537); data.setValue(3, 0, 'Suppressed Categories'); data.setValue(3, 1, 5);

var chart = new google.visualization.PieChart(document.getElementById('chart'));
chart.draw(data, {
                    width: 650,
                    height: 500,
                    fontSize: 11,
                    chartArea:{
                            top:20,
                            left:100
                            },
                    colors:
                        [
                        '8d2300','FE9929','D95F0E','000000',                            ]
});
}      

google.load('visualization', '1', {packages: ['corechart']});
google.setOnLoadCallback(drawChart);

Apparently Google Visualization Pie Charts don't like very small values. I've created a JSfiddle to demonstrate the issue: http://jsfiddle/technotarek/YRKHd/

When you load the fiddle, you'll see the pie chart has four categories as one would expect from examining the JS in lines 6-13. Now, try changing the third value in line 13 of the JS from 5 to 1 and then run the fiddle. You'll see that it changes the label on the pie graph to a new label of "other". Can anyone figure out a way around that? (This is particularly problematic in my situation, because we use the label 'other' in some situations to represent a pletely different group in the data.)

To satisfy the SO validator, here's my JS code from the fiddle:

function drawChart() { var data = new google.visualization.DataTable(); data.addColumn('string', 'Race'); data.addColumn('number', 'Percent'); data.addRows(4); data.setValue(0, 0, 'Black, non-Hispanic'); data.setValue(0, 1, 1370); data.setValue(1, 0, 'Hispanic'); data.setValue(1, 1, 40); data.setValue(2, 0, 'White, non-Hispanic'); data.setValue(2, 1, 537); data.setValue(3, 0, 'Suppressed Categories'); data.setValue(3, 1, 5);

var chart = new google.visualization.PieChart(document.getElementById('chart'));
chart.draw(data, {
                    width: 650,
                    height: 500,
                    fontSize: 11,
                    chartArea:{
                            top:20,
                            left:100
                            },
                    colors:
                        [
                        '8d2300','FE9929','D95F0E','000000',                            ]
});
}      

google.load('visualization', '1', {packages: ['corechart']});
google.setOnLoadCallback(drawChart);
Share Improve this question edited Oct 24, 2013 at 17:19 technoTarek asked Oct 24, 2013 at 16:44 technoTarektechnoTarek 3,2283 gold badges23 silver badges25 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 8

The "Other" category is created to hold all slices that are below the sliceVisibilityThreshold option's value in proportion to the total (default is 1/720). When the "Suppressed Categories" value is 1, it is 1/1948 of the pie (far below the threshold), and so is grouped in the "Other" category. You can manually set the sliceVisibilityThreshold option to whatever value you want (0 forces all slices to draw, regardless of their relative size):

chart.draw(data, {
    width: 650,
    height: 500,
    fontSize: 11,
    chartArea:{
        top:20,
        left:100
    },
    colors:['8d2300','FE9929','D95F0E','000000'],
    sliceVisibilityThreshold: 0
});

jsfiddle link: http://jsfiddle/asgallant/YRKHd/10/

发布评论

评论列表(0)

  1. 暂无评论