import React from "react";
// import * as echarts from '@/subpkg1/components/ec-canvas/echarts';
import * as echarts from "echarts";


/**
 * 使用本组件前, 页面组件必须引入 ec-canvas 组件
 * usingComponents: {
 *   'ec-canvas': '@/subpkg1/components/ec-canvas/ec-canvas'
 * }
 */
export default function Chart(props) {
  const { option, className, style } = props;

  const chartRef = React.useRef();
  const domRef = React.useRef();


  React.useEffect(() => {
    if (!chartRef.current) {
      chartRef.current = echarts.init(domRef.current);
    }

    const resize = () => {
      const t = setTimeout(() => {
        clearTimeout(t);
        chartRef.current.resize();
      }, 100);
    };

    chartRef.current.setOption(option);
    resize();

    window.addEventListener("resize", resize);
    return () => window.removeEventListener("resize", resize);
  }, [option]);
  console.log(option);
  return <div className={className} style={style} ref={domRef}></div>;
}

const getLinearGradient = (...args) =>
  new echarts.graphic.LinearGradient(...args);

export { echarts, getLinearGradient };
