import { useEffect, useRef, useContext } from 'react';
import { MapContext } from './map';
export function HeatMapLayer(props) {
    const mapContext = useContext(MapContext);
    const heatmapRef = useRef(null);
    useEffect(() => {
        if (mapContext) {
            mapContext.plugin('AMap.Heatmap', () => {
                heatmapRef.current = new AMap.Heatmap(mapContext, props.heatmapOptions || {
                    radius: 25,
                    opacity: [0, 0.8],
                });
            });
        }
        return () => {
            if (heatmapRef.current) {
                heatmapRef.current.setMap(null);
            }
        };
    }, [mapContext]);
    useEffect(() => {
        if (props.open && heatmapRef.current) {
            heatmapRef.current.setDataSet({
                data: props.data,
            });
            heatmapRef.current && heatmapRef.current.show();
        }
        else {
            heatmapRef.current && heatmapRef.current.hide();
        }
    }, [props.open, props.data, mapContext]);
    return null;
}