Question

我正在使用谷歌饼图并修改它有问题。经过许多复杂的计算后，我得到一个百分比值，比如说67％。我希望在饼图/圆环图中显示单个百分比值。

我的HTML代码是

<div id="chart_div"></div>

我的Javascript代码是

function drawChart() {
var data = google.visualization.arrayToDataTable([
    ['Category', 'Value'],
    ['Foo', 67]
]);

var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, {
    height: 400,
    width: 600,
    pieHole: 0.5,
    pieSliceTextStyle: {
        color: '#000000'
    }
});
}
google.load('visualization', '1', {packages: ['corechart'], callback: drawChart});

您可以在这里查看http://jsfiddle.net/asgallant/mx03tcx5/

如何使图形仅覆盖饼图的67％而不是100％，因为我只提供单个值。有没有其他方法来实现这一目标..

Answer 1

添加此

slices: {
            1: { color: 'transparent', textStyle : {color:'transparent'} }
          }

与pieSliceTextStyle在同一范围内。和添加

['', 33]

在[＆＃39; Foo＆＃39;，67]之后

。

有关详情，请查看：Google Developers

修改后：

chart.draw(data, {
        height: 400,
        width: 600,
        pieHole: 0.5,
        pieSliceTextStyle: {
            color: '#000000'
        },
        slices: {
            1: { color: 'transparent', textStyle : {color:'transparent'} }
          }
    });


var data = google.visualization.arrayToDataTable([
        ['Category', 'Value'],
        ['Foo', 67],
        ['', 33]
    ]);

如果你想在jsfiddle http://jsfiddle.net/4oxbnmqr/

中查看它

谷歌饼图单值

1 个答案: