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

D3.js是一个用于创建动态、交互式数据可视化的JavaScript库。它提供了丰富的功能和灵活的API，可以帮助开发人员在网页中呈现各种图表和可视化效果。

Sunburst图表是D3.js库中的一种图表类型，它以太阳的形式展示层次结构数据。每个环代表一个层级，而每个扇区代表一个数据点。鼠标悬停和MouseLeave功能是为了增强用户体验，当鼠标悬停在特定的扇区上时，可以显示相关的信息，当鼠标离开时，信息消失。

要实现D3.js sunburst图表的鼠标悬停/ MouseLeave功能，可以按照以下步骤进行：

创建一个SVG容器：使用D3.js的选择器选择一个HTML元素，然后创建一个SVG容器，用于放置sunburst图表。
准备数据：准备层次结构的数据，每个数据点包含名称和值等信息。
创建sunburst布局：使用D3.js的d3.partition()函数创建sunburst布局，该函数将数据转换为适合sunburst图表的层次结构布局。
创建扇区：使用D3.js的选择器选择所有的扇区元素，并绑定数据。然后使用d3.arc()函数创建扇区的路径。
添加鼠标事件：使用D3.js的事件处理函数，为每个扇区添加鼠标悬停和MouseLeave事件。当鼠标悬停时，显示相关信息，当鼠标离开时，隐藏信息。

以下是一个示例代码，演示如何实现D3.js sunburst图表的鼠标悬停/ MouseLeave功能：

// 创建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");
  });

以上代码仅为示例，具体实现可能需要根据实际情况进行调整。关于D3.js的更多信息和使用方法，可以参考腾讯云的数据可视化产品 DataV。