[Bug] Links still exists after collapse the node on Tree with large data
- Dominant language
- TypeScript
- Stars
- 67.3k
- Forks
- 19.8k
- Avg merge
- 11d 14h
- Merged PRs (30d)
- 8
Description
### Version
5.3.3
### Link to Minimal Reproduction
https://codesandbox.io/s/echarts-tree-with-large-data-10elmq?file=/src/chart.js
### Steps to Reproduce
**Here is how i create chart:**
```
import { init, getInstanceByDom } from "echarts";
import React, { useRef, useEffect } from "react";
export function ReactECharts({ option, style, settings, theme }) {
const chartRef = useRef(null);
useEffect(() => {
// Initialize chart
let chart;
if (chartRef.current !== null) {
chart = init(chartRef.current, theme);
}
// Add chart resize listener
// ResizeObserver is leading to a bit janky UX
function resizeChart() {
chart?.resize();
}
window.addEventListener("resize", resizeChart);
// Return cleanup function
return () => {
chart?.dispose();
window.removeEventListener("resize", resizeChart);
};
});
useEffect(() => {
// Update chart
if (chartRef.current !== null) {
const chart = getInstanceByDom(chartRef.current);
chart.setOption(option, settings);
}
}, [option, settings, theme]); // Whenever theme changes we need to add option and setting due to it being deleted in cleanup function
return (
);
}
```
**Here is the option:**
```
const treeOption = {
tooltip: {
trigger: "item",
triggerOn: "mousemove",
formatter: (d) => {
return d.name;
}
},
series: [
{
type: "tree",
data: td,
top: "1%",
left: "7%",
bottom: "1%",
right: "20%",
initialTreeDepth: 1,
symbolSize: 8,
label: {
position: "left",
verticalAlign: "middle",
align: "right",
fontSize: 9
},
leaves: {
label: {
position: "right",
verticalAlign: "middle",
align: "left"
}
},
emphasis: {
focus: "descendant"
},
expandAndCollapse: true,
animationDuration: 550,
animationDurationUpdate: 750
}
]
};
```
- Expand the node then collapse.
### Current Behavior
Expanded the one of nodes and then collapsed. Links still exists for that node after collapse.
### Expected Behavior
Expanded the one of nodes and then collapse. Links should not be exists for that node after collapse.
### Environment
```markdown
- OS: macOS Monterey (M1)
- Browser: Chrome 101.0.4951.64 (Official Build) (arm64)
- Framework: React@17.0.1 , React@18
```
### Any additional comments?
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.