const chartWrapperRef = useRef<HTMLDivElement | null>(null);
const chartInstanceRef = useRef<echarts.ECharts | null>(null);
const options = {
};
useEffect(() => {
if (chartWrapperRef.current && !chartInstanceRef.current) {
chartInstanceRef.current = echarts.init(chartWrapperRef.current);
}
if (chartInstanceRef.current) {
chartInstanceRef.current.setOption(options);
}
const resizeChart = () => {
if (chartInstanceRef.current) {
chartInstanceRef?.current.resize();
}
}
window.addEventListener("resize", resizeChart)
return () => {
if (chartInstanceRef.current) {
chartInstanceRef.current.dispose();
chartInstanceRef.current = null;
window.removeEventListener("resize", resizeChart)
}
};
}, [options]);
return (
<div ref={chartWrapperRef} className="h-full w-full"></div>
);