Google Chart API - 向饼图标签添加百分比-Java 学习之路

我试图使用谷歌图表api显示每个切片上显示标签和百分比的饼图 . 似乎没有显示标签和百分比的选项，因此我已禁用百分比显示，并尝试手动将其添加到标签中 . 但是，当我在标签中使用百分比符号时，事情就开始起作用了 .

我怎样才能解决这个问题？

JSFiddle：https://jsfiddle.net/phpsriptkiddie/gscdymqp/1/

google.charts.load('current', {'packages':['corechart']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {

    var data = google.visualization.arrayToDataTable([
      ['Phase', 'link', 'percentage'],
      ['Phase 1 25%', '/link1', 25],
      ['Phase 2 25%', '/link2', 25],
      ['Phase 3 50%', '/link3', 50],
    ]);

    var view = new google.visualization.DataView(data);
    view.setColumns([0, 2]);
    var options = {
                pieSliceText: 'label',
      tooltip: {trigger: 'none'},
                slices: {
            0: { color: 'yellow', },
                        1: { color: 'green' },
            2: { color: 'grey' }            
                },
    };

    var chart = new google.visualization.PieChart( document.getElementById('piechart'));
    chart.draw(view, options);

    var selectHandler = function(e) {
     window.location = data.getValue(chart.getSelection()[0]['row'], 1 );
    }

    // Add our selection handler.
    google.visualization.events.addListener(chart, 'select', selectHandler);

  }

请注意一个标签是如何显示的，而其他标签则不是 .

1 回答

0
好像图表区域的大小根本不够大！ :-)一旦我把它变大，问题就得到了解决 .
```
<div id="piechart" style="width: 900px; height: 500px;"></div>
```
https://jsfiddle.net/phpsriptkiddie/gscdymqp/2/
回复于 2024-04-20T08:15:04+08:00

Google Chart API - 向饼图标签添加百分比

1 回答

相关问题