echarts pie图的一些配置项场景

环境 版本

react 18 echarts 5.5.0

基础引用

import * as echarts from "echarts/core";
import {
  TooltipComponent,
  LegendComponent,
  PolarComponent,
  TitleComponent,
  GridComponent,
} from "echarts/components"; //按需
import { LabelLayout } from "echarts/features";
import { CanvasRenderer } from "echarts/renderers";
import { PieChart } from "echarts/charts";
echarts.use([PieChart]);
echarts.use([
  TooltipComponent,
  LegendComponent,
  CanvasRenderer,
  LabelLayout,
  PolarComponent,
  TitleComponent,
  GridComponent,
]); //按需

const divRef = useRef < HTMLDivElement > null;
const chartRef = (useRef < echarts.EChartsType) | (null > null);

<div ref="{divRef}"></div>

渲染部分

useEffect(() => {
    if (divRef.current) {
      chartRef.current = echarts.init(divRef.current, undefined, {
        width,
        height,
      });
      chartRef.current!.setOption({});
    }
  }, []);