echarts

核心思路：

1. 使用useEffect来操作echarts的实例
2. 使用useRefHooks操作原生DOM
3. 使用ref选择DOM

使用

1. 安装echarts

   pnpm i echarts

2. 准备DOM

   const chartRef = useRef<null | HTMLElement>(null)

3. 准备实例化图表

   //1. 选择一个DOM实例化
   let chartInstance = echarts.init((chartRef.current as HTMLElement))
   //2. 图表的内容
   const option = { // 图表的选项 }
   //3. 将图表给DOM进行渲染 
   chartInstance.setOption(option)

4. 选择DOM展示图表

    <div
       ref={ chartRef }
       style={{ height: '400px' }}
       >
   </div>