@uiw/react-baidu-map-polyline/esm/usePolyline.js

Baidu Map map-polyline Components for React.

import { useState, useEffect, useMemo } from 'react';
import { useMapContext } from '@uiw/react-baidu-map-map';
import { useEnableProperties, useProperties, useVisiable, useEventProperties } from '@uiw/react-baidu-map-utils';
export function usePolyline(props) {
  if (props === void 0) {
    props = {};
  }
  var {
    strokeColor,
    strokeWeight,
    strokeOpacity,
    strokeStyle,
    enableMassClear,
    enableEditing,
    enableClicking,
    icons
  } = props;
  var {
    map
  } = useMapContext();
  var [polyline, setPolyline] = useState();
  var [path, setPath] = useState(props.path || []);

  // eslint-disable-next-line react-hooks/exhaustive-deps
  var opts = {
    strokeColor,
    strokeWeight,
    strokeOpacity,
    strokeStyle,
    enableMassClear,
    enableEditing,
    enableClicking,
    icons
  };
  useEffect(() => {
    return () => {
      if (polyline && map) {
        map.removeOverlay(polyline);
      }
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [map]);
  useMemo(() => {
    if (map && !polyline) {
      var points = (props.path || []).map(item => new BMap.Point(item.lng, item.lat));
      var instance = new BMap.Polyline(points, opts);
      map.addOverlay(instance);
      setPolyline(instance);
    }
  }, [map, opts, polyline, props.path]);
  useEffect(() => {
    if (path && polyline) {
      var points = path.map(item => new BMap.Point(item.lng, item.lat));
      polyline.setPath(points);
    }
  }, [polyline, path]);
  useVisiable(polyline, props);
  useEventProperties(polyline, props, ['Click', 'DblClick', 'MouseDown', 'MouseUp', 'MouseOut', 'MouseOver', 'Remove', 'LineUpdate']);
  useEnableProperties(polyline, props, ['Editing', 'MassClear']);
  // PositionAt
  useProperties(polyline, props, ['StrokeColor', 'StrokeOpacity', 'StrokeWeight', 'StrokeStyle']);
  return {
    polyline,
    setPolyline,
    path,
    setPath
  };
}