如何自定义高图树图数据标签？

Question

这是我的树状图。我有3个级别，我想像提供的图片一样自定义标签。

更具体一点我想要：

1. 在第一层我想把第一层标签从上面的主框里拿出来，第二层应该隐藏在这里。

2. 在第二层向下钻取后，我想再次将标签从主框中取出。

3. 在所有级别中，我想在示例图像中显示标签中的最后级别详细信息。

4. 有没有一种方法可以有 3 个级别，但只向下钻取到 2 个级别？

5. 你知道为什么向下钻取后颜色会发生变化吗？第一层和第三层的颜色不一样！

非常感谢您的考虑。

.

Answer 1

正如@WojciechChmiel 在评论中提到的，色差问题的解决方案是将 parent 颜色设置为 transparent!

因为我使用的部分框外有标签 data label format function。在 react 中，renderToString 帮助我将 React 组件作为关卡标题传递。

我还可以通过以下方式识别每个标签的级别：

  const { level } = data.point.node;

有了这个，我可以管理要显示的理想标签！

-运行 下面提供了演示！