D3js sunburst图表鼠标悬停/ MouseLeave功能100%不工作

// 创建SVG容器
var svg = d3.select("body")
  .append("svg")
  .attr("width", width)
  .attr("height", height);

// 准备数据
var data = {
  name: "root",
  children: [
    { name: "A", value: 10 },
    { name: "B", value: 20 },
    { name: "C", value: 30 }
  ]
};

// 创建sunburst布局
var partition = d3.partition()
  .size([2 * Math.PI, radius]);

var root = d3.hierarchy(data)
  .sum(function(d) { return d.value; })
  .sort(function(a, b) { return b.value - a.value; });

partition(root);

// 创建扇区
var arc = d3.arc()
  .startAngle(function(d) { return d.x0; })
  .endAngle(function(d) { return d.x1; })
  .innerRadius(function(d) { return d.y0; })
  .outerRadius(function(d) { return d.y1; });

var path = svg.selectAll("path")
  .data(root.descendants())
  .enter()
  .append("path")
  .attr("d", arc)
  .style("fill", function(d) { return color(d.data.name); })
  .on("mouseover", function(d) {
    // 鼠标悬停事件
    // 显示相关信息
    // 示例代码：console.log(d.data.name);
  })
  .on("mouseleave", function(d) {
    // MouseLeave事件
    // 隐藏信息
    // 示例代码：console.log("MouseLeave");
  });