如何移除Google Pie Chart鼠标悬停时显示的具体数值仅保留百分比

解决方案 #

要实现仅展示百分比的悬停提示，有两种常用实现方式：

方案1：最简配置（推荐） #

Google Pie Chart内置了tooltip展示规则配置，只需要在options对象中新增tooltip.text属性设为'percentage'即可，配置后会自动隐藏原始数值，仅展示「分类名: 百分比」格式的提示内容。
修改后的完整代码如下：

var data = new google.visualization.DataTable();
    data.addColumn('string', 'Topping');
    data.addColumn('number', 'Slices');
    data.addRows([
      ['Male', 51],
      ['Female', 49],
    ]);

    // Set options for Sarah's pie chart.
    var options = {title:"",
                   width:600,
                   height:400,
                   is3D: true,
                   // 新增tooltip配置
                   tooltip: {
                     text: 'percentage'
                   }};

方案2：自定义格式化（灵活调整百分比样式） #

如果需要调整百分比的显示精度、后缀等样式，可以配合内置的NumberFormat工具实现自定义效果：

var data = new google.visualization.DataTable();
    data.addColumn('string', 'Topping');
    data.addColumn('number', 'Slices');
    data.addRows([
      ['Male', 51],
      ['Female', 49],
    ]);

// 新增数值格式化逻辑
var formatter = new google.visualization.NumberFormat({
  pattern: '#%', // 可调整为'#.##%'保留两位小数
  suffix: ''
});
formatter.format(data, 1); // 格式化第2列（索引为1的Slices列）

    // Set options for Sarah's pie chart.
    var options = {title:"",
                   width:600,
                   height:400,
                   is3D: true,
                   tooltip: {
                     text: 'value' // 展示格式化后的数值（即百分比）
                   }};

内容的提问来源于stack exchange，提问作者ThatDevGuy