map-ol-utils 0.0.31 → 0.0.33

package/dist/index.cjs

@@ -67,7 +67,7 @@ var __async = (__this, __arguments, generator) => {
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  activeMarkerByUid: () => activeMarkerByUid,
+  activeFeatureByUid: () => activeFeatureByUid,
   addMassMarksLayer: () => addMassMarksLayer,
   buildMassMarksStyles: () => buildMassMarksStyles,
   createAnimationMarker: () => createAnimationMarker,
@@ -86,7 +86,7 @@ __export(index_exports, {
   getMapInstance: () => getMapInstance,
   instance: () => instance,
   removeAllLayers: () => removeAllLayers,
-  resetActiveMarker: () => resetActiveMarker,
+  resetActiveFeature: () => resetActiveFeature,
   resetActiveVector: () => resetActiveVector,
   resetMap: () => resetMap,
   resetZoomAndCenter: () => resetZoomAndCenter,
@@ -108,6 +108,7 @@ var import_control = require("ol/control");
 var import_gcoord = __toESM(require("gcoord"), 1);
 var import_geom = require("ol/geom");
 var import_format = require("ol/format");
+var import_extent = require("ol/extent");
 var import_ol = require("ol");
 var import_interaction = require("ol/interaction");
 var import_Vector = __toESM(require("ol/layer/Vector"), 1);
@@ -138,12 +139,10 @@ var createAnimationMarker = (imgUrl, data) => {
 };
 var resetActiveVector = () => {
   removeOverlays();
-  const layers = instance.getLayers().getArray();
+  const layers = instance.getAllLayers();
   layers.forEach((layer) => {
     const interaction = layer.get("_selectInteraction");
-    if (interaction) {
-      interaction.getFeatures().clear();
-    }
+    interaction == null ? void 0 : interaction.getFeatures().clear();
   });
 };
 var assembleGeoJson = (dataList, config) => {
@@ -166,26 +165,52 @@ var assembleGeoJson = (dataList, config) => {
       console.error(`\u521B\u5EFA\u7EBF\u72B6\u6570\u636E\u5931\u8D25\uFF1A${e}`);
     }
   });
-  return !needTransform ? { type: "FeatureCollection", features: tempList } : import_gcoord.default.transform({ type: "FeatureCollection", features: tempList }, import_gcoord.default.GCJ02, import_gcoord.default.WGS84);
+  return !needTransform ? { type: "FeatureCollection", features: tempList } : import_gcoord.default.transform(
+    { type: "FeatureCollection", features: tempList },
+    import_gcoord.default.GCJ02,
+    import_gcoord.default.WGS84
+  );
 };
-var createVectorStyle = (data, config) => {
+var createVectorStyle = (feature, config) => {
   const {
     isLine,
     colorMap,
     fillColor,
     colorKey,
     strokeColor,
+    fillOpacity,
     strokeWeight,
-    fillOpacity
+    activeFillColor,
+    activeFillOpacity,
+    activeStrokeColor,
+    activeStrokeWeight
   } = config || {};
-  const style = new import_style.Style({
+  const data = feature.getProperties();
+  const activeStyle = new import_style.Style({
     stroke: new import_style.Stroke({
-      width: strokeWeight,
+      width: activeStrokeWeight || strokeWeight || 4,
+      color: activeStrokeColor || (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || strokeColor : strokeColor)
+    })
+  });
+  const unActiveStyle = new import_style.Style({
+    stroke: new import_style.Stroke({
+      width: strokeWeight || 2,
       color: colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || strokeColor : strokeColor
     })
   });
   if (!isLine) {
-    style.setFill(
+    activeStyle.setFill(
+      new import_style.Fill({
+        color: hexToRgba(
+          activeFillColor || fillColor || "",
+          activeFillOpacity || 1
+        ) || hexToRgba(
+          (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fillColor : fillColor) || "",
+          fillOpacity || 1
+        )
+      })
+    );
+    unActiveStyle.setFill(
       new import_style.Fill({
         color: hexToRgba(
           (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fillColor : fillColor) || "",
@@ -194,24 +219,36 @@ var createVectorStyle = (data, config) => {
       })
     );
   }
-  return style;
+  feature.setProperties(
+    Object.assign(data, {
+      activeStyle,
+      unActiveStyle
+    })
+  );
+  return unActiveStyle;
 };
 var createBusinessLayer = (dataList, config) => {
-  const { layerName } = config;
+  const { layerName, openClick } = config;
   const geoJson = assembleGeoJson(dataList, config);
   const vectorLayer = new import_Vector.default({
     zIndex: 5,
     className: layerName ? layerName : "ol-layer",
     source: new import_Vector2.default({
       features: new import_format.GeoJSON().readFeatures(geoJson).map((feature) => {
-        feature.setStyle(createVectorStyle(feature.getProperties(), config));
+        feature.setStyle(createVectorStyle(feature, config));
         return feature;
       })
     })
   });
+  if (openClick) {
+    createSelectByLayer(vectorLayer);
+  }
   vectorLayer.setProperties({
+    _isCustom: true,
+    _isVectorLayer: true,
     _layerName: layerName,
-    _dataList: [...dataList]
+    _dataList: [...dataList],
+    _uuidSet: new Set(dataList.map((item) => item._uuid) || [])
   });
   return vectorLayer;
 };
@@ -228,10 +265,10 @@ var removeAllLayers = (isClearAll = true) => {
     });
   }
 };
-var resetActiveMarker = () => {
+var resetActiveFeature = () => {
   removeOverlays();
-  const massMarksLayers = instance.getAllLayers().filter((layer) => layer.get("_isMassMarksLayer"));
-  massMarksLayers.forEach((layer) => {
+  const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isVectorLayer"));
+  targetLayers.forEach((layer) => {
     const selectInteraction = layer.get("_selectInteraction");
     if (selectInteraction) {
       selectInteraction.dispatchEvent({
@@ -244,11 +281,11 @@ var resetActiveMarker = () => {
     }
   });
 };
-var activeMarkerByUid = (uid) => {
+var activeFeatureByUid = (uid) => {
   var _a;
-  const massMarksLayers = instance.getLayers().getArray().filter((layer) => layer.get("_isMassMarksLayer"));
-  if (massMarksLayers.length) {
-    const targetLayer = massMarksLayers.find(
+  const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isVectorLayer"));
+  if (targetLayers.length) {
+    const targetLayer = targetLayers.find(
       (layer) => layer.get("_uuidSet").has(uid)
     );
     if (targetLayer) {
@@ -338,7 +375,7 @@ var createSelectByLayer = (vectorLayer) => {
       const { activeStyle } = data;
       feature.setStyle(activeStyle);
       if (mapBrowserEvent) {
-        emitter_default.emit("select-marker", data);
+        emitter_default.emit("selected-feature", data);
       }
       vectorLayer.set("_hasActive", true);
       if (vectorLayer.get("_isDynamic")) {
@@ -358,8 +395,8 @@ var createSelectByLayer = (vectorLayer) => {
       const view = instance.getView();
       view.animate({
         zoom: 12,
-        center: [+data.lnglat[0], +data.lnglat[1]],
-        duration: 1e3
+        duration: 1e3,
+        center: (0, import_extent.getCenter)(feature.getGeometry().getExtent())
       });
     }
     if (deselected.length) {
@@ -393,6 +430,7 @@ var createMassMarksLayer = (dataList, styleList = []) => {
   });
   vectorLayer.setProperties({
     _isCustom: true,
+    _isVectorLayer: true,
     _isMassMarksLayer: true,
     _statusNum: styleList.length / 2,
     _dataList: [...dataList],
@@ -429,6 +467,7 @@ var addMassMarksLayer = (getImgUrlFn) => {
         vectorConfig || {
           key: "line",
           isLine: true,
+          openClick: false,
           strokeColor: "rgba(29, 235, 255, 0.8)"
         }
       );
@@ -440,8 +479,9 @@ var addMassMarksLayer = (getImgUrlFn) => {
         vectorConfig || {
           isLine: false,
           key: "faceList",
-          fillColor: "#4247DF",
           strokeWeight: 1,
+          openClick: false,
+          fillColor: "#4247DF",
           strokeStyle: "dashed",
           strokeColor: "#4247DF"
         }
@@ -452,6 +492,7 @@ var addMassMarksLayer = (getImgUrlFn) => {
       _isCustom: true,
       _hasLine: hasLine,
       _hasFace: hasFace,
+      _isVectorLayer: true,
       _isDynamic: isDynamic
     });
     instance.addLayer(massMarksLayer);
@@ -459,7 +500,22 @@ var addMassMarksLayer = (getImgUrlFn) => {
   };
 };
 var updateMarksLayersByStatus = (checkedStatusList = []) => {
-  console.log(checkedStatusList);
+  const hideStyle = new import_style.Style({});
+  const tempList = [];
+  const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isMassMarksLayer"));
+  targetLayers.forEach((layer) => {
+    const features = layer.getSource().getFeatures();
+    features.forEach((feature) => {
+      const data = feature.getProperties();
+      if (!checkedStatusList.includes(data.status)) {
+        feature.setStyle(hideStyle);
+      } else {
+        tempList.push(data);
+        feature.setStyle(data.unActiveStyle);
+      }
+    });
+  });
+  return tempList;
 };
 
 // src/create-map.ts
@@ -740,7 +796,7 @@ var createWmtsLayer = (serverUrl) => (config) => __async(void 0, null, function*
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  activeMarkerByUid,
+  activeFeatureByUid,
   addMassMarksLayer,
   buildMassMarksStyles,
   createAnimationMarker,
@@ -759,7 +815,7 @@ var createWmtsLayer = (serverUrl) => (config) => __async(void 0, null, function*
   getMapInstance,
   instance,
   removeAllLayers,
-  resetActiveMarker,
+  resetActiveFeature,
   resetActiveVector,
   resetMap,
   resetZoomAndCenter,

package/dist/index.d.cts

@@ -33,6 +33,10 @@ type VectorConfig = {
     strokeStyle?: string;
     strokeWeight?: number;
     needTransform?: boolean;
+    activeFillColor?: string;
+    activeStrokeColor?: string;
+    activeFillOpacity?: number;
+    activeStrokeWeight?: number;
     colorMap?: Map<string, string>;
 };
 type IconConfig = {
@@ -109,33 +113,33 @@ declare const createAnimationMarker: (imgUrl: string, data: MassData) => void;
  * 重置激活的矢量数据
  */
 declare const resetActiveVector: () => void;
-declare const createBusinessLayer: (dataList: any, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
+declare const createBusinessLayer: (dataList: MassData[], config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
 /**
  * 创建面状数据
  * @param dataList
  * @param config
  */
-declare const createVectorFaceLayer: (dataList: never[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
+declare const createVectorFaceLayer: (dataList: MassData[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
 /**
  * 创建矢量线图层
  * @param dataList
  * @param config
  */
-declare const createVectorLineLayer: (dataList: any[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
+declare const createVectorLineLayer: (dataList: MassData[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
 /**
  * 移除覆盖物已经自定义图层
  * @param isClearAll
  */
 declare const removeAllLayers: (isClearAll?: boolean) => void;
 /**
- * 重置激活Marker
+ * 重置激活Feature
  */
-declare const resetActiveMarker: () => void;
+declare const resetActiveFeature: () => void;
 /**
- * 激活标注点
+ * 激活要素
  * @param uid
  */
-declare const activeMarkerByUid: (uid: string) => void;
+declare const activeFeatureByUid: (uid: string) => void;
 /**
  * 构建MassMarks样式数组
  */
@@ -160,6 +164,6 @@ declare const addMassMarksLayer: (getImgUrlFn: GetImgUrlFn) => (dataList: never[
  * 更新图层根据选中状态列表
  * @param checkedStatusList
  */
-declare const updateMarksLayersByStatus: (checkedStatusList?: string[]) => void;
+declare const updateMarksLayersByStatus: (checkedStatusList?: string[]) => MassData[];
 
-export { type CustomMap, type GetImgUrl, type GetImgUrlFn, type IconConfig, type MassData, type VectorConfig, type WmtsSourceOptions, activeMarkerByUid, addMassMarksLayer, buildMassMarksStyles, createAnimationMarker, createBaseLayer, createBusinessLayer, createMapInstance, createMapWorldLayer, createMassMarksLayer, createSelectByLayer, createVectorFaceLayer, createVectorLineLayer, createWmtsLayer, disposeMap, emitter, getLayersDataList, getMapInstance, instance, removeAllLayers, resetActiveMarker, resetActiveVector, resetMap, resetZoomAndCenter, updateMarksLayersByStatus };
+export { type CustomMap, type GetImgUrl, type GetImgUrlFn, type IconConfig, type MassData, type VectorConfig, type WmtsSourceOptions, activeFeatureByUid, addMassMarksLayer, buildMassMarksStyles, createAnimationMarker, createBaseLayer, createBusinessLayer, createMapInstance, createMapWorldLayer, createMassMarksLayer, createSelectByLayer, createVectorFaceLayer, createVectorLineLayer, createWmtsLayer, disposeMap, emitter, getLayersDataList, getMapInstance, instance, removeAllLayers, resetActiveFeature, resetActiveVector, resetMap, resetZoomAndCenter, updateMarksLayersByStatus };

package/dist/index.d.ts

@@ -33,6 +33,10 @@ type VectorConfig = {
     strokeStyle?: string;
     strokeWeight?: number;
     needTransform?: boolean;
+    activeFillColor?: string;
+    activeStrokeColor?: string;
+    activeFillOpacity?: number;
+    activeStrokeWeight?: number;
     colorMap?: Map<string, string>;
 };
 type IconConfig = {
@@ -109,33 +113,33 @@ declare const createAnimationMarker: (imgUrl: string, data: MassData) => void;
  * 重置激活的矢量数据
  */
 declare const resetActiveVector: () => void;
-declare const createBusinessLayer: (dataList: any, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
+declare const createBusinessLayer: (dataList: MassData[], config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
 /**
  * 创建面状数据
  * @param dataList
  * @param config
  */
-declare const createVectorFaceLayer: (dataList: never[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
+declare const createVectorFaceLayer: (dataList: MassData[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
 /**
  * 创建矢量线图层
  * @param dataList
  * @param config
  */
-declare const createVectorLineLayer: (dataList: any[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
+declare const createVectorLineLayer: (dataList: MassData[] | undefined, config: VectorConfig) => VectorLayer<VectorSource<Feature<ol_geom.Geometry>>, Feature<ol_geom.Geometry>>;
 /**
  * 移除覆盖物已经自定义图层
  * @param isClearAll
  */
 declare const removeAllLayers: (isClearAll?: boolean) => void;
 /**
- * 重置激活Marker
+ * 重置激活Feature
  */
-declare const resetActiveMarker: () => void;
+declare const resetActiveFeature: () => void;
 /**
- * 激活标注点
+ * 激活要素
  * @param uid
  */
-declare const activeMarkerByUid: (uid: string) => void;
+declare const activeFeatureByUid: (uid: string) => void;
 /**
  * 构建MassMarks样式数组
  */
@@ -160,6 +164,6 @@ declare const addMassMarksLayer: (getImgUrlFn: GetImgUrlFn) => (dataList: never[
  * 更新图层根据选中状态列表
  * @param checkedStatusList
  */
-declare const updateMarksLayersByStatus: (checkedStatusList?: string[]) => void;
+declare const updateMarksLayersByStatus: (checkedStatusList?: string[]) => MassData[];
 
-export { type CustomMap, type GetImgUrl, type GetImgUrlFn, type IconConfig, type MassData, type VectorConfig, type WmtsSourceOptions, activeMarkerByUid, addMassMarksLayer, buildMassMarksStyles, createAnimationMarker, createBaseLayer, createBusinessLayer, createMapInstance, createMapWorldLayer, createMassMarksLayer, createSelectByLayer, createVectorFaceLayer, createVectorLineLayer, createWmtsLayer, disposeMap, emitter, getLayersDataList, getMapInstance, instance, removeAllLayers, resetActiveMarker, resetActiveVector, resetMap, resetZoomAndCenter, updateMarksLayersByStatus };
+export { type CustomMap, type GetImgUrl, type GetImgUrlFn, type IconConfig, type MassData, type VectorConfig, type WmtsSourceOptions, activeFeatureByUid, addMassMarksLayer, buildMassMarksStyles, createAnimationMarker, createBaseLayer, createBusinessLayer, createMapInstance, createMapWorldLayer, createMassMarksLayer, createSelectByLayer, createVectorFaceLayer, createVectorLineLayer, createWmtsLayer, disposeMap, emitter, getLayersDataList, getMapInstance, instance, removeAllLayers, resetActiveFeature, resetActiveVector, resetMap, resetZoomAndCenter, updateMarksLayersByStatus };

package/dist/index.js

@@ -52,6 +52,7 @@ import { defaults } from "ol/control";
 import gcoord from "gcoord";
 import { Point } from "ol/geom";
 import { GeoJSON } from "ol/format";
+import { getCenter } from "ol/extent";
 import { Feature, Overlay } from "ol";
 import { Select } from "ol/interaction";
 import VectorLayer from "ol/layer/Vector";
@@ -82,12 +83,10 @@ var createAnimationMarker = (imgUrl, data) => {
 };
 var resetActiveVector = () => {
   removeOverlays();
-  const layers = instance.getLayers().getArray();
+  const layers = instance.getAllLayers();
   layers.forEach((layer) => {
     const interaction = layer.get("_selectInteraction");
-    if (interaction) {
-      interaction.getFeatures().clear();
-    }
+    interaction == null ? void 0 : interaction.getFeatures().clear();
   });
 };
 var assembleGeoJson = (dataList, config) => {
@@ -110,26 +109,52 @@ var assembleGeoJson = (dataList, config) => {
       console.error(`\u521B\u5EFA\u7EBF\u72B6\u6570\u636E\u5931\u8D25\uFF1A${e}`);
     }
   });
-  return !needTransform ? { type: "FeatureCollection", features: tempList } : gcoord.transform({ type: "FeatureCollection", features: tempList }, gcoord.GCJ02, gcoord.WGS84);
+  return !needTransform ? { type: "FeatureCollection", features: tempList } : gcoord.transform(
+    { type: "FeatureCollection", features: tempList },
+    gcoord.GCJ02,
+    gcoord.WGS84
+  );
 };
-var createVectorStyle = (data, config) => {
+var createVectorStyle = (feature, config) => {
   const {
     isLine,
     colorMap,
     fillColor,
     colorKey,
     strokeColor,
+    fillOpacity,
     strokeWeight,
-    fillOpacity
+    activeFillColor,
+    activeFillOpacity,
+    activeStrokeColor,
+    activeStrokeWeight
   } = config || {};
-  const style = new Style({
+  const data = feature.getProperties();
+  const activeStyle = new Style({
     stroke: new Stroke({
-      width: strokeWeight,
+      width: activeStrokeWeight || strokeWeight || 4,
+      color: activeStrokeColor || (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || strokeColor : strokeColor)
+    })
+  });
+  const unActiveStyle = new Style({
+    stroke: new Stroke({
+      width: strokeWeight || 2,
       color: colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || strokeColor : strokeColor
     })
   });
   if (!isLine) {
-    style.setFill(
+    activeStyle.setFill(
+      new Fill({
+        color: hexToRgba(
+          activeFillColor || fillColor || "",
+          activeFillOpacity || 1
+        ) || hexToRgba(
+          (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fillColor : fillColor) || "",
+          fillOpacity || 1
+        )
+      })
+    );
+    unActiveStyle.setFill(
       new Fill({
         color: hexToRgba(
           (colorKey ? (colorMap == null ? void 0 : colorMap.get(data[colorKey])) || fillColor : fillColor) || "",
@@ -138,24 +163,36 @@ var createVectorStyle = (data, config) => {
       })
     );
   }
-  return style;
+  feature.setProperties(
+    Object.assign(data, {
+      activeStyle,
+      unActiveStyle
+    })
+  );
+  return unActiveStyle;
 };
 var createBusinessLayer = (dataList, config) => {
-  const { layerName } = config;
+  const { layerName, openClick } = config;
   const geoJson = assembleGeoJson(dataList, config);
   const vectorLayer = new VectorLayer({
     zIndex: 5,
     className: layerName ? layerName : "ol-layer",
     source: new VectorSource({
       features: new GeoJSON().readFeatures(geoJson).map((feature) => {
-        feature.setStyle(createVectorStyle(feature.getProperties(), config));
+        feature.setStyle(createVectorStyle(feature, config));
         return feature;
       })
     })
   });
+  if (openClick) {
+    createSelectByLayer(vectorLayer);
+  }
   vectorLayer.setProperties({
+    _isCustom: true,
+    _isVectorLayer: true,
     _layerName: layerName,
-    _dataList: [...dataList]
+    _dataList: [...dataList],
+    _uuidSet: new Set(dataList.map((item) => item._uuid) || [])
   });
   return vectorLayer;
 };
@@ -172,10 +209,10 @@ var removeAllLayers = (isClearAll = true) => {
     });
   }
 };
-var resetActiveMarker = () => {
+var resetActiveFeature = () => {
   removeOverlays();
-  const massMarksLayers = instance.getAllLayers().filter((layer) => layer.get("_isMassMarksLayer"));
-  massMarksLayers.forEach((layer) => {
+  const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isVectorLayer"));
+  targetLayers.forEach((layer) => {
     const selectInteraction = layer.get("_selectInteraction");
     if (selectInteraction) {
       selectInteraction.dispatchEvent({
@@ -188,11 +225,11 @@ var resetActiveMarker = () => {
     }
   });
 };
-var activeMarkerByUid = (uid) => {
+var activeFeatureByUid = (uid) => {
   var _a;
-  const massMarksLayers = instance.getLayers().getArray().filter((layer) => layer.get("_isMassMarksLayer"));
-  if (massMarksLayers.length) {
-    const targetLayer = massMarksLayers.find(
+  const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isVectorLayer"));
+  if (targetLayers.length) {
+    const targetLayer = targetLayers.find(
       (layer) => layer.get("_uuidSet").has(uid)
     );
     if (targetLayer) {
@@ -282,7 +319,7 @@ var createSelectByLayer = (vectorLayer) => {
       const { activeStyle } = data;
       feature.setStyle(activeStyle);
       if (mapBrowserEvent) {
-        emitter_default.emit("select-marker", data);
+        emitter_default.emit("selected-feature", data);
       }
       vectorLayer.set("_hasActive", true);
       if (vectorLayer.get("_isDynamic")) {
@@ -302,8 +339,8 @@ var createSelectByLayer = (vectorLayer) => {
       const view = instance.getView();
       view.animate({
         zoom: 12,
-        center: [+data.lnglat[0], +data.lnglat[1]],
-        duration: 1e3
+        duration: 1e3,
+        center: getCenter(feature.getGeometry().getExtent())
       });
     }
     if (deselected.length) {
@@ -337,6 +374,7 @@ var createMassMarksLayer = (dataList, styleList = []) => {
   });
   vectorLayer.setProperties({
     _isCustom: true,
+    _isVectorLayer: true,
     _isMassMarksLayer: true,
     _statusNum: styleList.length / 2,
     _dataList: [...dataList],
@@ -373,6 +411,7 @@ var addMassMarksLayer = (getImgUrlFn) => {
         vectorConfig || {
           key: "line",
           isLine: true,
+          openClick: false,
           strokeColor: "rgba(29, 235, 255, 0.8)"
         }
       );
@@ -384,8 +423,9 @@ var addMassMarksLayer = (getImgUrlFn) => {
         vectorConfig || {
           isLine: false,
           key: "faceList",
-          fillColor: "#4247DF",
           strokeWeight: 1,
+          openClick: false,
+          fillColor: "#4247DF",
           strokeStyle: "dashed",
           strokeColor: "#4247DF"
         }
@@ -396,6 +436,7 @@ var addMassMarksLayer = (getImgUrlFn) => {
       _isCustom: true,
       _hasLine: hasLine,
       _hasFace: hasFace,
+      _isVectorLayer: true,
       _isDynamic: isDynamic
     });
     instance.addLayer(massMarksLayer);
@@ -403,7 +444,22 @@ var addMassMarksLayer = (getImgUrlFn) => {
   };
 };
 var updateMarksLayersByStatus = (checkedStatusList = []) => {
-  console.log(checkedStatusList);
+  const hideStyle = new Style({});
+  const tempList = [];
+  const targetLayers = instance.getAllLayers().filter((layer) => layer.get("_isMassMarksLayer"));
+  targetLayers.forEach((layer) => {
+    const features = layer.getSource().getFeatures();
+    features.forEach((feature) => {
+      const data = feature.getProperties();
+      if (!checkedStatusList.includes(data.status)) {
+        feature.setStyle(hideStyle);
+      } else {
+        tempList.push(data);
+        feature.setStyle(data.unActiveStyle);
+      }
+    });
+  });
+  return tempList;
 };
 
 // src/create-map.ts
@@ -683,7 +739,7 @@ var createWmtsLayer = (serverUrl) => (config) => __async(void 0, null, function*
   });
 });
 export {
-  activeMarkerByUid,
+  activeFeatureByUid,
   addMassMarksLayer,
   buildMassMarksStyles,
   createAnimationMarker,
@@ -702,7 +758,7 @@ export {
   getMapInstance,
   instance,
   removeAllLayers,
-  resetActiveMarker,
+  resetActiveFeature,
   resetActiveVector,
   resetMap,
   resetZoomAndCenter,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "map-ol-utils",
-  "version": "0.0.31",
+  "version": "0.0.33",
   "type": "module",
   "description": "Openlayers utils library",
   "files": [