求可生成带跳转层级饼图的Python本地HTML可视化库

针对你需要的点击父节点区块切换到子节点饼图的需求，以下几个库可以实现，且都支持本地HTML部署：

• D3.js
  作为原生可视化库，完全支持本地静态HTML运行，能处理任意深度的层级数据。你可以：

  1. 把现有树形数据转换为D3可处理的嵌套结构
  2. 初始渲染根节点的子节点（subnode0/subnode1/subnode2）的饼图
  3. 给每个扇形区块绑定点击事件，点击后加载该节点的子节点数据，重新渲染饼图
  4. 可添加返回按钮，实现层级回溯
     核心逻辑示例（伪代码）：

  // 初始渲染根子节点饼图
  renderPieChart(root.children);
  // 点击事件处理
  d3.selectAll(".pie-slice").on("click", function(d) {
    if (d.children) {
      renderPieChart(d.children);
    }
  });
  

• Chart.js + 自定义交互
  轻量级的图表库，本地引入JS文件即可运行。实现思路：

  1. 提前把数据按层级分组存储（比如一个对象，key是节点路径，value是子节点数据）
  2. 初始渲染根层级的饼图
  3. 监听饼图的click事件，根据点击的区块名称，切换到对应子层级的数据重新渲染
  4. 维护当前层级状态，支持返回上级
     示例逻辑：

  const chartData = {
    "root": [{name: "subnode0", value:200}, {name: "subnode1", value:500}, {name: "subnode2", value:800}],
    "subnode0": [{name: "n0", value:50}, {name: "n1", value:150}],
    "subnode0/n1": [{name: "a0", value:50}, {name: "a1", value:100}],
    // 其他层级数据
  };
  let currentLevel = "root";
  // 渲染函数
  function renderChart(level) {
    new Chart(document.getElementById('pie-chart'), {
      type: 'pie',
      data: {
        labels: chartData[level].map(item=>item.name),
        datasets: [{data: chartData[level].map(item=>item.value)}]
      },
      options: {
        onClick: (e, elements) => {
          if (elements.length) {
            const selectedItem = chartData[currentLevel][elements[0].index];
            const nextLevel = currentLevel === "root" ? selectedItem.name : `${currentLevel}/${selectedItem.name}`;
            if (chartData[nextLevel]) {
              currentLevel = nextLevel;
              renderChart(nextLevel);
            }
          }
        }
      }
    });
  }
  

• Highcharts
  非商业用途免费，支持本地部署。它的饼图组件自带点击事件，可轻松实现层级切换：

  1. 配置初始饼图数据为根层级子节点
  2. 在plotOptions.series.point.events.click回调中，加载对应子节点数据并更新图表
  3. 支持添加导航按钮实现层级返回

这些方案都不需要依赖在线服务，纯本地HTML+JS就能运行，完全适配你层级过多的场景，避免sunburst图因层级太深导致的可读性问题。

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