UNPKG

@uiw/react-baidu-map-polygon

Version:

Baidu Map map-polygon Components for React.

63 lines 1.81 kB
import { useState, useEffect } from 'react'; import { useMapContext } from '@uiw/react-baidu-map-map'; import { noop, useEnableProperties, useProperties, useVisiable, useEventProperties } from '@uiw/react-baidu-map-utils'; export function usePolygon(props) { if (props === void 0) { props = {}; } var { strokeColor, fillColor, strokeWeight, strokeOpacity, fillOpacity, strokeStyle, enableMassClear, enableEditing, enableClicking } = props; var { map } = useMapContext(); var [polygon, setPolygon] = useState(); var [path, setPath] = useState(props.path || []); var opts = { strokeColor, fillColor, strokeWeight, strokeOpacity, fillOpacity, strokeStyle, enableMassClear, enableEditing, enableClicking }; useEffect(() => { if (!BMap || !map) return noop; var points = (path || []).map(item => new BMap.Point(item.lng, item.lat)); var instance = new BMap.Polygon(points, opts); map.addOverlay(instance); setPolygon(instance); return function () { map.removeOverlay(instance); }; // eslint-disable-next-line react-hooks/exhaustive-deps }, [map]); useEffect(() => { if (path && polygon) { var points = path.map(item => new BMap.Point(item.lng, item.lat)); polygon.setPath(points); } }, [polygon, path]); useVisiable(polygon, props); useEventProperties(polygon, props, ['Click', 'DoubleClick', 'MouseDown', 'MouseUp', 'MouseOut', 'MouseOver', 'Remove', 'LineUpdate']); useEnableProperties(polygon, props, ['Editing', 'MassClear']); // PositionAt useProperties(polygon, props, ['StrokeColor', 'StrokeOpacity', 'FillColor', 'FillOpacity', 'StrokeWeight', 'StrokeStyle']); return { polygon, setPolygon, path, setPath }; }