css - 谷歌饼图 : remove border around of pie slices

Question

如何在鼠标悬停时删除 Google 饼图上切片周围的边框？

Answer 1

唯一的标准选项会在鼠标悬停时移除边框......

enableInteractivity: false

但这也会禁用工具提示

否则，您可以使用 css 覆盖，边框由 svg 椭圆元素创建

它是唯一一个 stroke-width 为 6.5 的椭圆，所以...

ellipse[stroke-width="6.5"] {
  stroke: transparent;
}

---

请参阅以下工作片段...

google.charts.load('current', {
  callback: function () {
    var data = google.visualization.arrayToDataTable([
      ['Label', 'Value'],
      ['a', 30]
    ]);

    var options = {
      legend: 'none'
    };

    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  },
  packages: ['corechart']
});

ellipse[stroke-width="6.5"] {
  stroke: transparent;
}

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

编辑

当存在多个值时，路径元素用于边框，添加...

path[stroke-width="6.5"] {
  stroke: transparent;
}