@vtx/map 1.1.29 → 1.1.31

package/lib/VtxMap/OlMap/Map.js

@@ -124,7 +124,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
               // geoServer_image
 
               case 'geoServer_image':
-                t.addGeoServerImageLayer(item.coverage);
+                t.addGeoServerImageLayer(item);
 
               default:
                 break;
@@ -286,6 +286,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
         rectangle: []
       }
     };
+    _this.frameSelectProps = {};
 
     _this.loadMapJs();
 
@@ -658,7 +659,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
 
   }, {
     key: "addGeoServerImageLayer",
-    value: function addGeoServerImageLayer(url) {
+    value: function addGeoServerImageLayer(item) {
+      var url = item.coverage;
       var exist = this.olLayers.find(function (item) {
         return item.address === url;
       });
@@ -679,9 +681,9 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
         serverType: 'geoserver',
         crossOrigin: '*',
         ratio: 1,
-        params: _objectSpread({
+        params: _objectSpread(_objectSpread({
           VERSION: '1.1.0'
-        }, param)
+        }, item.param || {}), param)
       }); // 矢量图层
 
       var layer = new ol.layer.Image({
@@ -722,6 +724,20 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
         return t.hideInfoWindow();
       };
 
+      t.state.gis["frameSelect"] = function () {
+        var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+        var callback = arguments.length > 1 ? arguments[1] : undefined;
+        return t.frameSelect(obj, callback);
+      };
+
+      t.state.gis["clearFrameSelect"] = function () {
+        return t.clearFrameSelect();
+      };
+
+      t.state.gis["clearFrameSelectById"] = function (id) {
+        return t.clearFrameSelectById(id);
+      };
+
       t.state.gis["refresh"] = function () {
         t.refresh();
       };
@@ -1155,6 +1171,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
       }
 
       t.drawToolbar.on('drawend', function (e) {
+        var _t$frameSelectProps$p;
+
         // 关闭绘制事件
         t.drawToolbar.finishDrawing(); // 移除
 
@@ -1397,6 +1415,10 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
         if ('drawEnd' in t.props && typeof t.props.drawEnd == 'function') {
           t.props.drawEnd(param);
         }
+
+        if (((_t$frameSelectProps$p = t.frameSelectProps[param.attributes.id]) === null || _t$frameSelectProps$p === void 0 ? void 0 : _t$frameSelectProps$p.callback) instanceof Function) {
+          t.frameSelectProps[param.attributes.id].callback(param);
+        }
       }); //保存绘制图元的id便于后期比对
 
       t.state.drawIds[drawParam.geometryType].push(drawParam.data.id);
@@ -1969,6 +1991,62 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
       t.morepoints.map(function (item, index) {
         item.value.clear();
       });
+    } // 框选
+
+  }, {
+    key: "frameSelect",
+    value: function frameSelect(_ref, callback) {
+      var geometryType = _ref.geometryType,
+          _ref$parameter = _ref.parameter,
+          parameter = _ref$parameter === void 0 ? {} : _ref$parameter,
+          _ref$data = _ref.data,
+          data = _ref$data === void 0 ? {} : _ref$data;
+
+      if (!['polygon', 'circle', 'rectangle'].includes(geometryType)) {
+        message.warn("传入的类型不支持框选！");
+        return false;
+      }
+
+      var t = this;
+      var params = {},
+          type = geometryType || 'polygon',
+          id = data.id || "frameSelectFeature_".concat(Math.random());
+      params.color = parameter.color || '#FF0000';
+      params.lineColor = parameter.lineColor || '#FF0000';
+      params.lineOpacity = parameter.lineOpacity || 1;
+      params.lineWidth = parameter.lineWidth || 2;
+      params.pellucidity = parameter.pellucidity || 0.6;
+      params.lineType = parameter.lineType || 'solid';
+      t.draw({
+        geometryType: type,
+        parameter: _objectSpread(_objectSpread({}, parameter), params),
+        data: {
+          id: id
+        }
+      });
+      t.frameSelectProps[id] = {
+        callback: callback,
+        id: id,
+        type: geometryType
+      };
+    } // 清除框选
+
+  }, {
+    key: "clearFrameSelect",
+    value: function clearFrameSelect() {
+      for (var key in this.frameSelectProps) {
+        this.removeGraphic(this.frameSelectProps[key].id, this.frameSelectProps[key].type);
+      }
+
+      this.frameSelectProps = {};
+    } // 清除框选ById
+
+  }, {
+    key: "clearFrameSelectById",
+    value: function clearFrameSelectById(id) {
+      var obj = this.frameSelectProps[id];
+      this.removeGraphic(obj.id, obj.type);
+      delete this.frameSelectProps[id];
     }
     /*
     * 添加信息窗口
@@ -4164,13 +4242,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "getFeatureInfo",
     value: function getFeatureInfo(event, view, source) {
-      var _source$params_,
-          _source$params_2,
-          _this8 = this;
+      var _this8 = this;
 
+      var sourceParam = source.getParams();
       var url = source.getFeatureInfoUrl(event.coordinate, view.getResolution(), view.getProjection(), {
-        cql_filter: (_source$params_ = source.params_) === null || _source$params_ === void 0 ? void 0 : _source$params_.cql_filter,
-        QUERY_LAYERS: (_source$params_2 = source.params_) === null || _source$params_2 === void 0 ? void 0 : _source$params_2.layers,
+        cql_filter: sourceParam === null || sourceParam === void 0 ? void 0 : sourceParam.cql_filter,
+        QUERY_LAYERS: sourceParam === null || sourceParam === void 0 ? void 0 : sourceParam.layers,
         INFO_FORMAT: 'application/json',
         REQUEST: "GetFeatureInfo",
         FEATURE_COUNT: 50