react 绘制简单地图的组件

import React, { useEffect, useRef } from 'react';
import * as echarts from 'echarts';

const RenderMap = (mapParams: { option: { geoData: any; option: any } }) => {
  const mapRef = useRef(null);
  const { geoData, option } = mapParams.option;

  useEffect(() => {
    if (geoData && option)
      if (Object.keys(geoData).length !== 0) {
        echarts.dispose(mapRef.current!);
        echarts.registerMap(option.series[0].map, geoData);
        const chart = echarts.init(mapRef.current!);
        chart?.setOption(option);
        window.addEventListener('resize', () => chart.resize());
      }
  }, [geoData, option]);

  return <div style={{ width: '100%', height: '100%' }} ref={mapRef} />;
};

export default RenderMap;