@vtx/map 1.1.48 → 1.1.50

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/lib/VtxMap/AMap/AMap.js +1007 -639
  2. package/lib/VtxMap/AMap/AMap.js.map +1 -1
  3. package/lib/VtxMap/BMap/Map.js +1201 -755
  4. package/lib/VtxMap/BMap/Map.js.map +1 -1
  5. package/lib/VtxMap/GMap/Map.js +1569 -1053
  6. package/lib/VtxMap/GMap/Map.js.map +1 -1
  7. package/lib/VtxMap/Map.js +42 -8
  8. package/lib/VtxMap/Map.js.map +1 -1
  9. package/lib/VtxMap/MapToolFunction.js +63 -26
  10. package/lib/VtxMap/MapToolFunction.js.map +1 -1
  11. package/lib/VtxMap/OMap/Map.js +1365 -873
  12. package/lib/VtxMap/OMap/Map.js.map +1 -1
  13. package/lib/VtxMap/OlMap/Map.js +1280 -760
  14. package/lib/VtxMap/OlMap/Map.js.map +1 -1
  15. package/lib/VtxMap/TMap/TMap.js +1063 -658
  16. package/lib/VtxMap/TMap/TMap.js.map +1 -1
  17. package/lib/VtxMap/index.js +8 -1
  18. package/lib/VtxMap/index.js.map +1 -1
  19. package/lib/VtxMap/mapPlayer.js +123 -67
  20. package/lib/VtxMap/mapPlayer.js.map +1 -1
  21. package/lib/VtxMap/optimizingPointMap.js +79 -23
  22. package/lib/VtxMap/optimizingPointMap.js.map +1 -1
  23. package/lib/VtxMap/style/css.js +6 -0
  24. package/lib/VtxMap/style/css.js.map +1 -1
  25. package/lib/VtxMap/style/index.js +6 -0
  26. package/lib/VtxMap/style/index.js.map +1 -1
  27. package/lib/VtxMap/zoomMap.js +43 -14
  28. package/lib/VtxMap/zoomMap.js.map +1 -1
  29. package/lib/VtxModal/VtxModal.js +65 -21
  30. package/lib/VtxModal/VtxModal.js.map +1 -1
  31. package/lib/VtxModal/draggableModal.js +50 -14
  32. package/lib/VtxModal/draggableModal.js.map +1 -1
  33. package/lib/VtxModal/index.js +6 -1
  34. package/lib/VtxModal/index.js.map +1 -1
  35. package/lib/VtxModal/style/css.js +6 -0
  36. package/lib/VtxModal/style/css.js.map +1 -1
  37. package/lib/VtxModal/style/index.js +6 -0
  38. package/lib/VtxModal/style/index.js.map +1 -1
  39. package/lib/VtxSearchCheckMap/VtxSearchCheckMap.js +240 -107
  40. package/lib/VtxSearchCheckMap/VtxSearchCheckMap.js.map +1 -1
  41. package/lib/VtxSearchCheckMap/index.js +2 -0
  42. package/lib/VtxSearchCheckMap/index.js.map +1 -1
  43. package/lib/VtxSearchCheckMap/mapping.js +2 -1
  44. package/lib/VtxSearchCheckMap/mapping.js.map +1 -1
  45. package/lib/VtxSearchCheckMap/style/css.js +19 -0
  46. package/lib/VtxSearchCheckMap/style/css.js.map +1 -1
  47. package/lib/VtxSearchCheckMap/style/index.js +19 -0
  48. package/lib/VtxSearchCheckMap/style/index.js.map +1 -1
  49. package/lib/VtxSearchMap/VtxSearchMap.js +234 -95
  50. package/lib/VtxSearchMap/VtxSearchMap.js.map +1 -1
  51. package/lib/VtxSearchMap/index.js +2 -0
  52. package/lib/VtxSearchMap/index.js.map +1 -1
  53. package/lib/VtxSearchMap/mapping.js +2 -1
  54. package/lib/VtxSearchMap/mapping.js.map +1 -1
  55. package/lib/VtxSearchMap/style/css.js +19 -0
  56. package/lib/VtxSearchMap/style/css.js.map +1 -1
  57. package/lib/VtxSearchMap/style/index.js +19 -0
  58. package/lib/VtxSearchMap/style/index.js.map +1 -1
  59. package/lib/default.js +19 -4
  60. package/lib/default.js.map +1 -1
  61. package/lib/index.js +3 -0
  62. package/lib/index.js.map +1 -1
  63. package/lib/utils/util.js +17 -5
  64. package/lib/utils/util.js.map +1 -1
  65. package/package.json +1 -1
@@ -1,57 +1,94 @@
1
1
  "use strict";
2
2
 
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
+
3
5
  Object.defineProperty(exports, "__esModule", {
4
6
  value: true
5
7
  });
6
8
  exports["default"] = void 0;
9
+
7
10
  var _react = _interopRequireDefault(require("react"));
11
+
8
12
  var _default2 = _interopRequireDefault(require("../../default"));
13
+
9
14
  var _MapToolFunction = require("../MapToolFunction");
15
+
10
16
  var _immutable = _interopRequireDefault(require("immutable"));
17
+
11
18
  var _lodash = require("lodash");
19
+
12
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
13
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
14
- function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
21
+
22
+ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
23
+
15
24
  function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
25
+
16
26
  function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
27
+
17
28
  function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
29
+
18
30
  function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
31
+
19
32
  function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
33
+
20
34
  function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
35
+
21
36
  function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
22
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
23
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
37
+
38
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
39
+
40
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
41
+
24
42
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
25
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
26
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
43
+
44
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
45
+
46
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
47
+
27
48
  function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
28
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
49
+
50
+ function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
51
+
29
52
  function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
53
+
30
54
  function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
55
+
31
56
  function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
57
+
32
58
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
59
+
33
60
  function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
61
+
34
62
  function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
63
+
35
64
  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
65
+
36
66
  function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
37
- function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
38
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
39
- function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } //公共地址配置
67
+
68
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
69
+
40
70
  var Set = _immutable["default"].Set;
71
+
41
72
  var OlMap = /*#__PURE__*/function (_React$Component) {
42
73
  _inherits(OlMap, _React$Component);
74
+
43
75
  var _super = _createSuper(OlMap);
76
+
44
77
  function OlMap(props) {
45
78
  var _this;
79
+
46
80
  _classCallCheck(this, OlMap);
81
+
47
82
  _this = _super.call(this, props);
48
- // 加载图层
83
+
49
84
  _defineProperty(_assertThisInitialized(_this), "loadLayers", function () {
50
85
  var nextLayers = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
51
86
  var currentLayers = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
52
87
  var first = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
53
- var t = _assertThisInitialized(_this);
54
- // 对比图层的变化,找出需要新增和需要删除的。
88
+
89
+ var t = _assertThisInitialized(_this); // 对比图层的变化,找出需要新增和需要删除的。
90
+
91
+
55
92
  var addLayers = nextLayers.filter(function (item) {
56
93
  return !currentLayers.map(function (e) {
57
94
  return e.coverage;
@@ -62,6 +99,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
62
99
  return e.coverage;
63
100
  }).includes(item.coverage);
64
101
  });
102
+
65
103
  if (removeLayers.length > 0) {
66
104
  removeLayers.forEach(function (item) {
67
105
  var exist = t.olLayers.find(function (e) {
@@ -70,6 +108,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
70
108
  exist && exist.layer.setVisible(false);
71
109
  });
72
110
  }
111
+
73
112
  if (addLayers.length > 0) {
74
113
  addLayers.map(function (item) {
75
114
  if (item.coverage.startsWith("http") || item.coverage.startsWith('/')) {
@@ -78,20 +117,24 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
78
117
  case 'superMap':
79
118
  t.addSuperMapLayer(item.coverage);
80
119
  break;
81
- // geoServer_geoJSON
120
+
82
121
  case 'geoServer':
83
122
  t.addGeoServerLayer(item.coverage);
84
- // geoServer_image
123
+ break;
124
+
85
125
  case 'geoServer_image':
86
126
  t.addGeoServerImageLayer(item);
127
+ break;
128
+
87
129
  default:
88
130
  break;
89
131
  }
90
132
  } else if (item.coverage.indexOf("WMTS") > -1) {
91
133
  t.addTileLayer(JSON.parse(item.coverage));
92
- } else if (OL_SCREEN[item.coverage]) {
93
- if (first) {
94
- var layers = eval(OL_SCREEN[item.coverage].initLayer);
134
+ } else if (item.coverage == 'customLayer') {
135
+ var layers = item.initLayer();
136
+
137
+ if (layers) {
95
138
  if ((0, _lodash.isArray)(layers)) {
96
139
  layers.map(function (layer) {
97
140
  t.state.gis.addLayer(layer);
@@ -100,38 +143,67 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
100
143
  t.state.gis.addLayer(layers);
101
144
  }
102
145
  }
146
+ } else if (OL_SCREEN[item.coverage]) {
147
+ if (first) {
148
+ var _layers = eval(OL_SCREEN[item.coverage].initLayer);
149
+
150
+ if ((0, _lodash.isArray)(_layers)) {
151
+ _layers.map(function (layer) {
152
+ t.state.gis.addLayer(layer);
153
+ });
154
+ } else {
155
+ t.state.gis.addLayer(_layers);
156
+ }
157
+ }
103
158
  }
104
159
  });
105
160
  } else {
106
161
  if (first) {
107
162
  var _layer = eval(OL_SCREEN["default"].initLayer);
163
+
108
164
  t.state.gis.addLayer(_layer);
109
165
  }
110
166
  }
111
167
  });
168
+
112
169
  _this.zIndexGraphics = []; //需要放在最后的图元,zoom和pan时刷新dom到最后
170
+
113
171
  _this.htmlPointsId = 'vtx_gmap_html_points'; //html点位容器id class管理
172
+
114
173
  _this.pointCollectionId = 'vtx_gmap_html_pointCollection'; //海量点canvas点位容器id class管理
174
+
115
175
  _this.Label = {}; //所有label 集合
176
+
116
177
  _this.labelLayer = {
117
178
  x: 0,
118
179
  y: 0
119
180
  }; //label图层 位置管理
181
+
120
182
  _this.viewer = null;
121
183
  _this.GM = new _MapToolFunction.graphicManage(); //初始化 图元管理方法
184
+
122
185
  _this.getPolygonArea = _MapToolFunction.getPolygonArea;
123
186
  _this.layer = null; //保存地图图层数据
187
+
124
188
  _this.loadTimer = null; //初始化地图 load时延缓数据处理
189
+
125
190
  _this.animTimer = {}; //点位跳动动画 定时集合
191
+
126
192
  _this.animCount = {}; //点位跳动动画 定时计数
193
+
127
194
  _this.moveToTimer = null; //moveTo时间对象
195
+
128
196
  _this.drawToolbar = null; //地图绘制对象即interaction
197
+
129
198
  _this.drawParam = {}; //缓存 绘制的数据
199
+
130
200
  _this.editToolbar = null; //编辑对象
201
+
131
202
  _this.editId = ''; //当前编辑的图元id
203
+
132
204
  _this.drawSource = null;
133
- _this.drawVector = null;
134
- // 图元绘制保存
205
+ _this.drawVector = null; // 图元绘制保存
206
+
135
207
  _this.drawInfo = {
136
208
  sketch: null,
137
209
  listener: null
@@ -146,15 +218,23 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
146
218
  isCount: false
147
219
  };
148
220
  _this.heatmap = null; //热力图对象
221
+
149
222
  _this.clusterMarkers = []; //聚合点位id数组
223
+
150
224
  _this.clusterPs = []; //聚合集合点
225
+
151
226
  _this.clusterPt = []; //地图中聚合点集合
227
+
152
228
  _this.morepoints = []; //海量点集合
229
+
153
230
  _this.areaRestriction = null; //区域限制数据
231
+
154
232
  _this.movePoints = [];
155
233
  _this.olLayers = []; // ol图层集合 {address:'', layer: ''}
234
+
156
235
  _this.baseLayer = null; // 地图图层
157
236
  //是否绘制测距
237
+
158
238
  _this.rangingTool = {
159
239
  isRanging: false,
160
240
  //是否开启状态
@@ -165,8 +245,10 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
165
245
  distance: 0,
166
246
  //测距长度
167
247
  mapRangingTool: null //测距回调
248
+
168
249
  };
169
250
  _this.rangingTools = {}; //测距点线缓存
251
+
170
252
  _this.rangingInfo = {
171
253
  sketch: null,
172
254
  helpTooltipElement: null,
@@ -192,11 +274,11 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
192
274
  clusters: null,
193
275
  clusterCircles: null
194
276
  };
277
+ _this.mapCreated = false;
195
278
  _this.state = {
196
279
  gis: null,
197
280
  //地图对象
198
281
  mapId: props.mapId,
199
- mapCreated: false,
200
282
  pointIds: [],
201
283
  //地图上点的ids
202
284
  lineIds: [],
@@ -219,10 +301,13 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
219
301
  }
220
302
  };
221
303
  _this.frameSelectProps = {};
304
+
222
305
  _this.loadMapJs();
306
+
223
307
  return _this;
224
- }
225
- // 引入ol样式
308
+ } // 引入ol样式
309
+
310
+
226
311
  _createClass(OlMap, [{
227
312
  key: "loadMapJs",
228
313
  value: function loadMapJs() {
@@ -254,13 +339,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
254
339
  }).appendTo('head');
255
340
  }
256
341
  });
257
- }
258
- // 初始化地圖
342
+ } // 初始化地圖
343
+
259
344
  }, {
260
345
  key: "init",
261
346
  value: function init() {
262
- var t = this;
263
- // 创建地图
347
+ var _this2 = this;
348
+
349
+ var t = this; // 创建地图
350
+
264
351
  t.createMap();
265
352
  t.drawSource = new ol.source.Vector({
266
353
  wrapX: false
@@ -268,86 +355,101 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
268
355
  t.drawVector = new ol.layer.Vector({
269
356
  source: t.drawSource
270
357
  });
358
+
271
359
  var initData = function initData() {
272
360
  var _t$props = t.props,
273
- mapPoints = _t$props.mapPoints,
274
- mapLines = _t$props.mapLines,
275
- mapPolygons = _t$props.mapPolygons,
276
- mapCircles = _t$props.mapCircles,
277
- mapVisiblePoints = _t$props.mapVisiblePoints,
278
- mapCluster = _t$props.mapCluster,
279
- mapPointCollection = _t$props.mapPointCollection,
280
- areaRestriction = _t$props.areaRestriction,
281
- heatMapData = _t$props.heatMapData;
282
- // 初始化中心点
283
- t.setCenter();
284
- // 添加点
361
+ mapPoints = _t$props.mapPoints,
362
+ mapLines = _t$props.mapLines,
363
+ mapPolygons = _t$props.mapPolygons,
364
+ mapCircles = _t$props.mapCircles,
365
+ mapVisiblePoints = _t$props.mapVisiblePoints,
366
+ mapCluster = _t$props.mapCluster,
367
+ mapPointCollection = _t$props.mapPointCollection,
368
+ areaRestriction = _t$props.areaRestriction,
369
+ heatMapData = _t$props.heatMapData; // 初始化中心点
370
+
371
+ t.setCenter(); // 添加点
372
+
285
373
  if (mapPoints instanceof Array) {
286
374
  t.addPoint(mapPoints);
287
- }
288
- //添加线
375
+ } //添加线
376
+
377
+
289
378
  if (mapLines instanceof Array) {
290
379
  t.addLine(mapLines);
291
- }
292
- //添加面
380
+ } //添加面
381
+
382
+
293
383
  if (mapPolygons instanceof Array) {
294
384
  t.addPolygon(mapPolygons);
295
- }
296
- //添加圆
385
+ } //添加圆
386
+
387
+
297
388
  if (mapCircles instanceof Array) {
298
389
  t.addCircle(mapCircles);
299
- }
300
- //是否设置比例尺
390
+ } //是否设置比例尺
391
+
392
+
301
393
  if (t.props.showControl) {
302
394
  t.showControl(t.props);
303
- }
304
- // 画热力图
395
+ } // 画热力图
396
+
397
+
305
398
  if (heatMapData) {
306
399
  t.heatMapOverlay(heatMapData);
307
- }
308
- //设置点聚合
400
+ } //设置点聚合
401
+
402
+
309
403
  if (mapCluster instanceof Array) {
310
404
  t.cluster(mapCluster);
311
405
  }
312
406
  /*设置指定图元展示*/
407
+
408
+
313
409
  if (mapVisiblePoints) {
314
410
  t.setVisiblePoints(mapVisiblePoints);
315
- }
316
- //添加海量点
411
+ } //添加海量点
412
+
413
+
317
414
  if (mapPointCollection instanceof Array) {
318
415
  t.addPointCollection(mapPointCollection);
319
- }
320
- //设置区域限制
416
+ } //设置区域限制
417
+
418
+
321
419
  if (areaRestriction && !!areaRestriction[0] && !!areaRestriction[1]) {
322
420
  t.setAreaRestriction(areaRestriction);
323
421
  }
324
- t.setState({
325
- mapCreated: true
326
- });
422
+
423
+ _this2.mapCreated = true;
327
424
  };
425
+
328
426
  var event = function event(e, status) {
329
427
  var gis = t.state.gis;
330
428
  var overall_feature = null; //鼠标移入事件时记录当前的feature,为鼠标移出要素时保存操作的要素对象
429
+
331
430
  var dragAddMoveFlag = false; //记录地图拖拽和移动事件
332
431
  // 地图开始加载时
432
+
333
433
  gis.on('loadstart', function () {
334
434
  gis.getTargetElement().classList.add('spinner');
335
- });
336
- // 地图加载结束时
435
+ }); // 地图加载结束时
436
+
337
437
  gis.on('loadend', function () {
338
438
  gis.getTargetElement().classList.remove('spinner');
339
- });
340
- // 地图双击事件
341
- gis.on('dbclick', function (evt) {});
342
- // 地图点击事件
439
+ }); // 地图双击事件
440
+
441
+ gis.on('dbclick', function (evt) {}); // 地图点击事件
442
+
343
443
  gis.on('singleclick', function (evt) {
344
444
  var feature = gis.forEachFeatureAtPixel(evt.pixel, function (feature) {
345
445
  return feature;
346
446
  });
447
+
347
448
  if (feature) {
348
449
  var target = feature.getProperties();
349
450
  var id = '';
350
451
  var elementId = '';
452
+
351
453
  if ((0, _lodash.isArray)(target.features)) {
352
454
  // 处理聚合点击
353
455
  var properties = target.features[0].getProperties();
@@ -357,23 +459,25 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
357
459
  } else {
358
460
  id = target.id;
359
461
  elementId = target.element;
360
- }
361
- // top: e.clientY,//当前点所在的位置(屏幕)
462
+ } // top: e.clientY,//当前点所在的位置(屏幕)
362
463
  // left: e.clientX,
464
+
465
+
363
466
  t.clickGraphic(id || elementId, evt, target);
364
467
  } else {
365
468
  t.clickMap(evt);
366
469
  }
367
- });
368
- // 鼠标移动事件 - 当鼠标指向要素时改变光标状态
470
+ }); // 鼠标移动事件 - 当鼠标指向要素时改变光标状态
471
+
369
472
  gis.on('pointermove', function (evt) {
370
473
  var pixel = gis.getEventPixel(evt.originalEvent);
371
474
  var hit = gis.hasFeatureAtPixel(pixel);
372
- gis.getTargetElement().style.cursor = hit ? 'pointer' : 'default';
373
- // 获取到当前鼠标移动下的feature
475
+ gis.getTargetElement().style.cursor = hit ? 'pointer' : 'default'; // 获取到当前鼠标移动下的feature
476
+
374
477
  var feature = gis.forEachFeatureAtPixel(pixel, function (feature, layer) {
375
478
  return feature;
376
479
  });
480
+
377
481
  if (feature) {
378
482
  overall_feature = feature;
379
483
  var values = feature.getProperties();
@@ -384,20 +488,22 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
384
488
  type: 'mousein',
385
489
  event: evt
386
490
  });
491
+
387
492
  var _values = overall_feature.getProperties();
493
+
388
494
  t.mouseOutGraphic(_values.id, evt);
389
495
  overall_feature = null;
390
496
  }
391
497
  }
392
- });
393
- // 鼠标拖拽事件 - 拖拽开始即是地图移动开始
498
+ }); // 鼠标拖拽事件 - 拖拽开始即是地图移动开始
499
+
394
500
  gis.on('pointerdrag', function (evt) {
395
501
  dragAddMoveFlag = true;
396
502
  t.dragMapStart(evt);
397
503
  t.moveStart(evt);
398
504
  });
399
- var zoom = 0;
400
- // 地图移动事件 - 移动结束即是拖拽事件结束 也是地图缩放事件(无开始和结束事件)的监听
505
+ var zoom = 0; // 地图移动事件 - 移动结束即是拖拽事件结束 也是地图缩放事件(无开始和结束事件)的监听
506
+
401
507
  gis.on('moveend', function (evt) {
402
508
  t.dragMapEnd(evt);
403
509
  t.moveEnd(evt);
@@ -406,46 +512,51 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
406
512
  t.zoomEnd(evt);
407
513
  }, 300);
408
514
  dragAddMoveFlag = false;
409
- });
410
- // gis.getViewport().addEventListener('mouseout', function () {
515
+ }); // gis.getViewport().addEventListener('mouseout', function () {
411
516
  // helpTooltipElement.classList.add('hidden');
412
517
  // });
413
518
  };
519
+
414
520
  event();
415
521
  t.setCenter(t.props.center);
416
522
  initData();
417
- }
418
- // 创建地图
523
+ } // 创建地图
524
+
419
525
  }, {
420
526
  key: "createMap",
421
527
  value: function createMap() {
422
528
  var t = this;
423
529
  var _t$props2 = t.props,
424
- _t$props2$olProps = _t$props2.olProps,
425
- olProps = _t$props2$olProps === void 0 ? {} : _t$props2$olProps,
426
- _t$props2$mapCenter = _t$props2.mapCenter,
427
- mapCenter = _t$props2$mapCenter === void 0 ? [] : _t$props2$mapCenter,
428
- mapId = _t$props2.mapId,
429
- mapZoomLevel = _t$props2.mapZoomLevel,
430
- minZoom = _t$props2.minZoom,
431
- maxZoom = _t$props2.maxZoom;
530
+ _t$props2$olProps = _t$props2.olProps,
531
+ olProps = _t$props2$olProps === void 0 ? {} : _t$props2$olProps,
532
+ _t$props2$mapCenter = _t$props2.mapCenter,
533
+ mapCenter = _t$props2$mapCenter === void 0 ? [] : _t$props2$mapCenter,
534
+ mapId = _t$props2.mapId,
535
+ mapZoomLevel = _t$props2.mapZoomLevel,
536
+ minZoom = _t$props2.minZoom,
537
+ maxZoom = _t$props2.maxZoom;
432
538
  var projection = olProps.projection,
433
- olCoverage = olProps.olCoverage;
539
+ olCoverage = olProps.olCoverage;
540
+
434
541
  if (window.VtxMap) {
435
542
  window.VtxMap[mapId] = null;
436
543
  } else {
437
544
  window.VtxMap = {};
438
545
  }
546
+
439
547
  if (!minZoom) {
440
548
  minZoom = 2;
441
549
  }
550
+
442
551
  if (!maxZoom) {
443
552
  maxZoom = 19;
444
553
  }
554
+
445
555
  if (!projection) {
446
556
  projection = 'EPSG:4326';
447
- }
448
- //中心点
557
+ } //中心点
558
+
559
+
449
560
  var center = mapCenter && mapCenter instanceof Array && mapCenter.length == 2 ? mapCenter : [116.400433, 39.906705];
450
561
  center = [parseFloat(center[0]), parseFloat(center[1])];
451
562
  window.VtxMap[mapId] = t.state.gis = new ol.Map({
@@ -462,8 +573,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
462
573
  rotate: false,
463
574
  attribution: false
464
575
  })
465
- });
466
- // 基本地图视图
576
+ }); // 基本地图视图
577
+
467
578
  t.viewer = new ol.View({
468
579
  center: center,
469
580
  zoom: mapZoomLevel || 10,
@@ -473,23 +584,20 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
473
584
  });
474
585
  t.loadLayers(olCoverage, [], true);
475
586
  t.initPropsForUser();
476
- }
587
+ } // 加载图层
588
+
477
589
  }, {
478
590
  key: "getWMTS",
479
- value:
480
- // wmts图层资源
591
+ value: // wmts图层资源
481
592
  function getWMTS(options) {
482
593
  var url = options.url,
483
- params = options.params,
484
- sourceOptions = options.sourceOptions;
594
+ params = options.params,
595
+ sourceOptions = options.sourceOptions; //切片名
485
596
 
486
- //切片名
487
- var matrixIds = ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10', 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18'];
597
+ var matrixIds = ['EPSG:4326:0', 'EPSG:4326:1', 'EPSG:4326:2', 'EPSG:4326:3', 'EPSG:4326:4', 'EPSG:4326:5', 'EPSG:4326:6', 'EPSG:4326:7', 'EPSG:4326:8', 'EPSG:4326:9', 'EPSG:4326:10', 'EPSG:4326:11', 'EPSG:4326:12', 'EPSG:4326:13', 'EPSG:4326:14', 'EPSG:4326:15', 'EPSG:4326:16', 'EPSG:4326:17', 'EPSG:4326:18']; //分辨率
488
598
 
489
- //分辨率
490
- var resolutions = [0.703125, 0.3515625, 0.17578125, 0.087890625, 0.0439453125, 0.02197265625, 0.010986328125, 0.0054931640625, 0.00274658203125, 0.001373291015625, 6.866455078125e-4, 3.4332275390625e-4, 1.71661376953125e-4, 8.58306884765625e-5, 4.291534423828125e-5, 2.1457672119140625e-5, 1.0728836059570312e-5, 5.364418029785156e-6, 2.682209014892578e-6];
599
+ var resolutions = [0.703125, 0.3515625, 0.17578125, 0.087890625, 0.0439453125, 0.02197265625, 0.010986328125, 0.0054931640625, 0.00274658203125, 0.001373291015625, 6.866455078125e-4, 3.4332275390625e-4, 1.71661376953125e-4, 8.58306884765625e-5, 4.291534423828125e-5, 2.1457672119140625e-5, 1.0728836059570312e-5, 5.364418029785156e-6, 2.682209014892578e-6]; //切片策略
491
600
 
492
- //切片策略
493
601
  var tilegrid = new ol.tilegrid.WMTS({
494
602
  extent: [-180.0, -90.0, 180.0, 90.0],
495
603
  //范围
@@ -499,9 +607,9 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
499
607
  resolutions: resolutions,
500
608
  //分辨率
501
609
  matrixIds: matrixIds //层级标识列表,与地图级数保持一致
502
- });
503
610
 
504
- //设置地图投影
611
+ }); //设置地图投影
612
+
505
613
  var projection = new ol.proj.Projection({
506
614
  code: 'EPSG:4326',
507
615
  units: 'degrees',
@@ -515,27 +623,29 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
515
623
  projection: projection,
516
624
  tileGrid: tilegrid
517
625
  }, sourceOptions));
518
- }
626
+ } // 添加普通图层
519
627
 
520
- // 添加普通图层
521
628
  }, {
522
629
  key: "addTileLayer",
523
630
  value: function addTileLayer(_ref) {
524
631
  var url = _ref.url,
525
- _ref$params = _ref.params,
526
- params = _ref$params === void 0 ? {} : _ref$params,
527
- _ref$sourceOptions = _ref.sourceOptions,
528
- sourceOptions = _ref$sourceOptions === void 0 ? {} : _ref$sourceOptions,
529
- type = _ref.type,
530
- source = _ref.source;
632
+ _ref$params = _ref.params,
633
+ params = _ref$params === void 0 ? {} : _ref$params,
634
+ _ref$sourceOptions = _ref.sourceOptions,
635
+ sourceOptions = _ref$sourceOptions === void 0 ? {} : _ref$sourceOptions,
636
+ type = _ref.type,
637
+ source = _ref.source;
638
+
531
639
  if (url) {
532
640
  var exist = this.olLayers.find(function (item) {
533
641
  return item.address === url;
534
642
  });
643
+
535
644
  if (exist) {
536
645
  exist.layer.setVisible(true);
537
646
  return;
538
647
  }
648
+
539
649
  var layerSource = source || (type === 'WMTS' ? this.getWMTS({
540
650
  url: url,
541
651
  params: params,
@@ -543,54 +653,58 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
543
653
  }) : new ol.source.XYZ(_objectSpread({
544
654
  url: url
545
655
  }, sourceOptions)));
656
+
546
657
  var _layer2 = new ol.layer.Tile({
547
658
  source: layerSource
548
- });
659
+ }); // 将图层添加到地图上
660
+
549
661
 
550
- // 将图层添加到地图上
551
662
  this.state.gis.addLayer(_layer2);
552
663
  this.olLayers.push({
553
664
  address: url,
554
665
  layer: _layer2
555
666
  });
556
667
  }
557
- }
558
- // 添加超图图层
668
+ } // 添加超图图层
669
+
559
670
  }, {
560
671
  key: "addSuperMapLayer",
561
672
  value: function addSuperMapLayer(url) {
562
673
  var exist = this.olLayers.find(function (item) {
563
674
  return item.address === url;
564
675
  });
676
+
565
677
  if (exist) {
566
678
  exist.layer.setVisible(true);
567
679
  return;
568
680
  }
681
+
569
682
  var layer = new ol.layer.Tile({
570
683
  source: new ol.source.TileSuperMapRest({
571
684
  url: url
572
685
  })
573
- });
574
- // 将图层添加到地图上
686
+ }); // 将图层添加到地图上
687
+
575
688
  this.state.gis.addLayer(layer);
576
689
  this.olLayers.push({
577
690
  address: url,
578
691
  layer: layer
579
692
  });
580
- }
581
- // 添加geoServer_geoJSON图层
693
+ } // 添加geoServer_geoJSON图层
694
+
582
695
  }, {
583
696
  key: "addGeoServerLayer",
584
697
  value: function addGeoServerLayer(_url) {
585
698
  var exist = this.olLayers.find(function (item) {
586
699
  return item.address === _url;
587
700
  });
701
+
588
702
  if (exist) {
589
703
  exist.layer.setVisible(true);
590
704
  return;
591
- }
705
+ } // 矢量数据源
706
+
592
707
 
593
- // 矢量数据源
594
708
  var vectorSource = new ol.source.Vector({
595
709
  // 设置格式化类型
596
710
  format: new ol.format.GeoJSON(),
@@ -599,15 +713,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
599
713
  return "".concat(_url, "&bbox=").concat(extent.join(','));
600
714
  },
601
715
  strategy: ol.loadingstrategy.bbox
602
- });
716
+ }); // 矢量图层
603
717
 
604
- // 矢量图层
605
718
  var layer = new ol.layer.Vector({
606
719
  // 设置数据源
607
720
  source: vectorSource,
608
721
  // 设置图层样式也可以 function (feature) { /** 根据内容动态加载样式 **/ return Style}
609
722
  style: function style(feature) {
610
723
  var _icon$;
724
+
611
725
  var el = feature.A || {};
612
726
  var icon = JSON.parse(el.icon || '[]');
613
727
  var mapIcon = (_icon$ = icon[0]) !== null && _icon$ !== void 0 && _icon$.id ? "/cloudFile/common/downloadFile?id=".concat(icon[0].id) : require("../images/defaultMarker.png");
@@ -628,8 +742,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
628
742
  })
629
743
  });
630
744
  }
631
- });
632
- // 将图层添加到地图上
745
+ }); // 将图层添加到地图上
746
+
633
747
  this.state.gis.addLayer(layer);
634
748
  this.olLayers.push({
635
749
  address: _url,
@@ -640,7 +754,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
640
754
  key: "formatUrl",
641
755
  value: function formatUrl(url) {
642
756
  var param = {},
643
- address = url.split("?")[0];
757
+ address = url.split("?")[0];
644
758
  url.split("?")[1].split("&").map(function (item) {
645
759
  var json = item.split("=");
646
760
  param[json[0].toUpperCase()] = json[1] ? decodeURIComponent(json[1]) : '';
@@ -649,8 +763,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
649
763
  param: param,
650
764
  address: address
651
765
  };
652
- }
653
- // 添加geoServer_image图层
766
+ } // 添加geoServer_image图层
767
+
654
768
  }, {
655
769
  key: "addGeoServerImageLayer",
656
770
  value: function addGeoServerImageLayer(item) {
@@ -658,15 +772,18 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
658
772
  var exist = this.olLayers.find(function (item) {
659
773
  return item.address === url;
660
774
  });
775
+
661
776
  if (exist) {
662
777
  exist.layer.setVisible(true);
663
778
  return;
664
779
  }
780
+
665
781
  var _this$formatUrl = this.formatUrl(url),
666
- _this$formatUrl$param = _this$formatUrl.param,
667
- param = _this$formatUrl$param === void 0 ? {} : _this$formatUrl$param,
668
- address = _this$formatUrl.address;
669
- // 矢量数据源
782
+ _this$formatUrl$param = _this$formatUrl.param,
783
+ param = _this$formatUrl$param === void 0 ? {} : _this$formatUrl$param,
784
+ address = _this$formatUrl.address; // 矢量数据源
785
+
786
+
670
787
  var vectorSource = new ol.source.ImageWMS({
671
788
  url: address,
672
789
  serverType: 'geoserver',
@@ -675,122 +792,140 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
675
792
  params: _objectSpread(_objectSpread({
676
793
  VERSION: '1.1.0'
677
794
  }, item.param || {}), param)
678
- });
795
+ }); // 矢量图层
679
796
 
680
- // 矢量图层
681
797
  var layer = new ol.layer.Image({
682
798
  // 设置数据源
683
799
  source: vectorSource
684
- });
685
- // 将图层添加到地图上
800
+ }); // 将图层添加到地图上
801
+
686
802
  this.state.gis.addLayer(layer);
687
803
  this.olLayers.push({
688
804
  address: url,
689
805
  layer: layer,
690
806
  source: vectorSource
691
807
  });
692
- }
693
- // 初始化对外方法
808
+ } // 初始化对外方法
809
+
694
810
  }, {
695
811
  key: "initPropsForUser",
696
812
  value: function initPropsForUser() {
697
813
  var t = this;
814
+
698
815
  t.state.gis["getCenter"] = function () {
699
816
  return t.getCenter();
700
817
  };
818
+
701
819
  t.state.gis["setCenter"] = function (gt) {
702
820
  t.setCenter(gt);
703
821
  };
822
+
704
823
  t.state.gis["getZoomLevel"] = function () {
705
824
  return t.getZoomLevel();
706
825
  };
826
+
707
827
  t.state.gis["showInfoWindow"] = function (obj) {
708
828
  return t.showInfoWindow(obj);
709
829
  };
830
+
710
831
  t.state.gis["hideInfoWindow"] = function () {
711
832
  return t.hideInfoWindow();
712
833
  };
834
+
713
835
  t.state.gis["frameSelect"] = function () {
714
836
  var obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
715
837
  var callback = arguments.length > 1 ? arguments[1] : undefined;
716
838
  return t.frameSelect(obj, callback);
717
839
  };
840
+
718
841
  t.state.gis["clearFrameSelect"] = function () {
719
842
  return t.clearFrameSelect();
720
843
  };
844
+
721
845
  t.state.gis["clearFrameSelectById"] = function (id) {
722
846
  return t.clearFrameSelectById(id);
723
847
  };
848
+
724
849
  t.state.gis["refresh"] = function () {
725
850
  t.refresh();
726
851
  };
727
- }
728
- // 设置中心点
852
+ } // 设置中心点
853
+
729
854
  }, {
730
855
  key: "setCenter",
731
856
  value: function setCenter(gt) {
732
857
  var t = this;
858
+
733
859
  if (!t.state.gis) {
734
860
  return;
735
861
  }
862
+
736
863
  if (gt) {
737
864
  //经纬度 必须存在 否则不操作
738
865
  if (!gt[0] || !gt[1]) {
739
866
  return false;
740
- }
741
- //如果设置的经纬度 与当前中心点一样 不操作
867
+ } //如果设置的经纬度 与当前中心点一样 不操作
868
+
869
+
742
870
  var c = t.getCenter();
871
+
743
872
  if (c.lng == gt[0] && c.lat == gt[1]) {
744
873
  return false;
745
874
  }
875
+
746
876
  t.state.gis.getView().setCenter(gt);
747
877
  t.viewer.animate({
748
878
  center: gt,
749
879
  duration: 2000
750
880
  });
751
881
  }
752
- }
753
- //设置地图缩放层级
882
+ } //设置地图缩放层级
883
+
754
884
  }, {
755
885
  key: "setZoomLevel",
756
886
  value: function setZoomLevel(zoom) {
757
887
  var t = this;
758
888
  var z = t.state.gis.getView().getZoom();
889
+
759
890
  if (z == zoom) {
760
891
  return false;
761
892
  }
893
+
762
894
  t.state.gis.getView().setZoom(zoom);
763
- }
764
- //获取当前中心点
895
+ } //获取当前中心点
896
+
765
897
  }, {
766
898
  key: "getCenter",
767
899
  value: function getCenter() {
768
900
  var t = this;
769
901
  var gis = t.state.gis;
902
+
770
903
  var _gis$getView$calculat = gis.getView().calculateExtent(gis.getSize()),
771
- _gis$getView$calculat2 = _slicedToArray(_gis$getView$calculat, 4),
772
- xmin = _gis$getView$calculat2[0],
773
- ymin = _gis$getView$calculat2[1],
774
- xmax = _gis$getView$calculat2[2],
775
- ymax = _gis$getView$calculat2[3];
904
+ _gis$getView$calculat2 = _slicedToArray(_gis$getView$calculat, 4),
905
+ xmin = _gis$getView$calculat2[0],
906
+ ymin = _gis$getView$calculat2[1],
907
+ xmax = _gis$getView$calculat2[2],
908
+ ymax = _gis$getView$calculat2[3];
909
+
776
910
  return {
777
911
  lng: (xmin + xmax) / 2,
778
912
  lat: (ymin + ymax) / 2
779
913
  };
780
- }
781
- //编辑图元
914
+ } //编辑图元
915
+
782
916
  }, {
783
917
  key: "doEdit",
784
918
  value: function doEdit(id) {
785
- var t = this;
786
- //获取图元对象
919
+ var t = this; //获取图元对象
920
+
787
921
  var gc = t.GM.getGraphic(id);
788
922
  var gp = t.GM.getGraphicParam(id);
789
- if (!gc) return false;
790
- //关闭先前编辑的图元
923
+ if (!gc) return false; //关闭先前编辑的图元
924
+
791
925
  if (!!t.state.editId) {
792
926
  t.endEdit();
793
927
  }
928
+
794
929
  if (!t.editToolbar) {
795
930
  t.editToolbar = new ol.interaction.Modify({
796
931
  source: gp.source,
@@ -800,23 +935,26 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
800
935
  } else {
801
936
  t.state.gis.addInteraction(t.editToolbar);
802
937
  }
938
+
803
939
  t.editToolbar.on('modifyend', function (e) {
804
940
  var feature = gc;
805
941
  e.features.forEach(function (feature) {
806
942
  feature = feature;
807
- });
808
- //返回参数
943
+ }); //返回参数
944
+
809
945
  var param = {
810
946
  id: id,
811
947
  e: e
812
- };
813
- // 绘制内部管理的图元
948
+ }; // 绘制内部管理的图元
949
+
814
950
  if (gp.geometry.type == 'point') {
815
951
  var cur = feature.getProperties().geometry;
952
+
816
953
  var _cur$flatCoordinates = _slicedToArray(cur.flatCoordinates, 2),
817
- lng = _cur$flatCoordinates[0],
818
- lat = _cur$flatCoordinates[1];
819
- //处理点返回参数
954
+ lng = _cur$flatCoordinates[0],
955
+ lat = _cur$flatCoordinates[1]; //处理点返回参数
956
+
957
+
820
958
  param = _objectSpread(_objectSpread({}, param), {}, {
821
959
  attributes: _objectSpread(_objectSpread({}, gp.attributes), {}, {
822
960
  longitude: lng,
@@ -845,12 +983,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
845
983
  y: lat
846
984
  }
847
985
  });
848
- }
849
- //线
986
+ } //线
987
+
988
+
850
989
  if (gp.geometry.type == 'polyline') {
851
990
  var _cur = feature.getProperties().geometry;
852
991
  var oddList = [],
853
- evenList = [];
992
+ evenList = [];
993
+
854
994
  _cur.flatCoordinates.map(function (item, index) {
855
995
  // 判断下标奇偶数
856
996
  if (index % 2 === 0) {
@@ -859,13 +999,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
859
999
  oddList.push(item);
860
1000
  }
861
1001
  });
1002
+
862
1003
  var path = oddList.map(function (item, index) {
863
1004
  return [evenList[index], oddList[index]];
864
- });
865
- //处理线返回参数
1005
+ }); //处理线返回参数
1006
+
866
1007
  var _t$dealData = t.dealData(path),
867
- lnglatAry = _t$dealData.lnglatAry,
868
- _extent = _t$dealData._extent;
1008
+ lnglatAry = _t$dealData.lnglatAry,
1009
+ _extent = _t$dealData._extent;
1010
+
869
1011
  param = _objectSpread(_objectSpread({}, param), {}, {
870
1012
  attributes: _objectSpread(_objectSpread({}, gp.attributes), {}, {
871
1013
  paths: path,
@@ -897,12 +1039,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
897
1039
  },
898
1040
  distance: t.calculateDistance(path)
899
1041
  });
900
- }
901
- //面
1042
+ } //面
1043
+
1044
+
902
1045
  if (gp.geometry.type == 'polygon') {
903
1046
  var _cur2 = feature.getProperties().geometry;
904
1047
  var _oddList = [],
905
- _evenList = [];
1048
+ _evenList = [];
1049
+
906
1050
  _cur2.flatCoordinates.map(function (item, index) {
907
1051
  // 判断下标奇偶数
908
1052
  if (index % 2 === 0) {
@@ -911,13 +1055,16 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
911
1055
  _oddList.push(item);
912
1056
  }
913
1057
  });
1058
+
914
1059
  var _path = _oddList.map(function (item, index) {
915
1060
  return [_evenList[index], _oddList[index]];
916
- });
917
- //处理线返回参数
1061
+ }); //处理线返回参数
1062
+
1063
+
918
1064
  var _t$dealData2 = t.dealData(_path),
919
- _lnglatAry = _t$dealData2.lnglatAry,
920
- _extent2 = _t$dealData2._extent;
1065
+ _lnglatAry = _t$dealData2.lnglatAry,
1066
+ _extent2 = _t$dealData2._extent;
1067
+
921
1068
  param = _objectSpread(_objectSpread({}, param), {}, {
922
1069
  attributes: _objectSpread(_objectSpread({}, gp.attributes), {}, {
923
1070
  rings: _path,
@@ -950,9 +1097,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
950
1097
  area: (0, _MapToolFunction.getPolygonArea)(_path)
951
1098
  });
952
1099
  }
1100
+
953
1101
  if (gp.geometry.type == 'circle') {
954
1102
  var _cur3 = feature.getProperties().geometry;
1103
+
955
1104
  var center = _cur3.getCenter();
1105
+
956
1106
  var sketchCoords_ = [_cur3.flatCoordinates[0], _cur3.flatCoordinates[1]];
957
1107
  var sketchCoords_2 = [_cur3.flatCoordinates[2], _cur3.flatCoordinates[3]];
958
1108
  var radius = ol.sphere.getDistance(sketchCoords_, sketchCoords_2);
@@ -997,27 +1147,31 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
997
1147
  }
998
1148
  });
999
1149
  }
1150
+
1000
1151
  if ('editGraphicChange' in t.props && typeof t.props.editGraphicChange == 'function') {
1001
1152
  t.props.editGraphicChange(param);
1002
1153
  }
1154
+
1003
1155
  t.GM.setGraphic(id, feature).setGraphicParam(id, _objectSpread(_objectSpread({}, param), {}, {
1004
1156
  source: gp.source
1005
1157
  }));
1006
1158
  });
1007
1159
  t.editId = id;
1008
- }
1009
- //关闭编辑
1160
+ } //关闭编辑
1161
+
1010
1162
  }, {
1011
1163
  key: "endEdit",
1012
1164
  value: function endEdit() {
1013
1165
  var t = this;
1166
+
1014
1167
  if (t.editToolbar) {
1015
1168
  t.state.gis.removeInteraction(t.editToolbar);
1016
1169
  t.editToolbar = null;
1017
1170
  }
1171
+
1018
1172
  t.editId = '';
1019
- }
1020
- // 绘制图元
1173
+ } // 绘制图元
1174
+
1021
1175
  }, {
1022
1176
  key: "draw",
1023
1177
  value: function draw(obj) {
@@ -1025,35 +1179,38 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1025
1179
  var drawInfo = t.drawInfo;
1026
1180
  var gis = t.state.gis;
1027
1181
  var drawParam = {},
1028
- image,
1029
- stroke,
1030
- fill;
1031
- //初始化参数
1182
+ image,
1183
+ stroke,
1184
+ fill; //初始化参数
1185
+
1032
1186
  drawParam.geometryType = obj.geometryType || 'point';
1033
1187
  drawParam.parameter = obj.parameter ? _objectSpread({}, obj.parameter) : {};
1034
1188
  drawParam.data = obj.data ? _objectSpread({}, obj.data) : {};
1035
- drawParam.data.id = (obj.data || {}).id || "draw".concat(new Date().getTime());
1036
- //缓存 绘制的数据
1037
- t.drawParam = drawParam;
1038
- //判断id是否存在
1189
+ drawParam.data.id = (obj.data || {}).id || "draw".concat(new Date().getTime()); //缓存 绘制的数据
1190
+
1191
+ t.drawParam = drawParam; //判断id是否存在
1192
+
1039
1193
  var len = t.state.drawIds[drawParam.geometryType].indexOf(drawParam.data.id);
1194
+
1040
1195
  if (len > -1) {
1041
1196
  //如果id存在 删除存在的图元,清除drawId中的id数据
1042
1197
  t.removeGraphic(drawParam.data.id);
1043
1198
  t.state.drawIds[drawParam.geometryType].splice(len, 1);
1044
1199
  }
1200
+
1045
1201
  var type = 'Point',
1046
- style = new ol.style.Style({
1047
- image: new ol.style.Icon({
1048
- anchor: [-drawParam.parameter.markerContentX || -15, -drawParam.parameter.markerContentY || -15],
1049
- anchorXUnits: 'pixels',
1050
- anchorYUnits: 'pixels',
1051
- src: drawParam.parameter.url || require("../images/defaultMarker.png"),
1052
- opacity: 1,
1053
- scale: drawParam.parameter.scale || 1
1054
- })
1055
- });
1202
+ style = new ol.style.Style({
1203
+ image: new ol.style.Icon({
1204
+ anchor: [-drawParam.parameter.markerContentX || -15, -drawParam.parameter.markerContentY || -15],
1205
+ anchorXUnits: 'pixels',
1206
+ anchorYUnits: 'pixels',
1207
+ src: drawParam.parameter.url || require("../images/defaultMarker.png"),
1208
+ opacity: 1,
1209
+ scale: drawParam.parameter.scale || 1
1210
+ })
1211
+ });
1056
1212
  var geometryFunction;
1213
+
1057
1214
  switch (drawParam.geometryType) {
1058
1215
  case 'point':
1059
1216
  type = 'Point';
@@ -1068,6 +1225,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1068
1225
  })
1069
1226
  });
1070
1227
  break;
1228
+
1071
1229
  case 'polyline':
1072
1230
  type = 'LineString';
1073
1231
  style = new ol.style.Style({
@@ -1078,6 +1236,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1078
1236
  })
1079
1237
  });
1080
1238
  break;
1239
+
1081
1240
  case 'polygon':
1082
1241
  type = 'Polygon';
1083
1242
  style = new ol.style.Style({
@@ -1091,10 +1250,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1091
1250
  })
1092
1251
  });
1093
1252
  break;
1253
+
1094
1254
  case 'rectangle':
1095
1255
  type = 'Circle';
1096
1256
  geometryFunction = ol.interaction.Draw.createBox();
1097
1257
  break;
1258
+
1098
1259
  case 'circle':
1099
1260
  type = 'Circle';
1100
1261
  style = new ol.style.Style({
@@ -1109,33 +1270,38 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1109
1270
  });
1110
1271
  break;
1111
1272
  }
1273
+
1112
1274
  if (!t.drawToolbar) {
1113
1275
  t.drawToolbar = new ol.interaction.Draw({
1114
1276
  source: t.drawSource,
1115
1277
  type: type,
1116
- geometryFunction: geometryFunction
1117
- // style: style
1278
+ geometryFunction: geometryFunction // style: style
1279
+
1118
1280
  });
1119
1281
  gis.addInteraction(t.drawToolbar);
1120
1282
  } else {
1121
1283
  gis.addInteraction(t.drawToolbar);
1122
1284
  }
1285
+
1123
1286
  t.drawToolbar.on('drawend', function (e) {
1124
1287
  var _t$frameSelectProps$p;
1288
+
1125
1289
  // 关闭绘制事件
1126
- t.drawToolbar.finishDrawing();
1127
- // 移除
1290
+ t.drawToolbar.finishDrawing(); // 移除
1291
+
1128
1292
  gis.removeInteraction(t.drawToolbar);
1129
- var gc = e.feature.getGeometry();
1130
- //返回参数
1131
- var param = {};
1132
- // 绘制内部管理的图元
1293
+ var gc = e.feature.getGeometry(); //返回参数
1294
+
1295
+ var param = {}; // 绘制内部管理的图元
1296
+
1133
1297
  if (t.drawParam.geometryType == 'point') {
1134
1298
  var _gc$flatCoordinates = _slicedToArray(gc.flatCoordinates, 2),
1135
- lng = _gc$flatCoordinates[0],
1136
- lat = _gc$flatCoordinates[1];
1299
+ lng = _gc$flatCoordinates[0],
1300
+ lat = _gc$flatCoordinates[1];
1301
+
1137
1302
  gc.x = lng;
1138
1303
  gc.y = lat;
1304
+
1139
1305
  if (t.GM.isRepetition(t.drawParam.data.id)) {
1140
1306
  t.updatePoint([{
1141
1307
  id: t.drawParam.data.id,
@@ -1152,9 +1318,9 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1152
1318
  url: t.drawParam.parameter.url || require("../images/defaultMarker.png"),
1153
1319
  config: _objectSpread({}, t.drawParam.parameter)
1154
1320
  }], 'point');
1155
- }
1321
+ } //处理点返回参数
1322
+
1156
1323
 
1157
- //处理点返回参数
1158
1324
  param = {
1159
1325
  id: t.drawParam.data.id,
1160
1326
  attributes: {
@@ -1169,11 +1335,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1169
1335
  geometryType: 'point',
1170
1336
  mapLayer: t.GM.getGraphic(t.drawParam.data.id)
1171
1337
  };
1172
- }
1173
- //线
1338
+ } //线
1339
+
1340
+
1174
1341
  if (t.drawParam.geometryType == 'polyline') {
1175
1342
  var oddList = [],
1176
- evenList = [];
1343
+ evenList = [];
1177
1344
  gc.flatCoordinates.map(function (item, index) {
1178
1345
  // 判断下标奇偶数
1179
1346
  if (index % 2 === 0) {
@@ -1185,6 +1352,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1185
1352
  var path = oddList.map(function (item, index) {
1186
1353
  return [evenList[index], oddList[index]];
1187
1354
  });
1355
+
1188
1356
  if (t.GM.isRepetition(t.drawParam.data.id)) {
1189
1357
  t.updateLine([{
1190
1358
  id: t.drawParam.data.id,
@@ -1197,11 +1365,13 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1197
1365
  paths: path,
1198
1366
  config: _objectSpread({}, t.drawParam.parameter)
1199
1367
  }], 'polyline');
1200
- }
1201
- //处理线返回参数
1368
+ } //处理线返回参数
1369
+
1370
+
1202
1371
  var _t$dealData3 = t.dealData(path),
1203
- lnglatAry = _t$dealData3.lnglatAry,
1204
- _extent = _t$dealData3._extent;
1372
+ lnglatAry = _t$dealData3.lnglatAry,
1373
+ _extent = _t$dealData3._extent;
1374
+
1205
1375
  param = {
1206
1376
  lnglatAry: lnglatAry,
1207
1377
  id: t.drawParam.data.id,
@@ -1217,11 +1387,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1217
1387
  geometryType: 'polyline',
1218
1388
  mapLayer: t.GM.getGraphic(t.drawParam.data.id)
1219
1389
  };
1220
- }
1221
- //面
1390
+ } //面
1391
+
1392
+
1222
1393
  if (t.drawParam.geometryType == 'polygon') {
1223
1394
  var _oddList2 = [],
1224
- _evenList2 = [];
1395
+ _evenList2 = [];
1225
1396
  gc.flatCoordinates.map(function (item, index) {
1226
1397
  // 判断下标奇偶数
1227
1398
  if (index % 2 === 0) {
@@ -1230,9 +1401,11 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1230
1401
  _oddList2.push(item);
1231
1402
  }
1232
1403
  });
1404
+
1233
1405
  var _path2 = _oddList2.map(function (item, index) {
1234
1406
  return [_evenList2[index], _oddList2[index]];
1235
1407
  });
1408
+
1236
1409
  if (t.GM.isRepetition(t.drawParam.data.id)) {
1237
1410
  t.updatePolygon([{
1238
1411
  id: t.drawParam.data.id,
@@ -1245,11 +1418,13 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1245
1418
  rings: _path2,
1246
1419
  config: _objectSpread({}, t.drawParam.parameter)
1247
1420
  }], t.drawParam.geometryType);
1248
- }
1249
- //处理线返回参数
1421
+ } //处理线返回参数
1422
+
1423
+
1250
1424
  var _t$dealData4 = t.dealData(_path2),
1251
- _lnglatAry2 = _t$dealData4.lnglatAry,
1252
- _extent3 = _t$dealData4._extent;
1425
+ _lnglatAry2 = _t$dealData4.lnglatAry,
1426
+ _extent3 = _t$dealData4._extent;
1427
+
1253
1428
  param = {
1254
1429
  lnglatAry: _lnglatAry2,
1255
1430
  id: t.drawParam.data.id,
@@ -1267,8 +1442,10 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1267
1442
  mapLayer: t.GM.getGraphic(t.drawParam.data.id)
1268
1443
  };
1269
1444
  }
1445
+
1270
1446
  if (t.drawParam.geometryType == 'rectangle') {
1271
1447
  var _path3 = e.feature.getGeometry().getCoordinates()[0];
1448
+
1272
1449
  if (t.GM.isRepetition(t.drawParam.data.id)) {
1273
1450
  t.updatePolygon([{
1274
1451
  id: t.drawParam.data.id,
@@ -1281,11 +1458,13 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1281
1458
  rings: _path3,
1282
1459
  config: _objectSpread({}, t.drawParam.parameter)
1283
1460
  }], t.drawParam.geometryType);
1284
- }
1285
- //处理线返回参数
1461
+ } //处理线返回参数
1462
+
1463
+
1286
1464
  var _t$dealData5 = t.dealData(_path3),
1287
- _lnglatAry3 = _t$dealData5.lnglatAry,
1288
- _extent4 = _t$dealData5._extent;
1465
+ _lnglatAry3 = _t$dealData5.lnglatAry,
1466
+ _extent4 = _t$dealData5._extent;
1467
+
1289
1468
  param = {
1290
1469
  lnglatAry: _lnglatAry3,
1291
1470
  id: t.drawParam.data.id,
@@ -1303,12 +1482,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1303
1482
  mapLayer: t.GM.getGraphic(t.drawParam.data.id)
1304
1483
  };
1305
1484
  }
1485
+
1306
1486
  if (t.drawParam.geometryType == 'circle') {
1307
1487
  var center = e.feature.getGeometry().getCenter();
1308
1488
  var cur = e.feature.getProperties().geometry;
1309
1489
  var sketchCoords_ = [cur.flatCoordinates[0], cur.flatCoordinates[1]];
1310
1490
  var sketchCoords_2 = [cur.flatCoordinates[2], cur.flatCoordinates[3]];
1311
1491
  var radius = ol.sphere.getDistance(sketchCoords_, sketchCoords_2);
1492
+
1312
1493
  if (t.GM.isRepetition(t.drawParam.data.id)) {
1313
1494
  t.updateCircle([{
1314
1495
  id: t.drawParam.data.id,
@@ -1326,6 +1507,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1326
1507
  config: _objectSpread({}, t.drawParam.parameter)
1327
1508
  }], t.drawParam.geometryType);
1328
1509
  }
1510
+
1329
1511
  param = {
1330
1512
  area: Math.PI * Math.pow(radius, 2),
1331
1513
  attributes: {
@@ -1342,26 +1524,29 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1342
1524
  mapLayer: t.GM.getGraphic(t.drawParam.data.id)
1343
1525
  };
1344
1526
  }
1527
+
1345
1528
  if ('drawEnd' in t.props && typeof t.props.drawEnd == 'function') {
1346
1529
  t.props.drawEnd(param);
1347
1530
  }
1531
+
1348
1532
  if (((_t$frameSelectProps$p = t.frameSelectProps[param.attributes.id]) === null || _t$frameSelectProps$p === void 0 ? void 0 : _t$frameSelectProps$p.callback) instanceof Function) {
1349
1533
  t.frameSelectProps[param.attributes.id].callback(param);
1350
1534
  }
1351
- });
1352
- //保存绘制图元的id便于后期比对
1535
+ }); //保存绘制图元的id便于后期比对
1536
+
1353
1537
  t.state.drawIds[drawParam.geometryType].push(drawParam.data.id);
1354
- }
1355
- // 关闭绘制
1538
+ } // 关闭绘制
1539
+
1356
1540
  }, {
1357
1541
  key: "closeDraw",
1358
1542
  value: function closeDraw() {
1359
1543
  var t = this;
1360
1544
  var gis = t.state.gis;
1545
+
1361
1546
  if (t.drawToolbar) {
1362
1547
  // 关闭绘制事件
1363
- t.drawToolbar.finishDrawing();
1364
- // 移除
1548
+ t.drawToolbar.finishDrawing(); // 移除
1549
+
1365
1550
  gis.removeInteraction(t.drawToolbar);
1366
1551
  t.drawToolbar = null;
1367
1552
  t.drawInfo = {
@@ -1371,6 +1556,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1371
1556
  }
1372
1557
  }
1373
1558
  /*工具方法*/
1559
+
1374
1560
  }, {
1375
1561
  key: "vtxRangingTool",
1376
1562
  value: function vtxRangingTool() {
@@ -1422,8 +1608,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1422
1608
  t.createMeasureTooltip();
1423
1609
  t.createDeleteTooltip();
1424
1610
  t.state.gis.addLayer(t.rangingInfo.drawLayer);
1425
- t.state.gis.addInteraction(t.rangingInfo.draw);
1426
- // 开始监听绘制
1611
+ t.state.gis.addInteraction(t.rangingInfo.draw); // 开始监听绘制
1612
+
1427
1613
  t.rangingInfo.draw.on('drawstart', function (evt) {
1428
1614
  t.rangingInfo.feature = evt.feature;
1429
1615
  var tooltipCoord = evt.coordinate;
@@ -1442,29 +1628,32 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1442
1628
  t.rangingInfo.deleteToolTip.setPosition(tooltipCoord);
1443
1629
  t.rangingInfo.deleteToolTip.setOffset([20, 10]);
1444
1630
  });
1445
- });
1446
- // 双击绘制完成
1631
+ }); // 双击绘制完成
1632
+
1447
1633
  t.rangingInfo.draw.on('drawend', function () {
1448
1634
  t.rangingInfo.measureTooltipElement.className = 'ol-tooltip ol-tooltip-static';
1449
1635
  t.rangingInfo.measureTooltip.setOffset([0, -7]);
1450
1636
  t.rangingInfo.feature = null;
1451
- t.rangingInfo.measureTooltipElement = null;
1452
- // t.createMeasureTooltip();
1637
+ t.rangingInfo.measureTooltipElement = null; // t.createMeasureTooltip();
1638
+
1453
1639
  new ol.Observable.unByKey(t.rangingInfo.listener);
1454
1640
  t.state.gis.removeInteraction(t.rangingInfo.draw);
1641
+
1455
1642
  if ('mapRangingTool' in t.props) {
1456
1643
  t.props.mapRangingTool(obj);
1457
1644
  }
1458
1645
  });
1459
- }
1460
- // 绘图时创建提示
1646
+ } // 绘图时创建提示
1647
+
1461
1648
  }, {
1462
1649
  key: "createHelpTooltip",
1463
1650
  value: function createHelpTooltip() {
1464
1651
  var t = this;
1652
+
1465
1653
  if (t.rangingTool.helpTooltipElement) {
1466
1654
  t.rangingTool.helpTooltipElement.parentNode.removeChild(t.rangingTool.helpTooltipElement);
1467
1655
  }
1656
+
1468
1657
  t.rangingTool.helpTooltipElement = document.createElement('div');
1469
1658
  t.rangingTool.helpTooltipElement.className = 'ol-tooltip hidden';
1470
1659
  t.rangingTool.helpTooltip = new ol.Overlay({
@@ -1473,15 +1662,17 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1473
1662
  positioning: 'center-left'
1474
1663
  });
1475
1664
  t.state.gis.addOverlay(t.rangingTool.helpTooltip);
1476
- }
1477
- // 工具画图提示
1665
+ } // 工具画图提示
1666
+
1478
1667
  }, {
1479
1668
  key: "createMeasureTooltip",
1480
1669
  value: function createMeasureTooltip() {
1481
1670
  var t = this;
1671
+
1482
1672
  if (t.rangingInfo.measureTooltipElement) {
1483
1673
  t.rangingInfo.measureTooltipElement.parentNode.removeChild(t.rangingInfo.measureTooltipElement);
1484
1674
  }
1675
+
1485
1676
  t.rangingInfo.measureTooltipElement = document.createElement('div');
1486
1677
  t.rangingInfo.measureTooltipElement.className = 'ol-tooltip ol-tooltip-measure';
1487
1678
  t.rangingInfo.measureTooltip = new ol.Overlay({
@@ -1492,15 +1683,17 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1492
1683
  insertFirst: false
1493
1684
  });
1494
1685
  t.state.gis.addOverlay(t.rangingInfo.measureTooltip);
1495
- }
1496
- // 创建删除提示
1686
+ } // 创建删除提示
1687
+
1497
1688
  }, {
1498
1689
  key: "createDeleteTooltip",
1499
1690
  value: function createDeleteTooltip() {
1500
1691
  var t = this;
1692
+
1501
1693
  if (t.rangingInfo.deleteToolTipElement) {
1502
1694
  t.rangingInfo.deleteToolTipElement.parentNode.removeChild(t.rangingInfo.deleteToolTipElement);
1503
1695
  }
1696
+
1504
1697
  t.rangingInfo.deleteToolTipElement = document.createElement('div');
1505
1698
  t.rangingInfo.deleteToolTipElement.className = 'ol-tooltip-delete';
1506
1699
  t.rangingInfo.deleteToolTipElement.innerHTML = 'X';
@@ -1527,12 +1720,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1527
1720
  }, {
1528
1721
  key: "formatLength",
1529
1722
  value: function formatLength(line) {
1530
- var flatCoordinates = line.flatCoordinates;
1531
- // const length = new ol.sphere.getDistance([flatCoordinates[0], flatCoordinates[1]],[flatCoordinates[2], flatCoordinates[3]]);
1723
+ var flatCoordinates = line.flatCoordinates; // const length = new ol.sphere.getDistance([flatCoordinates[0], flatCoordinates[1]],[flatCoordinates[2], flatCoordinates[3]]);
1724
+
1532
1725
  var paths = [];
1726
+
1533
1727
  for (var n = 0; n < flatCoordinates.length; n += 2) {
1534
1728
  paths.push([flatCoordinates[n], flatCoordinates[n + 1]]);
1535
1729
  }
1730
+
1536
1731
  var length = 0;
1537
1732
  if (paths.length >= 2) paths.map(function (item, index) {
1538
1733
  if (index <= paths.length - 2) {
@@ -1540,21 +1735,23 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1540
1735
  }
1541
1736
  });
1542
1737
  var output = '';
1738
+
1543
1739
  if (length > 100) {
1544
1740
  output = Math.round(length / 1000 * 100) / 100 + ' ' + 'km';
1545
1741
  } else {
1546
1742
  output = Math.round(length * 100) / 100 + ' ' + 'm';
1547
1743
  }
1744
+
1548
1745
  return output;
1549
1746
  }
1550
1747
  }, {
1551
1748
  key: "getMapExtent",
1552
- value:
1553
- // 获取地图的当前位置状态信息
1749
+ value: // 获取地图的当前位置状态信息
1554
1750
  function getMapExtent() {
1555
1751
  var t = this;
1556
1752
  var gis = t.state.gis;
1557
1753
  var obj = {};
1754
+
1558
1755
  if (gis) {
1559
1756
  var nowBounds = gis.getView().calculateExtent(gis.getSize());
1560
1757
  obj.southWest = {
@@ -1567,10 +1764,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1567
1764
  };
1568
1765
  obj.nowCenter = t.getCenter();
1569
1766
  obj.zoom = t.getZoomLevel();
1767
+
1570
1768
  var _gis$getSize = gis.getSize(),
1571
- _gis$getSize2 = _slicedToArray(_gis$getSize, 2),
1572
- width = _gis$getSize2[0],
1573
- height = _gis$getSize2[1];
1769
+ _gis$getSize2 = _slicedToArray(_gis$getSize, 2),
1770
+ width = _gis$getSize2[0],
1771
+ height = _gis$getSize2[1];
1772
+
1574
1773
  obj.mapSize = {
1575
1774
  width: width,
1576
1775
  height: height
@@ -1578,13 +1777,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1578
1777
  obj.radius = ol.sphere.getDistance([obj.nowCenter.lng, obj.nowCenter.lat], [obj.northEast.lng, obj.northEast.lat]);
1579
1778
  return obj;
1580
1779
  }
1581
- }
1582
- //将制定图元展示在视野内 (强制改变地图中心位置)
1780
+ } //将制定图元展示在视野内 (强制改变地图中心位置)
1781
+
1583
1782
  /*
1584
1783
  参数arg格式如下1,2
1585
1784
  1.string 格式如:'1,a,2,3,4'
1586
1785
  2.数组 ['1','2']
1587
1786
  */
1787
+
1588
1788
  }, {
1589
1789
  key: "setVisiblePoints",
1590
1790
  value: function setVisiblePoints(mapVisiblePoints) {
@@ -1593,50 +1793,64 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1593
1793
  var arg = null;
1594
1794
  var type = mapVisiblePoints.type;
1595
1795
  var ary = []; //图元id集合
1796
+
1596
1797
  var obj = []; //经纬度集合
1798
+
1597
1799
  switch (mapVisiblePoints.fitView) {
1598
1800
  case 'point':
1599
1801
  arg = this.state.pointIds;
1600
1802
  break;
1803
+
1601
1804
  case 'line':
1602
1805
  arg = this.state.lineIds;
1603
1806
  break;
1807
+
1604
1808
  case 'polygon':
1605
1809
  arg = this.state.polygonIds;
1606
1810
  break;
1811
+
1607
1812
  case 'circle':
1608
1813
  arg = this.state.circleIds;
1609
1814
  break;
1815
+
1610
1816
  case 'all':
1611
1817
  arg = this.state.pointIds.concat(this.state.lineIds).concat(this.state.polygonIds).concat(this.state.circleIds);
1612
1818
  break;
1819
+
1613
1820
  default:
1614
1821
  arg = mapVisiblePoints.fitView;
1615
1822
  break;
1616
1823
  }
1824
+
1617
1825
  if (typeof arg === 'string') {
1618
1826
  ary = arg.split(',');
1619
1827
  } else if (arg instanceof Array) {
1620
1828
  ary = arg;
1621
1829
  }
1830
+
1622
1831
  for (var i = 0; i < ary.length; i++) {
1623
1832
  var g = t.GM.getGraphicParam(ary[i]);
1833
+
1624
1834
  if (g) {
1625
1835
  switch (g.geometry.type) {
1626
1836
  case 'point':
1627
1837
  obj.push([g.geometry.x, g.geometry.y]);
1838
+
1628
1839
  case 'circle':
1629
1840
  obj.push([g.geometry.x, g.geometry.y]);
1630
1841
  break;
1842
+
1631
1843
  case 'polyline':
1632
1844
  obj = [].concat(_toConsumableArray(obj), _toConsumableArray(g.geometry.paths));
1633
1845
  break;
1846
+
1634
1847
  case 'polygon':
1635
1848
  obj = [].concat(_toConsumableArray(obj), _toConsumableArray(g.geometry.rings));
1636
1849
  break;
1637
1850
  }
1638
1851
  }
1639
1852
  }
1853
+
1640
1854
  if (obj.length > 0) {
1641
1855
  var displayRange = new ol.extent.boundingExtent(obj);
1642
1856
  gis.getView().fit(displayRange, gis.getSize());
@@ -1646,14 +1860,17 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1646
1860
  key: "getFitView",
1647
1861
  value: function getFitView(ids) {
1648
1862
  var t = this;
1863
+
1649
1864
  if (ids.length > 0) {
1650
1865
  var maxX = null,
1651
- maxY = null,
1652
- minX = null,
1653
- minY = null;
1866
+ maxY = null,
1867
+ minX = null,
1868
+ minY = null;
1869
+
1654
1870
  for (var i = 0; i < ids.length; i++) {
1655
1871
  var coord = t.GM.getGraphic(ids[i]);
1656
1872
  var boundsArry = coord.getGeometry().getExtent();
1873
+
1657
1874
  if (minX === null) {
1658
1875
  minX = boundsArry[0];
1659
1876
  minY = boundsArry[1];
@@ -1666,12 +1883,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1666
1883
  maxY = Math.max(boundsArry[3], maxY);
1667
1884
  }
1668
1885
  }
1886
+
1669
1887
  var bounds = [minX, minY, maxX, maxY];
1670
1888
  return bounds;
1671
1889
  }
1672
1890
  }
1673
1891
  /*功能方法*/
1674
1892
  //获取当前地图的中心位置
1893
+
1675
1894
  }, {
1676
1895
  key: "getCurrentCenter",
1677
1896
  value: function getCurrentCenter() {
@@ -1679,31 +1898,36 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1679
1898
  var gis = t.state.gis;
1680
1899
  var extent = gis.getView().calculateExtent(gis.getSize());
1681
1900
  return [(extent[0] + extent[2]) / 2, (extent[1] + extent[3]) / 2];
1682
- }
1683
- //获取当前比例尺
1901
+ } //获取当前比例尺
1902
+
1684
1903
  }, {
1685
1904
  key: "getZoomLevel",
1686
1905
  value: function getZoomLevel() {
1687
1906
  var t = this;
1688
1907
  return t.state.gis.getView().getZoom();
1689
- }
1690
- //获取图元数据
1908
+ } //获取图元数据
1909
+
1691
1910
  }, {
1692
1911
  key: "getGraphic",
1693
1912
  value: function getGraphic(id) {
1694
1913
  var t = this;
1914
+
1695
1915
  if (!id) {
1696
1916
  return false;
1697
1917
  }
1918
+
1698
1919
  var gp = t.GM.getGraphicParam(id);
1699
1920
  var gg = t.GM.getGraphic(id);
1921
+
1700
1922
  if (!gg) {
1701
1923
  return false;
1702
1924
  }
1925
+
1703
1926
  var p = {},
1704
- pts = [],
1705
- lng = 0,
1706
- lat = 0;
1927
+ pts = [],
1928
+ lng = 0,
1929
+ lat = 0;
1930
+
1707
1931
  switch (gp.geometryType) {
1708
1932
  case 'point':
1709
1933
  lng = gp.geometry.x;
@@ -1724,6 +1948,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1724
1948
  })
1725
1949
  });
1726
1950
  break;
1951
+
1727
1952
  case 'polyline':
1728
1953
  pts = gp.geometry.paths;
1729
1954
  p = _objectSpread(_objectSpread({}, gp), {}, {
@@ -1739,6 +1964,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1739
1964
  })
1740
1965
  });
1741
1966
  break;
1967
+
1742
1968
  case 'polygon':
1743
1969
  pts = gp.geometry.rings;
1744
1970
  p = _objectSpread(_objectSpread({}, gp), {}, {
@@ -1755,6 +1981,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1755
1981
  area: (0, _MapToolFunction.getPolygonArea)(pts)
1756
1982
  });
1757
1983
  break;
1984
+
1758
1985
  case 'circle':
1759
1986
  lng = gp.geometry.x;
1760
1987
  lat = gp.geometry.y;
@@ -1779,17 +2006,18 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1779
2006
  });
1780
2007
  break;
1781
2008
  }
2009
+
1782
2010
  return p;
1783
- }
1784
- // 转换dom节点
2011
+ } // 转换dom节点
2012
+
1785
2013
  }, {
1786
2014
  key: "parseDom",
1787
2015
  value: function parseDom(domStr) {
1788
2016
  var domObj = document.createElement('div');
1789
2017
  domObj.innerHTML = domStr;
1790
2018
  return domObj.childNodes;
1791
- }
1792
- //添加海量点
2019
+ } //添加海量点
2020
+
1793
2021
  }, {
1794
2022
  key: "addPointCollection",
1795
2023
  value: function addPointCollection() {
@@ -1801,10 +2029,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1801
2029
  var p = t.state.gis.getPixelFromCoordinate([d.lng, d.lat]);
1802
2030
  return [p[0], p[1]];
1803
2031
  });
2032
+
1804
2033
  var _t$state$gis$getSize = t.state.gis.getSize(),
1805
- _t$state$gis$getSize2 = _slicedToArray(_t$state$gis$getSize, 2),
1806
- width = _t$state$gis$getSize2[0],
1807
- height = _t$state$gis$getSize2[1];
2034
+ _t$state$gis$getSize2 = _slicedToArray(_t$state$gis$getSize, 2),
2035
+ width = _t$state$gis$getSize2[0],
2036
+ height = _t$state$gis$getSize2[1];
2037
+
1808
2038
  var options = {
1809
2039
  size: d.size,
1810
2040
  shape: d.shape,
@@ -1820,8 +2050,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1820
2050
  });
1821
2051
  VotexpointCollection.draw();
1822
2052
  });
1823
- }
1824
- //更新海量点
2053
+ } //更新海量点
2054
+
1825
2055
  }, {
1826
2056
  key: "updatePointCollection",
1827
2057
  value: function updatePointCollection() {
@@ -1834,10 +2064,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1834
2064
  var p = t.state.gis.getPixelFromCoordinate([d.lng, d.lat]);
1835
2065
  return [p[0], p[1]];
1836
2066
  });
2067
+
1837
2068
  var _t$state$gis$getSize3 = t.state.gis.getSize(),
1838
- _t$state$gis$getSize4 = _slicedToArray(_t$state$gis$getSize3, 2),
1839
- width = _t$state$gis$getSize4[0],
1840
- height = _t$state$gis$getSize4[1];
2069
+ _t$state$gis$getSize4 = _slicedToArray(_t$state$gis$getSize3, 2),
2070
+ width = _t$state$gis$getSize4[0],
2071
+ height = _t$state$gis$getSize4[1];
2072
+
1841
2073
  var options = {
1842
2074
  size: ds.size,
1843
2075
  shape: ds.shape,
@@ -1849,8 +2081,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1849
2081
  }
1850
2082
  });
1851
2083
  });
1852
- }
1853
- //删除海量点
2084
+ } //删除海量点
2085
+
1854
2086
  }, {
1855
2087
  key: "clearPointCollection",
1856
2088
  value: function clearPointCollection() {
@@ -1863,9 +2095,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1863
2095
  }
1864
2096
  });
1865
2097
  });
1866
- }
2098
+ } //删除全部海量点
1867
2099
 
1868
- //删除全部海量点
1869
2100
  }, {
1870
2101
  key: "clearAllPointCollection",
1871
2102
  value: function clearAllPointCollection() {
@@ -1873,24 +2104,26 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1873
2104
  t.morepoints.map(function (item, index) {
1874
2105
  item.value.clear();
1875
2106
  });
1876
- }
1877
- // 框选
2107
+ } // 框选
2108
+
1878
2109
  }, {
1879
2110
  key: "frameSelect",
1880
2111
  value: function frameSelect(_ref2, callback) {
1881
2112
  var geometryType = _ref2.geometryType,
1882
- _ref2$parameter = _ref2.parameter,
1883
- parameter = _ref2$parameter === void 0 ? {} : _ref2$parameter,
1884
- _ref2$data = _ref2.data,
1885
- data = _ref2$data === void 0 ? {} : _ref2$data;
2113
+ _ref2$parameter = _ref2.parameter,
2114
+ parameter = _ref2$parameter === void 0 ? {} : _ref2$parameter,
2115
+ _ref2$data = _ref2.data,
2116
+ data = _ref2$data === void 0 ? {} : _ref2$data;
2117
+
1886
2118
  if (!['polygon', 'circle', 'rectangle'].includes(geometryType)) {
1887
2119
  message.warn("传入的类型不支持框选!");
1888
2120
  return false;
1889
2121
  }
2122
+
1890
2123
  var t = this;
1891
2124
  var params = {},
1892
- type = geometryType || 'polygon',
1893
- id = data.id || "frameSelectFeature_".concat(Math.random());
2125
+ type = geometryType || 'polygon',
2126
+ id = data.id || "frameSelectFeature_".concat(Math.random());
1894
2127
  params.color = parameter.color || '#FF0000';
1895
2128
  params.lineColor = parameter.lineColor || '#FF0000';
1896
2129
  params.lineOpacity = parameter.lineOpacity || 1;
@@ -1909,17 +2142,18 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1909
2142
  id: id,
1910
2143
  type: geometryType
1911
2144
  };
1912
- }
1913
- // 清除框选
2145
+ } // 清除框选
2146
+
1914
2147
  }, {
1915
2148
  key: "clearFrameSelect",
1916
2149
  value: function clearFrameSelect() {
1917
2150
  for (var key in this.frameSelectProps) {
1918
2151
  this.removeGraphic(this.frameSelectProps[key].id, this.frameSelectProps[key].type);
1919
2152
  }
2153
+
1920
2154
  this.frameSelectProps = {};
1921
- }
1922
- // 清除框选ById
2155
+ } // 清除框选ById
2156
+
1923
2157
  }, {
1924
2158
  key: "clearFrameSelectById",
1925
2159
  value: function clearFrameSelectById(id) {
@@ -1934,14 +2168,17 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1934
2168
  * @content: String|HTML
1935
2169
  * @close: boolean
1936
2170
  */
2171
+
1937
2172
  }, {
1938
2173
  key: "showInfoWindow",
1939
2174
  value: function showInfoWindow() {
1940
2175
  var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
1941
2176
  var t = this;
2177
+
1942
2178
  if (t.popupWindow) {
1943
2179
  t.hideInfoWindow();
1944
2180
  }
2181
+
1945
2182
  t.popupWindow = new Popup({
1946
2183
  map: t.state.gis,
1947
2184
  position: params.position,
@@ -1954,31 +2191,38 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1954
2191
  key: "hideInfoWindow",
1955
2192
  value: function hideInfoWindow() {
1956
2193
  var t = this;
2194
+
1957
2195
  if (t.popupWindow) {
1958
2196
  t.popupWindow.removePopup();
1959
2197
  }
2198
+
1960
2199
  t.popupWindow = null;
1961
- }
1962
- // 添加点
2200
+ } // 添加点
2201
+
1963
2202
  }, {
1964
2203
  key: "addPoint",
1965
2204
  value: function addPoint(mapPoints, type) {
1966
- var _this2 = this;
2205
+ var _this3 = this;
2206
+
1967
2207
  var t = this;
1968
2208
  var ps = [];
2209
+
1969
2210
  var psids = _toConsumableArray(t.state.pointIds);
2211
+
1970
2212
  mapPoints.map(function (item, index) {
1971
2213
  //如果id重复,直接跳过不执行.
1972
- if (_this2.GM.isRepetition(item.id)) {
2214
+ if (_this3.GM.isRepetition(item.id)) {
1973
2215
  console.warn("\u52A0\u70B9id: ".concat(item.id, " \u91CD\u590D"));
1974
2216
  return false;
1975
- }
1976
- //点位数据不符合,直接跳过
2217
+ } //点位数据不符合,直接跳过
2218
+
2219
+
1977
2220
  if (!item.longitude || !item.latitude) {
1978
2221
  console.warn("\u70B9 \u7ECF\u7EAC\u5EA6 \u6570\u636E\u9519\u8BEF");
1979
2222
  return false;
1980
- }
1981
- // 创建点位图元要素
2223
+ } // 创建点位图元要素
2224
+
2225
+
1982
2226
  var feature = new ol.Feature({
1983
2227
  geometry: new ol.geom.Point([parseFloat(item.longitude), parseFloat(item.latitude)]),
1984
2228
  name: item.name,
@@ -1996,23 +2240,25 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
1996
2240
  zIndex: 100,
1997
2241
  deg: 0,
1998
2242
  scale: 1
1999
- };
2000
- //初始化默认数据
2243
+ }; //初始化默认数据
2244
+
2001
2245
  if (item.config) {
2002
2246
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2003
- }
2004
- // 覆盖物样式参数
2247
+ } // 覆盖物样式参数
2248
+
2249
+
2005
2250
  var style, icon, txt;
2006
2251
  var myImage = new Image(cg.width, cg.height);
2252
+
2007
2253
  if (!!item.markerContent) {
2008
- var nodes = t.parseDom(item.markerContent)[0];
2009
- // 自定义图层需要把事件加在dom上
2254
+ var nodes = t.parseDom(item.markerContent)[0]; // 自定义图层需要把事件加在dom上
2255
+
2010
2256
  nodes.addEventListener("click", function (e) {
2011
2257
  t.clickGraphic(item.id, _objectSpread(_objectSpread({}, e), {}, {
2012
2258
  pixel: [e.clientX, e.clientY]
2013
2259
  }));
2014
- });
2015
- // 创建地图自定义覆盖物
2260
+ }); // 创建地图自定义覆盖物
2261
+
2016
2262
  var pop = new ol.Overlay({
2017
2263
  id: item.id,
2018
2264
  position: [parseFloat(item.longitude), parseFloat(item.latitude)],
@@ -2031,8 +2277,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2031
2277
  height: cg.height
2032
2278
  }, function (base64) {
2033
2279
  myImage.src = base64;
2034
- });
2035
- // 创建地图要素图标样式
2280
+ }); // 创建地图要素图标样式
2281
+
2036
2282
  style = new ol.style.Style({
2037
2283
  image: new ol.style.Icon({
2038
2284
  anchor: [-cg.markerContentX, -cg.markerContentY],
@@ -2045,6 +2291,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2045
2291
  })
2046
2292
  });
2047
2293
  }
2294
+
2048
2295
  if (!!item.canShowLabel && item.canShowLabel) {
2049
2296
  var textStyle = _objectSpread({
2050
2297
  textAlign: 'center',
@@ -2069,17 +2316,20 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2069
2316
  }),
2070
2317
  padding: [2, 5, 2, 5]
2071
2318
  }, cg.labelStyle || {});
2319
+
2072
2320
  if (cg.labelStyle && cg.labelStyle.fill) {
2073
2321
  textStyle['fill'] = new ol.style.Fill({
2074
2322
  color: cg.labelStyle.fill
2075
2323
  });
2076
2324
  }
2325
+
2077
2326
  if (cg.labelStyle && cg.labelStyle.backgroundFill) {
2078
2327
  textStyle['backgroundFill'] = new ol.style.Fill({
2079
2328
  color: cg.labelStyle.backgroundFill
2080
2329
  });
2081
- }
2082
- // 创建地图要素图标样式
2330
+ } // 创建地图要素图标样式
2331
+
2332
+
2083
2333
  style = new ol.style.Style({
2084
2334
  image: new ol.style.Icon({
2085
2335
  anchor: [-cg.markerContentX, -cg.markerContentY],
@@ -2095,8 +2345,9 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2095
2345
  text: new ol.style.Text(textStyle)
2096
2346
  });
2097
2347
  }
2098
- feature.setStyle(style);
2099
- // 初始化适量数据源
2348
+
2349
+ feature.setStyle(style); // 初始化适量数据源
2350
+
2100
2351
  var source = new ol.source.Vector({
2101
2352
  features: [feature],
2102
2353
  name: 'point',
@@ -2110,17 +2361,19 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2110
2361
  t.pointLayers.push({
2111
2362
  id: item.id,
2112
2363
  layer: pointLayer
2113
- });
2114
- //添加点位图层
2364
+ }); //添加点位图层
2365
+
2115
2366
  t.state.gis.addLayer(pointLayer);
2367
+
2116
2368
  if (!item.markerContent && cg.BAnimationType == 0) {
2117
2369
  marker.setAnimation(BMAP_ANIMATION_BOUNCE);
2118
2370
  } else if (!item.markerContent && cg.BAnimationType == 1) {
2119
2371
  marker.setAnimation(BMAP_ANIMATION_DROP);
2120
2372
  }
2121
- psids.push(item.id);
2122
- //缓存图元的数据,偏于后期操作
2123
- _this2.GM.setGraphic(item.id, feature).setGraphicParam(item.id, {
2373
+
2374
+ psids.push(item.id); //缓存图元的数据,偏于后期操作
2375
+
2376
+ _this3.GM.setGraphic(item.id, feature).setGraphicParam(item.id, {
2124
2377
  attributes: _objectSpread(_objectSpread({}, item), {}, {
2125
2378
  other: item
2126
2379
  }),
@@ -2133,28 +2386,32 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2133
2386
  source: source
2134
2387
  });
2135
2388
  });
2389
+
2136
2390
  if (type !== 'defined') {
2137
2391
  // t.state.pointIds = psids;
2138
2392
  t.setState({
2139
2393
  pointIds: psids
2140
2394
  });
2141
2395
  }
2142
- }
2143
- //更新点
2396
+ } //更新点
2397
+
2144
2398
  }, {
2145
2399
  key: "updatePoint",
2146
2400
  value: function updatePoint() {
2147
- var _this3 = this;
2401
+ var _this4 = this;
2402
+
2148
2403
  var mapPoints = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
2149
2404
  var t = this;
2150
2405
  var index = 0;
2406
+
2151
2407
  var dealPoint = function dealPoint(item) {
2152
- if (_this3.GM.isRepetition(item.id)) {
2408
+ if (_this4.GM.isRepetition(item.id)) {
2153
2409
  //点位数据不符合,直接跳过
2154
2410
  if (!item.longitude || !item.latitude) {
2155
2411
  console.warn("\u70B9 \u7ECF\u7EAC\u5EA6 \u6570\u636E\u9519\u8BEF");
2156
2412
  return false;
2157
2413
  }
2414
+
2158
2415
  var gc = t.GM.getGraphic(item.id);
2159
2416
  var gp = t.GM.getGraphicParam(item.id);
2160
2417
  var cg = {
@@ -2169,11 +2426,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2169
2426
  markerContentY: -30,
2170
2427
  deg: 0
2171
2428
  };
2429
+
2172
2430
  if (item.config) {
2173
2431
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2174
2432
  }
2433
+
2175
2434
  var text, icon, _marker;
2435
+
2176
2436
  var myImage = new Image(cg.width, cg.height);
2437
+
2177
2438
  if (item.markerContent) {
2178
2439
  var overlay = t.state.gis.getOverlayById(item.id);
2179
2440
  var nodes = t.parseDom(item.markerContent)[0];
@@ -2203,6 +2464,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2203
2464
  scale: cg.scale || 1,
2204
2465
  rotation: Math.PI / 180 * cg.deg
2205
2466
  });
2467
+
2206
2468
  if (item.canShowLabel) {
2207
2469
  var textStyle = _objectSpread({
2208
2470
  textAlign: 'center',
@@ -2227,18 +2489,22 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2227
2489
  }),
2228
2490
  padding: [2, 5, 2, 5]
2229
2491
  }, cg.labelStyle || {});
2492
+
2230
2493
  if (cg.labelStyle && cg.labelStyle.fill) {
2231
2494
  textStyle['fill'] = new ol.style.Fill({
2232
2495
  color: cg.labelStyle.fill
2233
2496
  });
2234
2497
  }
2498
+
2235
2499
  if (cg.labelStyle && cg.labelStyle.backgroundFill) {
2236
2500
  textStyle['backgroundFill'] = new ol.style.Fill({
2237
2501
  color: cg.labelStyle.backgroundFill
2238
2502
  });
2239
2503
  }
2504
+
2240
2505
  text = new ol.style.Text(textStyle);
2241
2506
  }
2507
+
2242
2508
  if (text) {
2243
2509
  gc.setStyle(new ol.style.Style({
2244
2510
  image: icon,
@@ -2250,8 +2516,10 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2250
2516
  }));
2251
2517
  }
2252
2518
  }
2519
+
2253
2520
  gc.setGeometry(new ol.geom.Point([parseFloat(item.longitude), parseFloat(item.latitude)]));
2254
- _this3.GM.setGraphicParam(item.id, {
2521
+
2522
+ _this4.GM.setGraphicParam(item.id, {
2255
2523
  attributes: _objectSpread(_objectSpread({}, item), {}, {
2256
2524
  other: item
2257
2525
  }),
@@ -2267,6 +2535,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2267
2535
  console.warn("\u66F4\u65B0\u7684\u70B9\u4F4Did\u4E0D\u5B58\u5728!");
2268
2536
  return false;
2269
2537
  }
2538
+
2270
2539
  if (index < mapPoints.length - 1) {
2271
2540
  requestIdleCallback(function () {
2272
2541
  return dealPoint(mapPoints[++index]);
@@ -2275,13 +2544,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2275
2544
  t.refresh();
2276
2545
  }
2277
2546
  };
2547
+
2278
2548
  if (!(0, _lodash.isEmpty)(mapPoints)) {
2279
2549
  requestIdleCallback(function () {
2280
2550
  return dealPoint(mapPoints[index]);
2281
2551
  });
2282
2552
  }
2283
- }
2284
- // 更新图层
2553
+ } // 更新图层
2554
+
2285
2555
  }, {
2286
2556
  key: "refresh",
2287
2557
  value: function refresh() {
@@ -2290,27 +2560,32 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2290
2560
  clearTimeout(timer);
2291
2561
  window.VtxMap[t.props.mapId].redrawText();
2292
2562
  }, 100);
2293
- }
2294
- // 添加先
2563
+ } // 添加先
2564
+
2295
2565
  }, {
2296
2566
  key: "addLine",
2297
2567
  value: function addLine(mapLines, type) {
2298
- var _this4 = this;
2568
+ var _this5 = this;
2569
+
2299
2570
  var t = this;
2300
2571
  var ls = [];
2301
- var lsids = _toConsumableArray(t.state.lineIds);
2302
- //遍历添加线(图元)
2572
+
2573
+ var lsids = _toConsumableArray(t.state.lineIds); //遍历添加线(图元)
2574
+
2575
+
2303
2576
  mapLines.map(function (item, index) {
2304
2577
  //如果id重复,直接跳过不执行.
2305
- if (_this4.GM.isRepetition(item.id)) {
2578
+ if (_this5.GM.isRepetition(item.id)) {
2306
2579
  console.warn("\u591A\u6298\u7EBFid: ".concat(item.id, " \u91CD\u590D"));
2307
2580
  return false;
2308
- }
2309
- //多折线点位数据不符合,直接跳过
2581
+ } //多折线点位数据不符合,直接跳过
2582
+
2583
+
2310
2584
  if (!(item.paths && item.paths.length >= 2)) {
2311
2585
  console.warn("\u591A\u6298\u7EBFpaths\u6570\u636E\u9519\u8BEF");
2312
2586
  return false;
2313
2587
  }
2588
+
2314
2589
  var cg = {
2315
2590
  color: '#277ffa',
2316
2591
  pellucidity: 0.9,
@@ -2318,9 +2593,11 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2318
2593
  lineType: 'solid',
2319
2594
  isHidden: false
2320
2595
  };
2596
+
2321
2597
  if (item.config) {
2322
2598
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2323
2599
  }
2600
+
2324
2601
  var style = new ol.style.Style({
2325
2602
  stroke: new ol.style.Stroke({
2326
2603
  color: cg.color,
@@ -2344,12 +2621,13 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2344
2621
  id: item.id,
2345
2622
  source: source
2346
2623
  });
2347
- t.state.gis.addLayer(lineLayer);
2348
- //缓存图元的数据,便于后期操作
2624
+ t.state.gis.addLayer(lineLayer); //缓存图元的数据,便于后期操作
2625
+
2349
2626
  var pts = item.paths.map(function (itt, ind) {
2350
2627
  return _toConsumableArray(itt);
2351
2628
  });
2352
- _this4.GM.setGraphic(item.id, polyline).setGraphicParam(item.id, {
2629
+
2630
+ _this5.GM.setGraphic(item.id, polyline).setGraphicParam(item.id, {
2353
2631
  attributes: _objectSpread(_objectSpread({}, item), {}, {
2354
2632
  paths: pts,
2355
2633
  other: item
@@ -2361,30 +2639,34 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2361
2639
  },
2362
2640
  source: source
2363
2641
  });
2642
+
2364
2643
  ls.push(polyline);
2365
2644
  lsids.push(item.id);
2366
2645
  t.state.lineIds.push(item.id);
2367
2646
  });
2647
+
2368
2648
  if (type !== 'defined') {
2369
2649
  t.state.lineIds = lsids;
2370
2650
  }
2371
- }
2372
- //更新线
2651
+ } //更新线
2652
+
2373
2653
  }, {
2374
2654
  key: "updateLine",
2375
2655
  value: function updateLine(mapLines) {
2376
- var _this5 = this;
2377
- var t = this;
2378
- //遍历添加线(图元)
2656
+ var _this6 = this;
2657
+
2658
+ var t = this; //遍历添加线(图元)
2659
+
2379
2660
  mapLines.map(function (item, index) {
2380
2661
  //判断图元是否存在.
2381
- if (_this5.GM.isRepetition(item.id)) {
2662
+ if (_this6.GM.isRepetition(item.id)) {
2382
2663
  //多折线点位数据不符合,直接跳过
2383
2664
  if (!(item.paths && item.paths.length >= 2)) {
2384
2665
  console.warn("\u591A\u6298\u7EBFpaths\u6570\u636E\u9519\u8BEF");
2385
2666
  return false;
2386
- }
2387
- //初始化默认参数
2667
+ } //初始化默认参数
2668
+
2669
+
2388
2670
  var cg = {
2389
2671
  color: '#277ffa',
2390
2672
  pellucidity: 0.9,
@@ -2392,14 +2674,17 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2392
2674
  lineType: 'solid',
2393
2675
  //'solid' 'dashed'
2394
2676
  isHidden: false
2395
- };
2396
- //获取原有的图元
2397
- var gc = _this5.GM.getGraphic(item.id);
2398
- var gp = _this5.GM.getGraphicParam(item.id);
2399
- //重新初始化值
2677
+ }; //获取原有的图元
2678
+
2679
+ var gc = _this6.GM.getGraphic(item.id);
2680
+
2681
+ var gp = _this6.GM.getGraphicParam(item.id); //重新初始化值
2682
+
2683
+
2400
2684
  if (item.config) {
2401
2685
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2402
2686
  }
2687
+
2403
2688
  var pts = item.paths.map(function (itt, ind) {
2404
2689
  return _toConsumableArray(itt);
2405
2690
  });
@@ -2415,7 +2700,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2415
2700
  return style;
2416
2701
  });
2417
2702
  gc.setGeometry(new ol.geom.LineString(pts));
2418
- _this5.GM.setGraphicParam(item.id, {
2703
+
2704
+ _this6.GM.setGraphicParam(item.id, {
2419
2705
  attributes: _objectSpread(_objectSpread({}, item), {}, {
2420
2706
  paths: pts,
2421
2707
  other: item
@@ -2432,27 +2718,32 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2432
2718
  return false;
2433
2719
  }
2434
2720
  });
2435
- }
2436
- //添加面
2721
+ } //添加面
2722
+
2437
2723
  }, {
2438
2724
  key: "addPolygon",
2439
2725
  value: function addPolygon(mapPolygons) {
2440
- var _this6 = this;
2726
+ var _this7 = this;
2727
+
2441
2728
  var t = this;
2442
2729
  var pgs = [];
2443
- var pgsids = _toConsumableArray(t.state.polygonIds);
2444
- //遍历添加面(图元)
2730
+
2731
+ var pgsids = _toConsumableArray(t.state.polygonIds); //遍历添加面(图元)
2732
+
2733
+
2445
2734
  mapPolygons.map(function (item, index) {
2446
2735
  //如果id重复,直接跳过不执行.
2447
- if (_this6.GM.isRepetition(item.id)) {
2736
+ if (_this7.GM.isRepetition(item.id)) {
2448
2737
  console.warn("\u591A\u8FB9\u5F62id: ".concat(item.id, " \u91CD\u590D"));
2449
2738
  return false;
2450
- }
2451
- //多边形点位数据不符合,直接跳过
2739
+ } //多边形点位数据不符合,直接跳过
2740
+
2741
+
2452
2742
  if (!(item.rings && item.rings.length >= 3)) {
2453
2743
  console.warn("\u591A\u8FB9\u5F62rings\u6570\u636E\u9519\u8BEF");
2454
2744
  return false;
2455
2745
  }
2746
+
2456
2747
  var cg = {
2457
2748
  lineType: 'solid',
2458
2749
  lineWidth: 5,
@@ -2461,9 +2752,11 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2461
2752
  color: '#fff',
2462
2753
  pellucidity: 0.5
2463
2754
  };
2755
+
2464
2756
  if (item.config) {
2465
2757
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2466
2758
  }
2759
+
2467
2760
  var style = new ol.style.Style({
2468
2761
  stroke: new ol.style.Stroke({
2469
2762
  color: cg.lineColor,
@@ -2490,12 +2783,13 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2490
2783
  id: item.id,
2491
2784
  source: source
2492
2785
  });
2493
- t.state.gis.addLayer(polygonLayer);
2494
- //缓存图元的数据,便于后期操作
2786
+ t.state.gis.addLayer(polygonLayer); //缓存图元的数据,便于后期操作
2787
+
2495
2788
  var pts = item.rings.map(function (itt, ind) {
2496
2789
  return _toConsumableArray(itt);
2497
2790
  });
2498
- _this6.GM.setGraphic(item.id, polygon).setGraphicParam(item.id, {
2791
+
2792
+ _this7.GM.setGraphic(item.id, polygon).setGraphicParam(item.id, {
2499
2793
  attributes: _objectSpread(_objectSpread({}, item), {}, {
2500
2794
  rings: pts,
2501
2795
  other: item
@@ -2507,29 +2801,33 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2507
2801
  },
2508
2802
  source: source
2509
2803
  });
2804
+
2510
2805
  pgs.push(polygon);
2511
2806
  pgsids.push(item.id);
2512
2807
  });
2513
2808
  t.state.polygonIds = pgsids;
2514
- }
2515
- //更新面
2809
+ } //更新面
2810
+
2516
2811
  }, {
2517
2812
  key: "updatePolygon",
2518
2813
  value: function updatePolygon(mapPolygons) {
2519
- var _this7 = this;
2814
+ var _this8 = this;
2815
+
2520
2816
  var t = this;
2521
2817
  mapPolygons.map(function (item, index) {
2522
2818
  //判断图元是否存在.
2523
- if (_this7.GM.isRepetition(item.id)) {
2819
+ if (_this8.GM.isRepetition(item.id)) {
2524
2820
  //多边形点位数据不符合,直接跳过
2525
2821
  if (!(item.rings && item.rings.length >= 3)) {
2526
2822
  console.warn("\u591A\u8FB9\u5F62rings\u6570\u636E\u9519\u8BEF");
2527
2823
  return false;
2528
- }
2529
- //获取原有的图元
2530
- var gc = _this7.GM.getGraphic(item.id);
2531
- var gp = t.GM.getGraphicParam(item.id);
2532
- //获取原有的面属性,转换key值
2824
+ } //获取原有的图元
2825
+
2826
+
2827
+ var gc = _this8.GM.getGraphic(item.id);
2828
+
2829
+ var gp = t.GM.getGraphicParam(item.id); //获取原有的面属性,转换key值
2830
+
2533
2831
  var cg = {
2534
2832
  lineType: 'solid',
2535
2833
  lineWidth: 5,
@@ -2537,11 +2835,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2537
2835
  lineOpacity: 1,
2538
2836
  color: '#fff',
2539
2837
  pellucidity: 0.5
2540
- };
2541
- //重新初始化值
2838
+ }; //重新初始化值
2839
+
2542
2840
  if (item.config) {
2543
2841
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2544
2842
  }
2843
+
2545
2844
  var pts = item.rings.map(function (itt, ind) {
2546
2845
  return _toConsumableArray(itt);
2547
2846
  });
@@ -2556,7 +2855,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2556
2855
  color: cg.pellucidity ? getRgbColor(cg.color, cg.pellucidity) : cg.color
2557
2856
  })
2558
2857
  }));
2559
- _this7.GM.setGraphicParam(item.id, {
2858
+
2859
+ _this8.GM.setGraphicParam(item.id, {
2560
2860
  attributes: _objectSpread(_objectSpread({}, item), {}, {
2561
2861
  rings: pts,
2562
2862
  other: item
@@ -2573,39 +2873,46 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2573
2873
  return false;
2574
2874
  }
2575
2875
  });
2576
- }
2577
- //添加圆 circle
2876
+ } //添加圆 circle
2877
+
2578
2878
  }, {
2579
2879
  key: "addCircle",
2580
2880
  value: function addCircle(mapCircles, type) {
2581
2881
  var t = this;
2882
+
2582
2883
  var ccsids = _toConsumableArray(t.state.circleIds);
2884
+
2583
2885
  if (type) {
2584
2886
  ccsids = _toConsumableArray(t.state.drawIds[type]);
2585
2887
  }
2888
+
2586
2889
  mapCircles.map(function (item, index) {
2587
2890
  //如果id重复,直接跳过不执行.
2588
2891
  if (t.GM.isRepetition(item.id)) {
2589
2892
  console.warn("\u5706id: ".concat(item.id, " \u91CD\u590D"));
2590
2893
  return false;
2591
- }
2592
- //圆 点位数据不符合,直接跳过
2894
+ } //圆 点位数据不符合,直接跳过
2895
+
2896
+
2593
2897
  if (!item.longitude || !item.latitude) {
2594
2898
  console.warn("\u5706 \u7ECF\u7EAC\u5EA6 \u6570\u636E\u9519\u8BEF");
2595
2899
  return false;
2596
2900
  }
2901
+
2597
2902
  var cg = {
2598
2903
  lineType: 'solid',
2599
2904
  lineWidth: 5,
2600
2905
  lineColor: '#277ffa',
2601
2906
  lineOpacity: 1,
2602
2907
  color: '#fff',
2603
- pellucidity: 0.5
2604
- // isHidden: false //后期需要在加
2908
+ pellucidity: 0.5 // isHidden: false //后期需要在加
2909
+
2605
2910
  };
2911
+
2606
2912
  if (item.config) {
2607
2913
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2608
2914
  }
2915
+
2609
2916
  var style = new ol.style.Style({
2610
2917
  stroke: new ol.style.Stroke({
2611
2918
  color: cg.lineColor,
@@ -2650,15 +2957,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2650
2957
  },
2651
2958
  source: source
2652
2959
  });
2653
- });
2654
- //添加绘制点
2960
+ }); //添加绘制点
2961
+
2655
2962
  if (type) {
2656
2963
  t.state.drawIds = _objectSpread(_objectSpread({}, t.state.drawIds), {}, _defineProperty({}, type, ccsids));
2657
2964
  } else {
2658
2965
  t.state.circleIds = ccsids;
2659
2966
  }
2660
- }
2661
- //更新圆
2967
+ } //更新圆
2968
+
2662
2969
  }, {
2663
2970
  key: "updateCircle",
2664
2971
  value: function updateCircle(mapCircles) {
@@ -2674,23 +2981,26 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2674
2981
  } else {
2675
2982
  console.warn("\u66F4\u65B0\u7684\u5706id\u4E0D\u5B58\u5728!");
2676
2983
  return false;
2677
- }
2678
- //获取原有的图元
2984
+ } //获取原有的图元
2985
+
2986
+
2679
2987
  var gc = t.GM.getGraphic(item.id);
2680
- var gp = t.GM.getGraphicParam(item.id);
2681
- //获取原有的面属性,转换key值
2988
+ var gp = t.GM.getGraphicParam(item.id); //获取原有的面属性,转换key值
2989
+
2682
2990
  var cg = {
2683
2991
  lineType: 'solid',
2684
2992
  lineWidth: 5,
2685
2993
  lineColor: '#277ffa',
2686
2994
  lineOpacity: 1,
2687
2995
  color: '#fff',
2688
- pellucidity: 0.5
2689
- // isHidden: false //后期需要在加
2996
+ pellucidity: 0.5 // isHidden: false //后期需要在加
2997
+
2690
2998
  };
2999
+
2691
3000
  if (item.config) {
2692
3001
  cg = _objectSpread(_objectSpread({}, cg), item.config);
2693
3002
  }
3003
+
2694
3004
  var metersPerUnit = t.state.gis.getView().getProjection().getMetersPerUnit();
2695
3005
  var circleRadius = item.radius / metersPerUnit;
2696
3006
  gc.setGeometry(new ol.geom.Circle([item.longitude, item.latitude], parseFloat(circleRadius)));
@@ -2717,106 +3027,126 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2717
3027
  },
2718
3028
  source: gp.source
2719
3029
  });
2720
- });
2721
- //刷新图元
2722
- }
2723
- // 工具方法
3030
+ }); //刷新图元
3031
+ } // 工具方法
2724
3032
  //删除图元
3033
+
2725
3034
  }, {
2726
3035
  key: "removeGraphic",
2727
3036
  value: function removeGraphic(id, type) {
2728
3037
  var t = this;
2729
3038
  var graphic = t.GM.getGraphic(id);
2730
- var gp = t.GM.getGraphicParam(id);
2731
- //刪除label
3039
+ var gp = t.GM.getGraphicParam(id); //刪除label
3040
+
2732
3041
  if (t.Label[id]) {
2733
3042
  t.Label[id].html.remove();
2734
3043
  delete t.Label[id];
2735
3044
  }
3045
+
2736
3046
  if (!!graphic) {
2737
3047
  //清除聚合点 避免异常
2738
3048
  // t._cluster.removeMarker(this.GM.getGraphic(id));
2739
3049
  //清除地图中图元
2740
3050
  // const layers = t.state.gis.getLayers().getArray();
2741
3051
  // const layer = layers.filter(item => item.getProperties().name == type)[0];
2742
- gp.source.removeFeature(graphic);
2743
- // layer && layer.getSource().removeFeature(graphic);
3052
+ gp.source.removeFeature(graphic); // layer && layer.getSource().removeFeature(graphic);
2744
3053
  //清除对应id的图元数据缓存
3054
+
2745
3055
  t.GM.removeGraphic(id);
2746
3056
  t.GM.removeGraphicParam(id);
3057
+
2747
3058
  if (t.state.gis.getOverlayById(id)) {
2748
3059
  t.state.gis.removeOverlay(t.state.gis.getOverlayById(id));
2749
3060
  }
2750
3061
  } else {
2751
3062
  return false;
2752
3063
  }
3064
+
2753
3065
  for (var i = 0; i < t.movePoints.length; i++) {
2754
3066
  if (t.movePoints[i].id == id) {
2755
3067
  t.movePoints.splice(i, 1);
2756
3068
  continue;
2757
3069
  }
2758
3070
  }
3071
+
2759
3072
  var ids = [];
3073
+
2760
3074
  switch (type) {
2761
3075
  case 'point':
2762
3076
  ids = t.state.pointIds;
2763
3077
  break;
3078
+
2764
3079
  case 'line':
2765
3080
  ids = t.state.lineIds;
2766
3081
  break;
3082
+
2767
3083
  case 'polygon':
2768
3084
  ids = t.state.polygonIds;
2769
3085
  break;
3086
+
2770
3087
  case 'circle':
2771
3088
  ids = t.state.circleIds;
2772
3089
  break;
3090
+
2773
3091
  case 'draw':
2774
3092
  if (t.state.drawIds.point.indexOf(id) > -1) {
2775
3093
  t.state.drawIds.point.splice(t.state.drawIds.point.indexOf(id), 1);
2776
3094
  }
3095
+
2777
3096
  if (t.state.drawIds.polyline.indexOf(id) > -1) {
2778
3097
  t.state.drawIds.polyline.splice(t.state.drawIds.polyline.indexOf(id), 1);
2779
3098
  }
3099
+
2780
3100
  if (t.state.drawIds.polygon.indexOf(id) > -1) {
2781
3101
  t.state.drawIds.polygon.splice(t.state.drawIds.polygon.indexOf(id), 1);
2782
3102
  }
3103
+
2783
3104
  if (t.state.drawIds.circle.indexOf(id) > -1) {
2784
3105
  t.state.drawIds.circle.splice(t.state.drawIds.circle.indexOf(id), 1);
2785
3106
  }
3107
+
2786
3108
  if (t.state.drawIds.rectangle.indexOf(id) > -1) {
2787
3109
  t.state.drawIds.rectangle.splice(t.state.drawIds.rectangle.indexOf(id), 1);
2788
3110
  }
3111
+
2789
3112
  break;
3113
+
2790
3114
  default:
2791
3115
  if (t.state.pointIds.indexOf(id) > -1) {
2792
3116
  t.state.pointIds.splice(t.state.pointIds.indexOf(id), 1);
2793
3117
  }
3118
+
2794
3119
  if (t.state.lineIds.indexOf(id) > -1) {
2795
3120
  t.state.lineIds.splice(t.state.lineIds.indexOf(id), 1);
2796
3121
  }
3122
+
2797
3123
  if (t.state.polygonIds.indexOf(id) > -1) {
2798
3124
  t.state.polygonIds.splice(t.state.polygonIds.indexOf(id), 1);
2799
3125
  }
3126
+
2800
3127
  if (t.state.circleIds.indexOf(id) > -1) {
2801
3128
  t.state.circleIds.splice(t.state.circleIds.indexOf(id), 1);
2802
3129
  }
3130
+
2803
3131
  break;
2804
3132
  }
3133
+
2805
3134
  if (id == t.state.editId) {
2806
3135
  t.state.editId = '';
2807
3136
  }
3137
+
2808
3138
  if (ids.indexOf(id) != -1) {
2809
3139
  ids.splice(ids.indexOf(id), 1);
2810
3140
  }
2811
- }
2812
- //清空地图
3141
+ } //清空地图
3142
+
2813
3143
  }, {
2814
3144
  key: "clearAll",
2815
3145
  value: function clearAll() {
2816
3146
  var t = this;
2817
3147
  var gis = t.state.gis;
2818
- var layers = gis.getLayers();
2819
- //清空热力图
3148
+ var layers = gis.getLayers(); //清空热力图
3149
+
2820
3150
  if (t.heatmap) {
2821
3151
  var hMap = layers.filter(function (item) {
2822
3152
  return item.name == 'heatMap';
@@ -2824,6 +3154,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2824
3154
  hMap.getSource().clear();
2825
3155
  gis.removeLayer(layer);
2826
3156
  }
3157
+
2827
3158
  t.heatmap = null;
2828
3159
  t.movePoints = [];
2829
3160
  t.state.pointIds = [];
@@ -2833,6 +3164,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2833
3164
  });
2834
3165
  t.clearAllPointCollection();
2835
3166
  t.closeDraw();
3167
+
2836
3168
  if (t.clusterInfo.clusterHulls || t.clusterInfo.clusters || t.clusterInfo.clusterCircles) {
2837
3169
  t.clusterHulls.getSource().clear();
2838
3170
  t.clusterInfo.clusterSource = null;
@@ -2842,69 +3174,82 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2842
3174
  t.clusterInfo.clusterHulls = null;
2843
3175
  t.clusterInfo.clusters = null;
2844
3176
  t.clusterInfo.clusterCircles = null;
2845
- }
2846
- //清空缓存数据
2847
- t.GM.clearAll();
2848
- //循环所有id删除
3177
+ } //清空缓存数据
3178
+
3179
+
3180
+ t.GM.clearAll(); //循环所有id删除
3181
+
2849
3182
  var _t$state = t.state,
2850
- pointIds = _t$state.pointIds,
2851
- lineIds = _t$state.lineIds,
2852
- polygonIds = _t$state.polygonIds,
2853
- circleIds = _t$state.circleIds,
2854
- drawIds = _t$state.drawIds;
2855
- //拷贝数组,避免原数组操作,影响循环
3183
+ pointIds = _t$state.pointIds,
3184
+ lineIds = _t$state.lineIds,
3185
+ polygonIds = _t$state.polygonIds,
3186
+ circleIds = _t$state.circleIds,
3187
+ drawIds = _t$state.drawIds; //拷贝数组,避免原数组操作,影响循环
3188
+
2856
3189
  var ps = _toConsumableArray(pointIds),
2857
- ls = _toConsumableArray(lineIds),
2858
- pgs = _toConsumableArray(polygonIds),
2859
- cs = _toConsumableArray(circleIds);
2860
- // 删除点
3190
+ ls = _toConsumableArray(lineIds),
3191
+ pgs = _toConsumableArray(polygonIds),
3192
+ cs = _toConsumableArray(circleIds); // 删除点
3193
+
3194
+
2861
3195
  for (var i = 0; i < ps.length; i++) {
2862
3196
  t.removeGraphic(ps[i], 'point');
2863
- }
2864
- // 删除线
2865
- for (var _i = 0; _i < ls.length; _i++) {
2866
- t.removeGraphic(ls[_i], 'line');
2867
- }
2868
- // 删除面
2869
- for (var _i2 = 0; _i2 < pgs.length; _i2++) {
2870
- t.removeGraphic(pgs[_i2], 'polygon');
2871
- }
2872
- // 删除圆
2873
- for (var _i3 = 0; _i3 < cs.length; _i3++) {
2874
- t.removeGraphic(cs[_i3], 'circle');
2875
- }
2876
- //删除绘制的点
3197
+ } // 删除线
3198
+
3199
+
3200
+ for (var _i2 = 0; _i2 < ls.length; _i2++) {
3201
+ t.removeGraphic(ls[_i2], 'line');
3202
+ } // 删除面
3203
+
3204
+
3205
+ for (var _i3 = 0; _i3 < pgs.length; _i3++) {
3206
+ t.removeGraphic(pgs[_i3], 'polygon');
3207
+ } // 删除圆
3208
+
3209
+
3210
+ for (var _i4 = 0; _i4 < cs.length; _i4++) {
3211
+ t.removeGraphic(cs[_i4], 'circle');
3212
+ } //删除绘制的点
3213
+
3214
+
2877
3215
  var point = drawIds.point,
2878
- polyline = drawIds.polyline,
2879
- polygon = drawIds.polygon,
2880
- circle = drawIds.circle,
2881
- rectangle = drawIds.rectangle;
2882
- for (var _i4 = 0; _i4 < point.length; _i4++) {
2883
- t.removeGraphic(point[_i4]);
3216
+ polyline = drawIds.polyline,
3217
+ polygon = drawIds.polygon,
3218
+ circle = drawIds.circle,
3219
+ rectangle = drawIds.rectangle;
3220
+
3221
+ for (var i = 0; i < point.length; i++) {
3222
+ t.removeGraphic(point[i]);
2884
3223
  }
3224
+
2885
3225
  for (var _i5 = 0; _i5 < polyline.length; _i5++) {
2886
3226
  t.removeGraphic(polyline[_i5]);
2887
3227
  }
3228
+
2888
3229
  for (var _i6 = 0; _i6 < polygon.length; _i6++) {
2889
3230
  t.removeGraphic(polygon[_i6]);
2890
3231
  }
3232
+
2891
3233
  for (var _i7 = 0; _i7 < circle.length; _i7++) {
2892
3234
  t.removeGraphic(circle[_i7]);
2893
3235
  }
3236
+
2894
3237
  for (var _i8 = 0; _i8 < rectangle.length; _i8++) {
2895
3238
  t.removeGraphic(rectangle[_i8]);
2896
3239
  }
2897
- }
2898
- //展示比例尺
3240
+ } //展示比例尺
3241
+
2899
3242
  }, {
2900
3243
  key: "showControl",
2901
3244
  value: function showControl(props) {
2902
3245
  var t = this;
2903
3246
  var gis = t.state.gis;
2904
3247
  var config = props.showControl;
3248
+
2905
3249
  if (t.scaleControl) {
2906
3250
  gis.removeControl(t.scaleControl);
2907
3251
  }
3252
+
2908
3253
  t.scaleControl = new ol.control.ScaleLine({
2909
3254
  units: 'metric',
2910
3255
  //设置度量单位
@@ -2942,61 +3287,65 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
2942
3287
  });
2943
3288
  }
2944
3289
  }, 20);
2945
- }
2946
- //设置区域限制
3290
+ } //设置区域限制
3291
+
2947
3292
  }, {
2948
3293
  key: "setAreaRestriction",
2949
3294
  value: function setAreaRestriction(areaRestriction) {
2950
3295
  var t = this;
3296
+
2951
3297
  var _t$dealData6 = t.dealData(areaRestriction),
2952
- _et = _t$dealData6._extent;
3298
+ _et = _t$dealData6._extent;
3299
+
2953
3300
  t.areaRestriction = t.state.gis.getView().setProperties({
2954
3301
  extent: [_et.xmax, _et.ymax, _et.xmin, _et.ymin]
2955
3302
  }, false);
2956
- }
2957
- //关闭区域限制
3303
+ } //关闭区域限制
3304
+
2958
3305
  }, {
2959
3306
  key: "clearAreaRestriction",
2960
3307
  value: function clearAreaRestriction() {
2961
3308
  var t = this;
2962
3309
  t.areaRestriction = null;
2963
- }
2964
- //区域限制逻辑
3310
+ } //区域限制逻辑
3311
+
2965
3312
  }, {
2966
3313
  key: "dealAreaRestriction",
2967
3314
  value: function dealAreaRestriction(e) {
2968
- var t = this;
2969
- //如果在区域内,不处理
3315
+ var t = this; //如果在区域内,不处理
3316
+
2970
3317
  if (t.areaRestriction.contains(e.extent.getCenter())) {
2971
3318
  return;
2972
- }
2973
- // if(t.containsExtent(t.areaRestriction,e.extent)){
3319
+ } // if(t.containsExtent(t.areaRestriction,e.extent)){
2974
3320
  // return;
2975
3321
  // }
3322
+
3323
+
2976
3324
  var _t$areaRestriction = t.areaRestriction,
2977
- xmin1 = _t$areaRestriction.xmin,
2978
- xmax1 = _t$areaRestriction.xmax,
2979
- ymin1 = _t$areaRestriction.ymin,
2980
- ymax1 = _t$areaRestriction.ymax;
3325
+ xmin1 = _t$areaRestriction.xmin,
3326
+ xmax1 = _t$areaRestriction.xmax,
3327
+ ymin1 = _t$areaRestriction.ymin,
3328
+ ymax1 = _t$areaRestriction.ymax;
2981
3329
  var _e$extent = e.extent,
2982
- xmin2 = _e$extent.xmin,
2983
- xmax2 = _e$extent.xmax,
2984
- ymin2 = _e$extent.ymin,
2985
- ymax2 = _e$extent.ymax;
3330
+ xmin2 = _e$extent.xmin,
3331
+ xmax2 = _e$extent.xmax,
3332
+ ymin2 = _e$extent.ymin,
3333
+ ymax2 = _e$extent.ymax;
2986
3334
  var x = e.extent.getCenter().x,
2987
- y = e.extent.getCenter().y;
3335
+ y = e.extent.getCenter().y;
2988
3336
  if (x < xmin1) x = xmin1 + 0.1;
2989
3337
  if (x > xmax1) x = xmax1 - 0.1;
2990
3338
  if (y < ymin1) y = ymin1 + 0.1;
2991
3339
  if (y > ymax1) y = ymax1 - 0.1;
2992
3340
  t.state.gis.getView().setCenter([x, y]);
2993
- }
2994
- //聚合地图图元(arg为空时聚合全部点)
3341
+ } //聚合地图图元(arg为空时聚合全部点)
3342
+
2995
3343
  }, {
2996
3344
  key: "cluster",
2997
3345
  value: function cluster(arg) {
2998
3346
  var t = this;
2999
3347
  var ary = [];
3348
+
3000
3349
  if (!arg) {
3001
3350
  var pointIds = t.state.pointIds;
3002
3351
  ary = pointIds;
@@ -3007,6 +3356,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3007
3356
  ary = arg.split(',');
3008
3357
  }
3009
3358
  }
3359
+
3010
3360
  t.pointLayers.map(function (item) {
3011
3361
  t.state.gis.removeLayer(item.layer);
3012
3362
  t.pointLayers = [];
@@ -3023,6 +3373,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3023
3373
  minDistance: 0,
3024
3374
  source: source
3025
3375
  });
3376
+
3026
3377
  if (t.clusterInfo.clusterHulls) {
3027
3378
  t.clusterInfo.clusterHulls.setSource(t.clusterInfo.clusterSource);
3028
3379
  } else {
@@ -3032,6 +3383,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3032
3383
  });
3033
3384
  t.state.gis.addLayer(t.clusterInfo.clusterHulls);
3034
3385
  }
3386
+
3035
3387
  if (t.clusterInfo.clusters) {
3036
3388
  t.clusterInfo.clusters.setSource(t.clusterInfo.clusterSource);
3037
3389
  } else {
@@ -3041,6 +3393,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3041
3393
  });
3042
3394
  t.state.gis.addLayer(t.clusterInfo.clusters);
3043
3395
  }
3396
+
3044
3397
  if (t.clusterInfo.clusterCircles) {
3045
3398
  t.clusterInfo.clusterCircles.setSource(t.clusterInfo.clusterSource);
3046
3399
  } else {
@@ -3050,6 +3403,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3050
3403
  });
3051
3404
  t.state.gis.addLayer(t.clusterInfo.clusterCircles);
3052
3405
  }
3406
+
3053
3407
  function clusterMemberStyle(clusterMember) {
3054
3408
  var style = clusterMember.getStyle();
3055
3409
  var image = style && style.getImage ? style.getImage() : null;
@@ -3059,10 +3413,12 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3059
3413
  text: text
3060
3414
  });
3061
3415
  }
3416
+
3062
3417
  function clusterCircleStyle(cluster, resolution) {
3063
3418
  if (cluster !== t.clusterInfo.clickFeature || resolution !== t.clusterInfo.clickResolution) {
3064
3419
  return;
3065
3420
  }
3421
+
3066
3422
  var clusterMembers = cluster.get('features');
3067
3423
  var centerCoordinates = cluster.getGeometry().getCoordinates();
3068
3424
  return generatePointsCircle(clusterMembers.length, cluster.getGeometry().getCoordinates(), resolution).reduce(function (styles, coordinates, i) {
@@ -3081,24 +3437,30 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3081
3437
  return styles;
3082
3438
  }, []);
3083
3439
  }
3440
+
3084
3441
  function generatePointsCircle(count, clusterCenter, resolution) {
3085
3442
  var circumference = 1 * 28 * (2 + count);
3086
3443
  var legLength = circumference / (Math.PI * 2); //radius from circumference
3444
+
3087
3445
  var angleStep = Math.PI * 2 / count;
3088
3446
  var res = [];
3089
3447
  var angle;
3090
3448
  legLength = Math.max(legLength, 35) * resolution; // Minimum distance to get outside the cluster icon.
3449
+
3091
3450
  for (var i = 0; i < count; ++i) {
3092
3451
  // Clockwise, like spiral.
3093
3452
  angle = Math.PI / 2 + i * angleStep;
3094
3453
  res.push([clusterCenter[0] + legLength * Math.cos(angle), clusterCenter[1] + legLength * Math.sin(angle)]);
3095
3454
  }
3455
+
3096
3456
  return res;
3097
3457
  }
3458
+
3098
3459
  function clusterHullStyle(cluster) {
3099
3460
  if (cluster !== t.clusterInfo.hoverFeature) {
3100
3461
  return;
3101
3462
  }
3463
+
3102
3464
  var originalFeatures = cluster.get('features');
3103
3465
  var points = originalFeatures.map(function (feature) {
3104
3466
  return feature.getGeometry().getCoordinates();
@@ -3114,8 +3476,10 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3114
3476
  })
3115
3477
  });
3116
3478
  }
3479
+
3117
3480
  function clusterStyle(feature) {
3118
3481
  var size = feature.get('features').length;
3482
+
3119
3483
  if (size > 2) {
3120
3484
  return [new ol.style.Style({
3121
3485
  image: new ol.style.Circle({
@@ -3154,22 +3518,27 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3154
3518
  value: function clearCluster(arg) {
3155
3519
  var t = this;
3156
3520
  var ids = arg && (arg === null || arg === void 0 ? void 0 : arg.length) > 0 ? arg : t.state.pointIds;
3521
+
3157
3522
  if (t.clusterInfo.clusterHulls) {
3158
3523
  t.state.gis.removeLayer(t.clusterInfo.clusterHulls);
3159
3524
  t.clusterInfo.clusterHulls = null;
3160
3525
  }
3526
+
3161
3527
  if (t.clusterInfo.clusters) {
3162
3528
  t.state.gis.removeLayer(t.clusterInfo.clusters);
3163
3529
  t.clusterInfo.clusters = null;
3164
3530
  }
3531
+
3165
3532
  if (t.clusterInfo.clusterCircles) {
3166
3533
  t.state.gis.removeLayer(t.clusterInfo.clusterCircles);
3167
3534
  t.clusterInfo.clusterCircles = null;
3168
3535
  }
3536
+
3169
3537
  ids.map(function (id) {
3170
3538
  if (t.GM.getGraphic(id)) {
3171
3539
  t.GM.removeGraphic(id);
3172
3540
  }
3541
+
3173
3542
  t.state.pointIds.splice(t.state.pointIds.indexOf(id), 1);
3174
3543
  });
3175
3544
  t.addPoint(t.props.mapPoints);
@@ -3177,20 +3546,21 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3177
3546
  }
3178
3547
  /*公共方法*/
3179
3548
  //判断extent1是否在extent2内部
3549
+
3180
3550
  }, {
3181
3551
  key: "containsExtent",
3182
3552
  value: function containsExtent(e1, e2) {
3183
3553
  var xmin1 = e1.xmin,
3184
- xmax1 = e1.xmax,
3185
- ymin1 = e1.ymin,
3186
- ymax1 = e1.ymax;
3554
+ xmax1 = e1.xmax,
3555
+ ymin1 = e1.ymin,
3556
+ ymax1 = e1.ymax;
3187
3557
  var xmin2 = e2.xmin,
3188
- xmax2 = e2.xmax,
3189
- ymin2 = e2.ymin,
3190
- ymax2 = e2.ymax;
3558
+ xmax2 = e2.xmax,
3559
+ ymin2 = e2.ymin,
3560
+ ymax2 = e2.ymax;
3191
3561
  return xmin2 > xmin1 && xmax2 < xmax1 && ymin2 > ymin1 && ymax2 < ymax1;
3192
- }
3193
- //将图元z-index设置成最高
3562
+ } //将图元z-index设置成最高
3563
+
3194
3564
  }, {
3195
3565
  key: "czIndex",
3196
3566
  value: function czIndex(id) {
@@ -3201,8 +3571,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3201
3571
  key: "equalsPoint",
3202
3572
  value: function equalsPoint(a, b) {
3203
3573
  return a.x == b.x && a.y == b.y;
3204
- }
3205
- //计算2点间距离 单位m 精确到2位小数
3574
+ } //计算2点间距离 单位m 精确到2位小数
3575
+
3206
3576
  }, {
3207
3577
  key: "calculatePointsDistance",
3208
3578
  value: function calculatePointsDistance(fp, ep) {
@@ -3210,16 +3580,18 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3210
3580
  var distance = ol.sphere.getDistance(fp, ep);
3211
3581
  console.log(distance);
3212
3582
  return Math.round(distance);
3213
- }
3214
- //计算多个点的距离(常用于线计算)
3583
+ } //计算多个点的距离(常用于线计算)
3584
+
3215
3585
  }, {
3216
3586
  key: "calculateDistance",
3217
3587
  value: function calculateDistance(ps) {
3218
3588
  var t = this,
3219
- totalDistance = 0;
3589
+ totalDistance = 0;
3590
+
3220
3591
  if (ps.length < 0) {
3221
3592
  return 0;
3222
3593
  }
3594
+
3223
3595
  for (var i = 0; i < ps.length; i++) {
3224
3596
  if (i < ps.length - 1) {
3225
3597
  var distance = t.calculatePointsDistance(ps[i], ps[i + 1]);
@@ -3227,37 +3599,43 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3227
3599
  totalDistance += distance;
3228
3600
  }
3229
3601
  }
3602
+
3230
3603
  console.log(totalDistance);
3231
3604
  return Math.round(totalDistance * 100) / 100;
3232
- }
3233
- //处理线和面的 经纬度数据
3605
+ } //处理线和面的 经纬度数据
3606
+
3234
3607
  }, {
3235
3608
  key: "dealData",
3236
3609
  value: function dealData(paths) {
3237
3610
  //区别点和圆的经纬度数据处理
3238
3611
  var lnglatAry = [],
3239
- _extent = {
3240
- xmax: 0,
3241
- xmin: 0,
3242
- ymax: 0,
3243
- ymin: 0
3244
- },
3245
- path = [];
3612
+ _extent = {
3613
+ xmax: 0,
3614
+ xmin: 0,
3615
+ ymax: 0,
3616
+ ymin: 0
3617
+ },
3618
+ path = [];
3246
3619
  path = paths.map(function (item, index) {
3247
3620
  var lng = item[0],
3248
- lat = item[1];
3621
+ lat = item[1];
3622
+
3249
3623
  if (lng > _extent.xmax) {
3250
3624
  _extent.xmax = lng;
3251
3625
  }
3626
+
3252
3627
  if (lng < _extent.xmin || _extent.xmin == 0) {
3253
3628
  _extent.xmin = lng;
3254
3629
  }
3630
+
3255
3631
  if (lat > _extent.ymax) {
3256
3632
  _extent.ymax = lat;
3257
3633
  }
3634
+
3258
3635
  if (lat < _extent.ymin || _extent.ymin == 0) {
3259
3636
  _extent.ymin = lat;
3260
3637
  }
3638
+
3261
3639
  lnglatAry.push({
3262
3640
  lngX: lng,
3263
3641
  latX: lat
@@ -3269,50 +3647,55 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3269
3647
  _extent: _extent,
3270
3648
  path: path
3271
3649
  };
3272
- }
3273
- //处理点位图元的添加 和 更新
3650
+ } //处理点位图元的添加 和 更新
3651
+
3274
3652
  }, {
3275
3653
  key: "dealLabelGraphics",
3276
3654
  value: function dealLabelGraphics(id, label) {
3277
3655
  var t = this;
3656
+
3278
3657
  if (label) {
3279
- var position = (t.GM.getGraphic(id) || {}).geometry || label.position;
3280
- //经纬度转top和left
3658
+ var position = (t.GM.getGraphic(id) || {}).geometry || label.position; //经纬度转top和left
3659
+
3281
3660
  var tl = t.state.gis.toScreen(position),
3282
- lbl = _objectSpread({}, label);
3283
- //渲染優化
3661
+ lbl = _objectSpread({}, label); //渲染優化
3662
+
3663
+
3284
3664
  if (!(tl.y < -50 || tl.x < -50 || tl.y > t.state.gis.height || tl.x > t.state.gis.width)) {
3285
3665
  //设置label的位置(通过定位来实现)
3286
3666
  label.html.css({
3287
3667
  position: 'absolute',
3288
3668
  top: tl.y + (label.offset.y || 0) - t.labelLayer.y,
3289
3669
  left: tl.x + (label.offset.x || 0) - t.labelLayer.x
3290
- });
3291
- //添加点位到(地图)
3670
+ }); //添加点位到(地图)
3671
+
3292
3672
  $("#".concat(t.htmlPointsId)).append(label.html);
3293
3673
  lbl.add = true;
3294
3674
  } else {
3295
3675
  lbl.add = false;
3296
- }
3297
- //记录下label的dom对象,用于后期修改和删除(基本是删除)
3676
+ } //记录下label的dom对象,用于后期修改和删除(基本是删除)
3677
+
3678
+
3298
3679
  t.Label[id] = lbl;
3299
3680
  }
3300
- }
3301
- //点的跳动动画
3681
+ } //点的跳动动画
3682
+
3302
3683
  }, {
3303
3684
  key: "pointAnimation",
3304
3685
  value: function pointAnimation(id, marker) {
3305
- var t = this;
3306
- //null时关闭跳动
3686
+ var t = this; //null时关闭跳动
3687
+
3307
3688
  if (!!marker) {
3308
3689
  if (t.animTimer[id]) {
3309
3690
  clearInterval(t.animTimer[id]);
3310
3691
  }
3692
+
3311
3693
  t.animTimer[id] = setInterval(function () {
3312
3694
  //点被隐藏时,没有执行,定时不关
3313
3695
  if (marker.symbol) {
3314
- var shape = _objectSpread({}, marker.symbol);
3315
- //初始数据 点位有变动,重新刷新数据
3696
+ var shape = _objectSpread({}, marker.symbol); //初始数据 点位有变动,重新刷新数据
3697
+
3698
+
3316
3699
  if (!t.animCount[id] || shape.yoffset != t.animCount[id].now) {
3317
3700
  t.animCount[id] = {
3318
3701
  start: shape.yoffset,
@@ -3320,12 +3703,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3320
3703
  notation: -1
3321
3704
  };
3322
3705
  }
3706
+
3323
3707
  if (t.animCount[id].now - t.animCount[id].start == 20) {
3324
3708
  t.animCount[id].notation = -1;
3325
3709
  }
3710
+
3326
3711
  if (t.animCount[id].now - t.animCount[id].start == 0) {
3327
3712
  t.animCount[id].notation = 1;
3328
3713
  }
3714
+
3329
3715
  shape.yoffset = t.animCount[id].now = t.animCount[id].now + t.animCount[id].notation * 2;
3330
3716
  marker.symbol.setOffset(shape.xoffset, shape.yoffset);
3331
3717
  t.state.gis.graphics.refresh();
@@ -3339,93 +3725,107 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3339
3725
  key: "moveAnimation",
3340
3726
  value: function moveAnimation() {
3341
3727
  var t = this;
3728
+
3342
3729
  if (t.moveToTimer) {
3343
3730
  clearInterval(t.moveToTimer);
3344
3731
  }
3732
+
3345
3733
  t.moveToTimer = setInterval(function () {
3346
3734
  for (var i = 0; i < t.movePoints.length; i++) {
3347
3735
  t.movePoints[i].waitTime += 10;
3348
3736
  t.movePoints[i].deleteTime -= 10;
3349
3737
  }
3738
+
3350
3739
  t.movePoints.sort(function (x, y) {
3351
3740
  return y.waitTime - x.waitTime;
3352
3741
  });
3353
3742
  var nowMovePoints = t.movePoints.slice(0, 10),
3354
- deleteIndex = [];
3743
+ deleteIndex = [];
3744
+
3355
3745
  for (var _i9 = 0; _i9 < nowMovePoints.length; _i9++) {
3356
3746
  var _nowMovePoints$_i = nowMovePoints[_i9],
3357
- id = _nowMovePoints$_i.id,
3358
- rx = _nowMovePoints$_i.rx,
3359
- ry = _nowMovePoints$_i.ry,
3360
- waitTime = _nowMovePoints$_i.waitTime,
3361
- deleteTime = _nowMovePoints$_i.deleteTime,
3362
- ddeg = _nowMovePoints$_i.ddeg;
3747
+ id = _nowMovePoints$_i.id,
3748
+ rx = _nowMovePoints$_i.rx,
3749
+ ry = _nowMovePoints$_i.ry,
3750
+ waitTime = _nowMovePoints$_i.waitTime,
3751
+ deleteTime = _nowMovePoints$_i.deleteTime,
3752
+ ddeg = _nowMovePoints$_i.ddeg;
3363
3753
  var gc = t.GM.getGraphic(id);
3754
+
3364
3755
  if (!gc || !gc._graphicsLayer) {
3365
3756
  clearInterval(t.moveToTimer);
3366
3757
  } else {
3367
3758
  var gg = gc.getGeometry();
3368
3759
  var tx = gg[0] + rx,
3369
- ty = gg[1] + ry;
3760
+ ty = gg[1] + ry;
3370
3761
  gc.setGeometry([tx, ty]);
3371
3762
  t.movePoints[_i9].waitTime = 0;
3763
+
3372
3764
  if (deleteTime <= 0) {
3373
3765
  deleteIndex.push(_i9);
3374
3766
  }
3375
3767
  }
3376
3768
  }
3769
+
3377
3770
  deleteIndex.sort(function (a, b) {
3378
3771
  return b - a;
3379
3772
  });
3773
+
3380
3774
  for (var _i10 = 0; _i10 < deleteIndex.length; _i10++) {
3381
3775
  t.movePoints.splice(deleteIndex[_i10], 1);
3382
3776
  }
3777
+
3383
3778
  if (nowMovePoints.length == 0) {
3384
3779
  clearInterval(t.moveToTimer);
3385
3780
  }
3386
3781
  }, 10);
3387
- }
3388
- //点位移动动画效果
3782
+ } //点位移动动画效果
3783
+
3389
3784
  }, {
3390
3785
  key: "moveTo",
3391
3786
  value: function moveTo(id, lnglat, delay, autoRotation, urlright, urlleft) {
3392
3787
  delay = delay || 3;
3393
3788
  var t = this,
3394
- timer = 10;
3789
+ timer = 10;
3395
3790
  delay = eval(delay) * 1000;
3396
3791
  var count = delay / timer,
3397
- gc = this.GM.getGraphic(id);
3792
+ gc = this.GM.getGraphic(id);
3398
3793
  var s = gc.geometry,
3399
- e = {
3400
- x: lnglat[0],
3401
- y: lnglat[1]
3402
- };
3794
+ e = {
3795
+ x: lnglat[0],
3796
+ y: lnglat[1]
3797
+ };
3798
+
3403
3799
  if (t.equalsPoint(s, e)) {
3404
3800
  return false;
3405
3801
  } else {
3406
3802
  var ddeg = 0,
3407
- url = null;
3408
- //计算角度,旋转
3803
+ url = null; //计算角度,旋转
3804
+
3409
3805
  if (autoRotation) {
3410
3806
  //自己实现旋转
3411
3807
  ddeg = t.rotateDeg(gc.geometry, lnglat);
3808
+
3412
3809
  if (urlleft && ddeg < -90 && ddeg > -270) {
3413
3810
  ddeg += 180;
3414
3811
  url = urlleft;
3415
3812
  } else {
3416
3813
  url = urlright;
3417
3814
  }
3815
+
3418
3816
  gc.setStyle(new ol.style.Style({
3419
3817
  image: new ol.style.Icon({
3420
3818
  src: url,
3421
3819
  rotation: Math.PI / 180 * ddeg
3422
3820
  })
3423
3821
  }));
3424
- }
3425
- //拆分延迟移动定位
3822
+ } //拆分延迟移动定位
3823
+
3824
+
3426
3825
  var rx = (e.x - s.x) / count,
3427
- ry = (e.y - s.y) / count;
3826
+ ry = (e.y - s.y) / count;
3428
3827
  var isHave = false;
3828
+
3429
3829
  for (var i = 0; i < t.movePoints.length; i++) {
3430
3830
  if (t.movePoints[i].id == id) {
3431
3831
  t.movePoints.splice(i, 1, {
@@ -3438,6 +3838,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3438
3838
  isHave = true;
3439
3839
  }
3440
3840
  }
3841
+
3441
3842
  if (!isHave) {
3442
3843
  t.movePoints.push({
3443
3844
  id: id,
@@ -3448,30 +3849,34 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3448
3849
  });
3449
3850
  }
3450
3851
  }
3451
- }
3452
- //点位角度旋转(以指向东(右)为0°)
3852
+ } //点位角度旋转(以指向东(右)为0°)
3853
+
3453
3854
  }, {
3454
3855
  key: "rotateDeg",
3455
3856
  value: function rotateDeg(sp, ep) {
3456
3857
  var t = this;
3457
3858
  var spLngLat = sp;
3859
+
3458
3860
  if (Array.isArray(sp)) {
3459
3861
  spLngLat = new ol.geom.Point(sp[0], sp[1]);
3460
3862
  }
3863
+
3461
3864
  var s = t.state.gis.getPixelFromCoordinate(spLngLat),
3462
- //获取当前点位的经纬度
3463
- e = t.state.gis.getPixelFromCoordinate(new ol.geom.Point(ep[0], ep[1])),
3464
- deg = 0;
3865
+ //获取当前点位的经纬度
3866
+ e = t.state.gis.getPixelFromCoordinate(new ol.geom.Point(ep[0], ep[1])),
3867
+ deg = 0;
3868
+
3465
3869
  if (e.x != s.x) {
3466
3870
  var tan = (e.y - s.y) / (e.x - s.x),
3467
- atan = Math.atan(tan);
3468
- deg = atan * 360 / (2 * Math.PI);
3469
- //degree correction;
3871
+ atan = Math.atan(tan);
3872
+ deg = atan * 360 / (2 * Math.PI); //degree correction;
3873
+
3470
3874
  if (e.x < s.x) {
3471
3875
  deg = -deg + 90 + 90;
3472
3876
  } else {
3473
3877
  deg = -deg;
3474
3878
  }
3879
+
3475
3880
  deg = -deg;
3476
3881
  } else {
3477
3882
  var disy = e.y - s.y;
@@ -3480,15 +3885,16 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3480
3885
  if (disy == 0) bias = 0;
3481
3886
  deg = -bias * 90;
3482
3887
  }
3888
+
3483
3889
  return deg;
3484
- }
3485
- //对比对象数据是否相等
3890
+ } //对比对象数据是否相等
3891
+
3486
3892
  }, {
3487
3893
  key: "deepEqual",
3488
3894
  value: function deepEqual(a, b) {
3489
3895
  return _immutable["default"].is(_immutable["default"].fromJS(a), _immutable["default"].fromJS(b));
3490
- }
3491
- //数据解析(分析,新增,更新,删除对应的数据)
3896
+ } //数据解析(分析,新增,更新,删除对应的数据)
3897
+
3492
3898
  }, {
3493
3899
  key: "dataMatch",
3494
3900
  value: function dataMatch(oldData, newData, type) {
@@ -3519,13 +3925,14 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3519
3925
  updatedData: updatedData,
3520
3926
  replacedData: replacedData
3521
3927
  };
3522
- }
3523
- //处理需要增加图元的数据(避免意外问题)
3928
+ } //处理需要增加图元的数据(避免意外问题)
3929
+
3524
3930
  }, {
3525
3931
  key: "dealAdd",
3526
3932
  value: function dealAdd(ary, ids) {
3527
3933
  var ads = [],
3528
- otherupds = [];
3934
+ otherupds = [];
3935
+
3529
3936
  for (var i = 0; i < ary.length; i++) {
3530
3937
  if (ids.indexOf(ary[i].id) > -1) {
3531
3938
  otherupds.push(ary[i]);
@@ -3533,17 +3940,19 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3533
3940
  ads.push(ary[i]);
3534
3941
  }
3535
3942
  }
3943
+
3536
3944
  return {
3537
3945
  ads: ads,
3538
3946
  otherupds: otherupds
3539
3947
  };
3540
- }
3541
- //处理需要更新图元的数据(避免意外问题)
3948
+ } //处理需要更新图元的数据(避免意外问题)
3949
+
3542
3950
  }, {
3543
3951
  key: "dealUpdate",
3544
3952
  value: function dealUpdate(ary, ids) {
3545
3953
  var upds = [],
3546
- otherads = [];
3954
+ otherads = [];
3955
+
3547
3956
  for (var i = 0; i < ary.length; i++) {
3548
3957
  if (ids.indexOf(ary[i].id) > -1) {
3549
3958
  upds.push(ary[i]);
@@ -3551,6 +3960,7 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3551
3960
  otherads.push(ary[i]);
3552
3961
  }
3553
3962
  }
3963
+
3554
3964
  return {
3555
3965
  upds: upds,
3556
3966
  otherads: otherads
@@ -3568,8 +3978,8 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3568
3978
  height: '100%'
3569
3979
  }
3570
3980
  });
3571
- }
3572
- //初始化
3981
+ } //初始化
3982
+
3573
3983
  }, {
3574
3984
  key: "componentDidMount",
3575
3985
  value: function componentDidMount() {
@@ -3577,74 +3987,75 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3577
3987
  t.loadMapComplete.then(function () {
3578
3988
  t.init();
3579
3989
  });
3580
- }
3581
- //已加载组件,收到新的参数时调用
3990
+ } //已加载组件,收到新的参数时调用
3991
+
3582
3992
  }, {
3583
- key: "componentWillReceiveProps",
3584
- value: function componentWillReceiveProps(nextProps, prevProps) {
3585
- var t = this;
3586
- //点/线旧数据
3993
+ key: "UNSAFE_componentWillReceiveProps",
3994
+ value: function UNSAFE_componentWillReceiveProps(nextProps, prevProps) {
3995
+ var t = this; //点/线旧数据
3996
+
3587
3997
  var _t$state2 = t.state,
3588
- pointIds = _t$state2.pointIds,
3589
- lineIds = _t$state2.lineIds,
3590
- polygonIds = _t$state2.polygonIds,
3591
- circleIds = _t$state2.circleIds,
3592
- drawIds = _t$state2.drawIds;
3998
+ pointIds = _t$state2.pointIds,
3999
+ lineIds = _t$state2.lineIds,
4000
+ polygonIds = _t$state2.polygonIds,
4001
+ circleIds = _t$state2.circleIds,
4002
+ drawIds = _t$state2.drawIds;
3593
4003
  var point = drawIds.point,
3594
- polyline = drawIds.polyline,
3595
- polygon = drawIds.polygon,
3596
- circle = drawIds.circle,
3597
- rectangle = drawIds.rectangle;
3598
- //点/线新数据
4004
+ polyline = drawIds.polyline,
4005
+ polygon = drawIds.polygon,
4006
+ circle = drawIds.circle,
4007
+ rectangle = drawIds.rectangle; //点/线新数据
4008
+
3599
4009
  var _nextProps$mapPoints = nextProps.mapPoints,
3600
- mapPoints = _nextProps$mapPoints === void 0 ? [] : _nextProps$mapPoints,
3601
- _nextProps$mapLines = nextProps.mapLines,
3602
- mapLines = _nextProps$mapLines === void 0 ? [] : _nextProps$mapLines,
3603
- _nextProps$mapPolygon = nextProps.mapPolygons,
3604
- mapPolygons = _nextProps$mapPolygon === void 0 ? [] : _nextProps$mapPolygon,
3605
- _nextProps$mapCircles = nextProps.mapCircles,
3606
- mapCircles = _nextProps$mapCircles === void 0 ? [] : _nextProps$mapCircles,
3607
- _nextProps$customized = nextProps.customizedBoundary,
3608
- customizedBoundary = _nextProps$customized === void 0 ? [] : _nextProps$customized,
3609
- isOpenTrafficInfo = nextProps.isOpenTrafficInfo,
3610
- boundaryName = nextProps.boundaryName,
3611
- heatMapData = nextProps.heatMapData,
3612
- mapVisiblePoints = nextProps.mapVisiblePoints,
3613
- setVisiblePoints = nextProps.setVisiblePoints,
3614
- setCenter = nextProps.setCenter,
3615
- mapCenter = nextProps.mapCenter,
3616
- setZoomLevel = nextProps.setZoomLevel,
3617
- mapZoomLevel = nextProps.mapZoomLevel,
3618
- setCluster = nextProps.setCluster,
3619
- mapCluster = nextProps.mapCluster,
3620
- isRangingTool = nextProps.isRangingTool,
3621
- mapRangingTool = nextProps.mapRangingTool,
3622
- isRemove = nextProps.isRemove,
3623
- mapRemove = nextProps.mapRemove,
3624
- mapDraw = nextProps.mapDraw,
3625
- isDraw = nextProps.isDraw,
3626
- isCloseDraw = nextProps.isCloseDraw,
3627
- editGraphicId = nextProps.editGraphicId,
3628
- isDoEdit = nextProps.isDoEdit,
3629
- isEndEdit = nextProps.isEndEdit,
3630
- mapPointCollection = nextProps.mapPointCollection,
3631
- isclearAllPointCollection = nextProps.isclearAllPointCollection,
3632
- isSetAreaRestriction = nextProps.isSetAreaRestriction,
3633
- areaRestriction = nextProps.areaRestriction,
3634
- isClearAreaRestriction = nextProps.isClearAreaRestriction,
3635
- isClearAll = nextProps.isClearAll,
3636
- olProps = nextProps.olProps;
3637
- // 等待地图加载
3638
- if (!t.state.mapCreated) return;
4010
+ mapPoints = _nextProps$mapPoints === void 0 ? [] : _nextProps$mapPoints,
4011
+ _nextProps$mapLines = nextProps.mapLines,
4012
+ mapLines = _nextProps$mapLines === void 0 ? [] : _nextProps$mapLines,
4013
+ _nextProps$mapPolygon = nextProps.mapPolygons,
4014
+ mapPolygons = _nextProps$mapPolygon === void 0 ? [] : _nextProps$mapPolygon,
4015
+ _nextProps$mapCircles = nextProps.mapCircles,
4016
+ mapCircles = _nextProps$mapCircles === void 0 ? [] : _nextProps$mapCircles,
4017
+ _nextProps$customized = nextProps.customizedBoundary,
4018
+ customizedBoundary = _nextProps$customized === void 0 ? [] : _nextProps$customized,
4019
+ isOpenTrafficInfo = nextProps.isOpenTrafficInfo,
4020
+ boundaryName = nextProps.boundaryName,
4021
+ heatMapData = nextProps.heatMapData,
4022
+ mapVisiblePoints = nextProps.mapVisiblePoints,
4023
+ setVisiblePoints = nextProps.setVisiblePoints,
4024
+ setCenter = nextProps.setCenter,
4025
+ mapCenter = nextProps.mapCenter,
4026
+ setZoomLevel = nextProps.setZoomLevel,
4027
+ mapZoomLevel = nextProps.mapZoomLevel,
4028
+ setCluster = nextProps.setCluster,
4029
+ mapCluster = nextProps.mapCluster,
4030
+ isRangingTool = nextProps.isRangingTool,
4031
+ mapRangingTool = nextProps.mapRangingTool,
4032
+ isRemove = nextProps.isRemove,
4033
+ mapRemove = nextProps.mapRemove,
4034
+ mapDraw = nextProps.mapDraw,
4035
+ isDraw = nextProps.isDraw,
4036
+ isCloseDraw = nextProps.isCloseDraw,
4037
+ editGraphicId = nextProps.editGraphicId,
4038
+ isDoEdit = nextProps.isDoEdit,
4039
+ isEndEdit = nextProps.isEndEdit,
4040
+ mapPointCollection = nextProps.mapPointCollection,
4041
+ isclearAllPointCollection = nextProps.isclearAllPointCollection,
4042
+ isSetAreaRestriction = nextProps.isSetAreaRestriction,
4043
+ areaRestriction = nextProps.areaRestriction,
4044
+ isClearAreaRestriction = nextProps.isClearAreaRestriction,
4045
+ isClearAll = nextProps.isClearAll,
4046
+ olProps = nextProps.olProps; // 等待地图加载
4047
+
4048
+ if (!t.mapCreated) return;
3639
4049
  /*点数据处理
3640
4050
  pointData[2]相同的点,执行刷新
3641
4051
  pointData[1]的数据在idsForGraphicId中不存在的,执行新增
3642
4052
  pointData[0]数据中多余的id,执行删除
3643
4053
  */
4054
+
3644
4055
  if (mapPoints instanceof Array && t.props.mapPoints instanceof Array && !t.deepEqual(mapPoints, t.props.mapPoints)) {
3645
4056
  var oldMapPoints = t.props.mapPoints;
3646
- var newMapPoints = mapPoints;
3647
- //过滤编辑的图元
4057
+ var newMapPoints = mapPoints; //过滤编辑的图元
4058
+
3648
4059
  if (!!t.editId) {
3649
4060
  oldMapPoints = t.props.mapPoints.filter(function (item) {
3650
4061
  return item.id !== editGraphicId;
@@ -3653,41 +4064,52 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3653
4064
  return item.id !== editGraphicId;
3654
4065
  });
3655
4066
  }
4067
+
3656
4068
  var _t$dataMatch = t.dataMatch(oldMapPoints, newMapPoints, 'id'),
3657
- deletedDataIDs = _t$dataMatch.deletedDataIDs,
3658
- addedData = _t$dataMatch.addedData,
3659
- updatedData = _t$dataMatch.updatedData;
4069
+ deletedDataIDs = _t$dataMatch.deletedDataIDs,
4070
+ addedData = _t$dataMatch.addedData,
4071
+ updatedData = _t$dataMatch.updatedData;
4072
+
3660
4073
  var _t$dealAdd = t.dealAdd(addedData, [].concat(_toConsumableArray(pointIds), _toConsumableArray(point))),
3661
- ads = _t$dealAdd.ads,
3662
- otherupds = _t$dealAdd.otherupds;
4074
+ ads = _t$dealAdd.ads,
4075
+ otherupds = _t$dealAdd.otherupds;
4076
+
3663
4077
  var _t$dealUpdate = t.dealUpdate(updatedData, [].concat(_toConsumableArray(pointIds), _toConsumableArray(point))),
3664
- upds = _t$dealUpdate.upds,
3665
- otherads = _t$dealUpdate.otherads;
3666
- //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4078
+ upds = _t$dealUpdate.upds,
4079
+ otherads = _t$dealUpdate.otherads; //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4080
+
4081
+
3667
4082
  var index = 0;
4083
+
3668
4084
  var removeGraphic = function removeGraphic(id) {
3669
4085
  t.removeGraphic(id, 'point');
4086
+
3670
4087
  if (index < deletedDataIDs.length - 1) {
3671
4088
  requestIdleCallback(function () {
3672
4089
  return removeGraphic(deletedDataIDs[++index]);
3673
4090
  });
3674
4091
  }
3675
4092
  };
4093
+
3676
4094
  if (!(0, _lodash.isEmpty)(deletedDataIDs)) {
3677
4095
  removeGraphic(deletedDataIDs[index]);
3678
- }
3679
- //增加
3680
- t.addPoint([].concat(_toConsumableArray(ads), _toConsumableArray(otherads)));
3681
- //更新
4096
+ } //增加
4097
+
4098
+
4099
+ t.addPoint([].concat(_toConsumableArray(ads), _toConsumableArray(otherads))); //更新
4100
+
3682
4101
  t.updatePoint([].concat(_toConsumableArray(upds), _toConsumableArray(otherupds)));
3683
4102
  }
3684
4103
  /*
3685
4104
  线数据处理
3686
4105
  先全删除,再新增
3687
4106
  */
4107
+
4108
+
3688
4109
  if (mapLines instanceof Array && t.props.mapLines instanceof Array && !t.deepEqual(mapLines, t.props.mapLines)) {
3689
4110
  var oldMapLines = t.props.mapLines;
3690
4111
  var newMapLines = mapLines;
4112
+
3691
4113
  if (!!t.editId) {
3692
4114
  oldMapLines = t.props.mapLines.filter(function (item) {
3693
4115
  return item.id !== editGraphicId;
@@ -3696,41 +4118,50 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3696
4118
  return item.id !== editGraphicId;
3697
4119
  });
3698
4120
  }
4121
+
3699
4122
  var _t$dataMatch2 = t.dataMatch(oldMapLines, newMapLines, 'id'),
3700
- _deletedDataIDs = _t$dataMatch2.deletedDataIDs,
3701
- _addedData = _t$dataMatch2.addedData,
3702
- _updatedData = _t$dataMatch2.updatedData;
4123
+ _deletedDataIDs = _t$dataMatch2.deletedDataIDs,
4124
+ _addedData = _t$dataMatch2.addedData,
4125
+ _updatedData = _t$dataMatch2.updatedData;
4126
+
3703
4127
  var _t$dealAdd2 = t.dealAdd(_addedData, [].concat(_toConsumableArray(lineIds), _toConsumableArray(polyline))),
3704
- _ads = _t$dealAdd2.ads,
3705
- _otherupds = _t$dealAdd2.otherupds;
4128
+ _ads = _t$dealAdd2.ads,
4129
+ _otherupds = _t$dealAdd2.otherupds;
4130
+
3706
4131
  var _t$dealUpdate2 = t.dealUpdate(_updatedData, [].concat(_toConsumableArray(lineIds), _toConsumableArray(polyline))),
3707
- _upds = _t$dealUpdate2.upds,
3708
- _otherads = _t$dealUpdate2.otherads;
3709
- //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4132
+ _upds = _t$dealUpdate2.upds,
4133
+ _otherads = _t$dealUpdate2.otherads; //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4134
+
4135
+
3710
4136
  var _iterator = _createForOfIteratorHelper(_deletedDataIDs),
3711
- _step;
4137
+ _step;
4138
+
3712
4139
  try {
3713
4140
  for (_iterator.s(); !(_step = _iterator.n()).done;) {
3714
4141
  var id = _step.value;
3715
4142
  t.removeGraphic(id, 'line');
3716
- }
3717
- //增加
4143
+ } //增加
4144
+
3718
4145
  } catch (err) {
3719
4146
  _iterator.e(err);
3720
4147
  } finally {
3721
4148
  _iterator.f();
3722
4149
  }
3723
- t.addLine([].concat(_toConsumableArray(_ads), _toConsumableArray(_otherads)));
3724
- //更新
4150
+
4151
+ t.addLine([].concat(_toConsumableArray(_ads), _toConsumableArray(_otherads))); //更新
4152
+
3725
4153
  t.updateLine([].concat(_toConsumableArray(_upds), _toConsumableArray(_otherupds)));
3726
4154
  }
3727
4155
  /*
3728
4156
  面数据处理
3729
4157
  先全删除,再新增
3730
4158
  */
4159
+
4160
+
3731
4161
  if (mapPolygons instanceof Array && t.props.mapPolygons instanceof Array && !t.deepEqual(mapPolygons, t.props.mapPolygons)) {
3732
4162
  var oldMapPolygons = t.props.mapPolygons;
3733
4163
  var newMapPolygons = mapPolygons;
4164
+
3734
4165
  if (!!t.editId) {
3735
4166
  oldMapPolygons = t.props.mapPolygons.filter(function (item) {
3736
4167
  return item.id !== editGraphicId;
@@ -3739,41 +4170,50 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3739
4170
  return item.id !== editGraphicId;
3740
4171
  });
3741
4172
  }
4173
+
3742
4174
  var _t$dataMatch3 = t.dataMatch(oldMapPolygons, newMapPolygons, 'id'),
3743
- _deletedDataIDs2 = _t$dataMatch3.deletedDataIDs,
3744
- _addedData2 = _t$dataMatch3.addedData,
3745
- _updatedData2 = _t$dataMatch3.updatedData;
4175
+ _deletedDataIDs2 = _t$dataMatch3.deletedDataIDs,
4176
+ _addedData2 = _t$dataMatch3.addedData,
4177
+ _updatedData2 = _t$dataMatch3.updatedData;
4178
+
3746
4179
  var _t$dealAdd3 = t.dealAdd(_addedData2, [].concat(_toConsumableArray(rectangle), _toConsumableArray(polygon), _toConsumableArray(polygonIds))),
3747
- _ads2 = _t$dealAdd3.ads,
3748
- _otherupds2 = _t$dealAdd3.otherupds;
4180
+ _ads2 = _t$dealAdd3.ads,
4181
+ _otherupds2 = _t$dealAdd3.otherupds;
4182
+
3749
4183
  var _t$dealUpdate3 = t.dealUpdate(_updatedData2, [].concat(_toConsumableArray(rectangle), _toConsumableArray(polygon), _toConsumableArray(polygonIds))),
3750
- _upds2 = _t$dealUpdate3.upds,
3751
- _otherads2 = _t$dealUpdate3.otherads;
3752
- //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4184
+ _upds2 = _t$dealUpdate3.upds,
4185
+ _otherads2 = _t$dealUpdate3.otherads; //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4186
+
4187
+
3753
4188
  var _iterator2 = _createForOfIteratorHelper(_deletedDataIDs2),
3754
- _step2;
4189
+ _step2;
4190
+
3755
4191
  try {
3756
4192
  for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
3757
4193
  var _id = _step2.value;
3758
4194
  t.removeGraphic(_id, 'polygon');
3759
- }
3760
- //增加
4195
+ } //增加
4196
+
3761
4197
  } catch (err) {
3762
4198
  _iterator2.e(err);
3763
4199
  } finally {
3764
4200
  _iterator2.f();
3765
4201
  }
3766
- t.addPolygon([].concat(_toConsumableArray(_ads2), _toConsumableArray(_otherads2)));
3767
- //更新
4202
+
4203
+ t.addPolygon([].concat(_toConsumableArray(_ads2), _toConsumableArray(_otherads2))); //更新
4204
+
3768
4205
  t.updatePolygon([].concat(_toConsumableArray(_upds2), _toConsumableArray(_otherupds2)));
3769
4206
  }
3770
4207
  /*
3771
4208
  圆数据处理
3772
4209
  先全删除,再新增
3773
4210
  */
4211
+
4212
+
3774
4213
  if (mapCircles instanceof Array && t.props.mapCircles instanceof Array && !t.deepEqual(mapCircles, t.props.mapCircles)) {
3775
4214
  var oldMapCircles = t.props.mapCircles;
3776
4215
  var newMapCircles = mapCircles;
4216
+
3777
4217
  if (!!t.editId) {
3778
4218
  oldMapCircles = t.props.mapCircles.filter(function (item) {
3779
4219
  return item.id !== editGraphicId;
@@ -3782,121 +4222,147 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3782
4222
  return item.id !== editGraphicId;
3783
4223
  });
3784
4224
  }
4225
+
3785
4226
  var _t$dataMatch4 = t.dataMatch(oldMapCircles, newMapCircles, 'id'),
3786
- _deletedDataIDs3 = _t$dataMatch4.deletedDataIDs,
3787
- _addedData3 = _t$dataMatch4.addedData,
3788
- _updatedData3 = _t$dataMatch4.updatedData;
4227
+ _deletedDataIDs3 = _t$dataMatch4.deletedDataIDs,
4228
+ _addedData3 = _t$dataMatch4.addedData,
4229
+ _updatedData3 = _t$dataMatch4.updatedData;
4230
+
3789
4231
  var _t$dealAdd4 = t.dealAdd(_addedData3, [].concat(_toConsumableArray(circleIds), _toConsumableArray(circle))),
3790
- _ads3 = _t$dealAdd4.ads,
3791
- _otherupds3 = _t$dealAdd4.otherupds;
4232
+ _ads3 = _t$dealAdd4.ads,
4233
+ _otherupds3 = _t$dealAdd4.otherupds;
4234
+
3792
4235
  var _t$dealUpdate4 = t.dealUpdate(_updatedData3, [].concat(_toConsumableArray(circleIds), _toConsumableArray(circle))),
3793
- _upds3 = _t$dealUpdate4.upds,
3794
- _otherads3 = _t$dealUpdate4.otherads;
3795
- //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4236
+ _upds3 = _t$dealUpdate4.upds,
4237
+ _otherads3 = _t$dealUpdate4.otherads; //删在增之前,(因为增加后会刷新pointIds的值,造成多删的问题)
4238
+
4239
+
3796
4240
  var _iterator3 = _createForOfIteratorHelper(_deletedDataIDs3),
3797
- _step3;
4241
+ _step3;
4242
+
3798
4243
  try {
3799
4244
  for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
3800
4245
  var _id2 = _step3.value;
3801
4246
  t.removeGraphic(_id2, 'circle');
3802
- }
3803
- //增加
4247
+ } //增加
4248
+
3804
4249
  } catch (err) {
3805
4250
  _iterator3.e(err);
3806
4251
  } finally {
3807
4252
  _iterator3.f();
3808
4253
  }
3809
- t.addCircle([].concat(_toConsumableArray(_ads3), _toConsumableArray(_otherads3)));
3810
- //更新
4254
+
4255
+ t.addCircle([].concat(_toConsumableArray(_ads3), _toConsumableArray(_otherads3))); //更新
4256
+
3811
4257
  t.updateCircle([].concat(_toConsumableArray(_upds3), _toConsumableArray(_otherupds3)));
3812
- }
3813
- //图元编辑调用
4258
+ } //图元编辑调用
4259
+
4260
+
3814
4261
  if (typeof isDoEdit == 'boolean' && isDoEdit || isDoEdit && isDoEdit !== t.props.isDoEdit) {
3815
4262
  t.doEdit(editGraphicId);
3816
- }
3817
- // 获取热力图
4263
+ } // 获取热力图
4264
+
4265
+
3818
4266
  if (heatMapData && heatMapData.data && !t.deepEqual(heatMapData, t.props.heatMapData)) {
3819
4267
  t.heatMapOverlay(heatMapData);
3820
4268
  } else if (!t.deepEqual(heatMapData, t.props.heatMapData)) {
3821
4269
  t.clearHeatMap(heatMapData);
3822
- }
3823
- //清空地图
4270
+ } //清空地图
4271
+
4272
+
3824
4273
  if (typeof isClearAll == 'boolean' && isClearAll || isClearAll && isClearAll !== t.props.isClearAll) {
3825
4274
  t.clearAll();
3826
- }
3827
- //测距工具调用
4275
+ } //测距工具调用
4276
+
4277
+
3828
4278
  if (typeof isRangingTool == 'boolean' && isRangingTool || isRangingTool && isRangingTool !== t.props.isRangingTool) {
3829
4279
  t.vtxRangingTool(mapRangingTool);
3830
4280
  }
3831
4281
  /*设置指定图元展示*/
4282
+
4283
+
3832
4284
  if (typeof setVisiblePoints == 'boolean' && setVisiblePoints || setVisiblePoints && setVisiblePoints !== t.props.setVisiblePoints) {
3833
4285
  t.setVisiblePoints(mapVisiblePoints);
3834
- }
3835
- //设置中心点
4286
+ } //设置中心点
3836
4287
  // if ((typeof (setCenter) == 'boolean' && setCenter) || (setCenter && setCenter !== t.props.setCenter)) {
3837
4288
  // if (!(t.getCurrentCenter().lng == mapCenter[0] && t.getCurrentCenter().lat == mapCenter[1])) {
3838
4289
  // t.setCenter(mapCenter);
3839
4290
  // }
3840
4291
  // }
4292
+
4293
+
3841
4294
  if (nextProps.mapCenter && nextProps.mapCenter.length > 0 && JSON.stringify(nextProps.mapCenter) !== JSON.stringify(this.props.mapCenter)) {
3842
4295
  t.setCenter(mapCenter);
3843
- }
3844
- //设置点聚合
4296
+ } //设置点聚合
4297
+
4298
+
3845
4299
  if (typeof setCluster == 'boolean' && setCluster || setCluster && setCluster !== t.props.setCluster) {
3846
4300
  t.cluster(mapCluster);
3847
4301
  }
4302
+
3848
4303
  if (!setCluster && setCluster !== t.props.setCluster) {
3849
4304
  t.clearCluster(mapCluster);
3850
- }
3851
- //图元编辑调用
4305
+ } //图元编辑调用
4306
+
4307
+
3852
4308
  if (typeof isDoEdit == 'boolean' && isDoEdit || isDoEdit && isDoEdit !== t.props.isDoEdit) {
3853
4309
  t.doEdit(editGraphicId);
3854
- }
3855
- //关闭图元编辑
4310
+ } //关闭图元编辑
4311
+
4312
+
3856
4313
  if (typeof isEndEdit == 'boolean' && isEndEdit || isEndEdit && isEndEdit !== t.props.isEndEdit) {
3857
4314
  t.endEdit();
3858
- }
3859
- //绘制图元
4315
+ } //绘制图元
4316
+
4317
+
3860
4318
  if (typeof isDraw == 'boolean' && isDraw || isDraw && isDraw !== t.props.isDraw) {
3861
4319
  t.draw(mapDraw);
3862
- }
3863
- //关闭绘制
4320
+ } //关闭绘制
4321
+
4322
+
3864
4323
  if (typeof isCloseDraw == 'boolean' && isCloseDraw || isCloseDraw && isCloseDraw !== t.props.isCloseDraw) {
3865
4324
  t.closeDraw();
3866
- }
3867
- //单独删除操作
4325
+ } //单独删除操作
4326
+
4327
+
3868
4328
  if (typeof isRemove == 'boolean' && isRemove || isRemove && isRemove !== t.props.isRemove) {
3869
4329
  mapRemove.map(function (item, index) {
3870
4330
  t.removeGraphic(item.id, item.type);
3871
4331
  });
3872
- }
3873
- //设置区域限制
4332
+ } //设置区域限制
4333
+
4334
+
3874
4335
  if (typeof isSetAreaRestriction == 'boolean' && isSetAreaRestriction || isSetAreaRestriction && isSetAreaRestriction !== t.props.isSetAreaRestriction && areaRestriction && !!areaRestriction[0] && !!areaRestriction[1]) {
3875
4336
  t.setAreaRestriction(areaRestriction);
3876
- }
3877
- //关闭区域限制
4337
+ } //关闭区域限制
4338
+
4339
+
3878
4340
  if (typeof isClearAreaRestriction == 'boolean' && isClearAreaRestriction || isClearAreaRestriction && isClearAreaRestriction !== t.props.isClearAreaRestriction) {
3879
4341
  t.clearAreaRestriction();
3880
- }
3881
- // 设置地图层级
4342
+ } // 设置地图层级
4343
+
4344
+
3882
4345
  if (typeof setZoomLevel == 'boolean' && setZoomLevel || setZoomLevel && setZoomLevel !== t.props.setZoomLevel) {
3883
4346
  t.setZoomLevel(mapZoomLevel);
3884
- }
3885
- // 比例尺控件位置改变
4347
+ } // 比例尺控件位置改变
4348
+
4349
+
3886
4350
  if (nextProps.showControl && JSON.stringify(nextProps.showControl) != JSON.stringify(t.props.showControl)) {
3887
4351
  t.showControl(nextProps);
3888
- }
3889
- // 更新需要加载的图层
4352
+ } // 更新需要加载的图层
4353
+
4354
+
3890
4355
  if (nextProps.olProps && JSON.stringify(nextProps.olProps) !== JSON.stringify(t.props.olProps)) {
3891
4356
  t.loadLayers(nextProps.olProps.olCoverage, t.props.olProps.olCoverage);
3892
4357
  }
3893
- }
3894
- // 地图事件
4358
+ } // 地图事件
3895
4359
  //地图点击事件
4360
+
3896
4361
  }, {
3897
4362
  key: "clickMap",
3898
4363
  value: function clickMap(e) {
3899
4364
  var t = this;
4365
+
3900
4366
  if (typeof t.props.clickMap === 'function') {
3901
4367
  var obj = t.getMapExtent();
3902
4368
  obj.e = e;
@@ -3914,17 +4380,20 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3914
4380
  temp.push(t.getFeatureInfo(e, t.state.gis.getView(), item.layer.getSource()));
3915
4381
  }
3916
4382
  });
4383
+
3917
4384
  if (temp.length) {
3918
4385
  obj.features = temp;
3919
4386
  }
4387
+
3920
4388
  t.props.clickMap(obj);
3921
4389
  }
3922
- }
3923
- // 获取geoServer要素
4390
+ } // 获取geoServer要素
4391
+
3924
4392
  }, {
3925
4393
  key: "getFeatureInfo",
3926
4394
  value: function getFeatureInfo(event, view, source) {
3927
- var _this8 = this;
4395
+ var _this9 = this;
4396
+
3928
4397
  var sourceParam = source.getParams();
3929
4398
  var url = source.getFeatureInfoUrl(event.coordinate, view.getResolution(), view.getProjection(), {
3930
4399
  cql_filter: sourceParam === null || sourceParam === void 0 ? void 0 : sourceParam.cql_filter,
@@ -3933,41 +4402,49 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3933
4402
  REQUEST: "GetFeatureInfo",
3934
4403
  FEATURE_COUNT: 50
3935
4404
  });
4405
+
3936
4406
  var _this$formatUrl2 = this.formatUrl(url),
3937
- param = _this$formatUrl2.param,
3938
- address = _this$formatUrl2.address;
3939
- // let temp = param.BBOX.split(",");
4407
+ param = _this$formatUrl2.param,
4408
+ address = _this$formatUrl2.address; // let temp = param.BBOX.split(",");
3940
4409
  // let BBOX = [temp[1],temp[0],temp[3],temp[2]].join(",");
3941
4410
  // param.BBOX = BBOX;
4411
+
4412
+
3942
4413
  param.QUERY_LAYERS = param.LAYERS;
3943
4414
  var temp = [];
4415
+
3944
4416
  for (var key in param) {
3945
4417
  temp.push("".concat(key, "=").concat(param[key]));
3946
4418
  }
4419
+
3947
4420
  address += "?".concat(temp.join("&"));
3948
4421
  var geoJsonFormat = new ol.format.GeoJSON();
3949
4422
  return fetch(address).then(function (res) {
3950
4423
  return res.json();
3951
4424
  }).then(function (data) {
3952
4425
  var _data$features;
4426
+
3953
4427
  var features = [];
4428
+
3954
4429
  if (data !== null && data !== void 0 && (_data$features = data.features) !== null && _data$features !== void 0 && _data$features.length) {
3955
4430
  features = geoJsonFormat.readFeatures(data);
3956
4431
  features.map(function (item) {
3957
- item.key = _this8 === null || _this8 === void 0 ? void 0 : _this8.key;
4432
+ item.key = _this9 === null || _this9 === void 0 ? void 0 : _this9.key;
3958
4433
  });
3959
4434
  }
4435
+
3960
4436
  return features;
3961
4437
  })["catch"](function () {
3962
4438
  return [];
3963
4439
  });
3964
- }
3965
- // 要素鼠标悬浮事件
4440
+ } // 要素鼠标悬浮事件
4441
+
3966
4442
  }, {
3967
4443
  key: "mouseOverGraphic",
3968
4444
  value: function mouseOverGraphic(id, e) {
3969
4445
  var t = this;
3970
4446
  if (t.state.editId == id) return false;
4447
+
3971
4448
  if (typeof t.props.mouseOverGraphic === 'function') {
3972
4449
  var obj = {
3973
4450
  e: e,
@@ -3979,14 +4456,15 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3979
4456
  };
3980
4457
  t.props.mouseOverGraphic(obj);
3981
4458
  }
3982
- }
3983
- // 要素鼠标移开事件
4459
+ } // 要素鼠标移开事件
4460
+
3984
4461
  }, {
3985
4462
  key: "mouseOutGraphic",
3986
4463
  value: function mouseOutGraphic(id, e) {
3987
- var t = this;
3988
- //编辑中的图元关闭其他事件返回
4464
+ var t = this; //编辑中的图元关闭其他事件返回
4465
+
3989
4466
  if (t.state.editId == id) return false;
4467
+
3990
4468
  if (typeof t.props.mouseOutGraphic === 'function') {
3991
4469
  var obj = {
3992
4470
  e: e,
@@ -3998,30 +4476,32 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
3998
4476
  };
3999
4477
  t.props.mouseOutGraphic(obj);
4000
4478
  }
4001
- }
4002
- //地图拖动之前事件
4479
+ } //地图拖动之前事件
4480
+
4003
4481
  }, {
4004
4482
  key: "dragMapStart",
4005
4483
  value: function dragMapStart(e) {
4006
4484
  var t = this;
4485
+
4007
4486
  if (typeof t.props.dragMapStart === 'function') {
4008
4487
  var obj = t.getMapExtent();
4009
4488
  obj.e = e;
4010
4489
  t.props.dragMapStart(obj);
4011
4490
  }
4012
- }
4013
- //地图拖动结束后事件
4491
+ } //地图拖动结束后事件
4492
+
4014
4493
  }, {
4015
4494
  key: "dragMapEnd",
4016
4495
  value: function dragMapEnd(e) {
4017
4496
  var t = this;
4497
+
4018
4498
  if (typeof t.props.dragMapEnd === 'function') {
4019
4499
  var obj = t.getMapExtent();
4020
4500
  obj.e = e;
4021
4501
  t.props.dragMapEnd(obj);
4022
4502
  }
4023
- }
4024
- //热力图
4503
+ } //热力图
4504
+
4025
4505
  }, {
4026
4506
  key: "heatMapOverlay",
4027
4507
  value: function heatMapOverlay() {
@@ -4034,23 +4514,28 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
4034
4514
  opacity: 0.7,
4035
4515
  gradient: ['#00f', '#0ff', '#0f0', '#ff0', '#f00']
4036
4516
  };
4517
+
4037
4518
  if (d.config) {
4038
4519
  cg = _objectSpread(_objectSpread({}, cg), d.config);
4039
4520
  }
4521
+
4040
4522
  var gradient = [];
4523
+
4041
4524
  if (cg.gradient) {
4042
4525
  for (var key in cg.gradient) {
4043
4526
  gradient.push(cg.gradient[key]);
4044
4527
  }
4528
+
4045
4529
  cg.gradient = gradient;
4046
- }
4047
- // if(d.data){
4530
+ } // if(d.data){
4048
4531
  // t.state.pointIds = [];
4049
4532
  // t.pointLayers.map(item => {
4050
4533
  // t.state.gis.removeLayer(item.layer);
4051
4534
  // t.pointLayers=[];
4052
4535
  // })
4053
4536
  // }
4537
+
4538
+
4054
4539
  var heatData = {
4055
4540
  type: 'FeatureCollection',
4056
4541
  features: (d.data || []).map(function (item) {
@@ -4089,63 +4574,69 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
4089
4574
  if (t.heatmap) t.state.gis.removeLayer(t.heatmap);
4090
4575
  t.heatmap = null;
4091
4576
  t.refresh();
4092
- }
4093
- //地图移动之前事件
4577
+ } //地图移动之前事件
4578
+
4094
4579
  }, {
4095
4580
  key: "moveStart",
4096
4581
  value: function moveStart(e) {
4097
4582
  var t = this;
4583
+
4098
4584
  if (typeof t.props.moveStart === 'function') {
4099
4585
  var obj = t.getMapExtent();
4100
4586
  obj.e = e;
4101
4587
  t.props.moveStart(obj);
4102
4588
  }
4103
- }
4104
- //地图移动结束后事件
4589
+ } //地图移动结束后事件
4590
+
4105
4591
  }, {
4106
4592
  key: "moveEnd",
4107
4593
  value: function moveEnd(e) {
4108
4594
  var t = this;
4595
+
4109
4596
  if (typeof t.props.moveEnd === 'function') {
4110
4597
  var obj = t.getMapExtent();
4111
4598
  obj.e = e;
4112
4599
  t.props.moveEnd(obj);
4113
4600
  }
4114
- }
4115
- //地图更改缩放级别开始时触发触发此事件
4601
+ } //地图更改缩放级别开始时触发触发此事件
4602
+
4116
4603
  }, {
4117
4604
  key: "zoomStart",
4118
4605
  value: function zoomStart(e) {
4119
4606
  var t = this;
4607
+
4120
4608
  if (typeof t.props.zoomStart === 'function') {
4121
4609
  var obj = t.getMapExtent();
4122
4610
  obj.e = e;
4123
4611
  t.props.zoomStart(obj);
4124
4612
  }
4125
- }
4126
- //地图更改缩放级别结束时触发触发此事件
4613
+ } //地图更改缩放级别结束时触发触发此事件
4614
+
4127
4615
  }, {
4128
4616
  key: "zoomEnd",
4129
4617
  value: function zoomEnd(e) {
4130
4618
  var t = this;
4619
+
4131
4620
  if (typeof t.props.zoomEnd === 'function') {
4132
4621
  var obj = t.getMapExtent();
4133
4622
  obj.e = e;
4134
4623
  t.props.zoomEnd(obj);
4135
4624
  }
4136
- }
4137
- // 图元点击事件
4625
+ } // 图元点击事件
4626
+
4138
4627
  }, {
4139
4628
  key: "clickGraphic",
4140
4629
  value: function clickGraphic(id, e) {
4141
4630
  var target = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
4142
- var t = this;
4143
- //编辑中的图元关闭其他事件返回
4631
+ var t = this; //编辑中的图元关闭其他事件返回
4632
+
4144
4633
  if (t.editId == id) return false;
4634
+
4145
4635
  if (typeof t.props.clickGraphic === 'function') {
4146
4636
  var _e$pixel = _slicedToArray(e.pixel, 2),
4147
- clientX = _e$pixel[0],
4148
- clientY = _e$pixel[1];
4637
+ clientX = _e$pixel[0],
4638
+ clientY = _e$pixel[1];
4639
+
4149
4640
  var param = t.getGraphic(id, clientX, clientY);
4150
4641
  var obj = {
4151
4642
  param: param,
@@ -4169,46 +4660,58 @@ var OlMap = /*#__PURE__*/function (_React$Component) {
4169
4660
  value: function componentWillUnmount() {
4170
4661
  //关闭moveTo定时
4171
4662
  var t = this;
4663
+
4172
4664
  if (t.moveToTimer) {
4173
4665
  clearInterval(t.moveToTimer);
4174
- }
4175
- //关闭animation定时
4666
+ } //关闭animation定时
4667
+
4668
+
4176
4669
  for (var j in t.animTimer) {
4177
4670
  if (t.animTimer[j]) {
4178
4671
  clearInterval(t.animTimer[j]);
4179
4672
  }
4180
4673
  }
4674
+
4181
4675
  window.VtxMap && (window.VtxMap[t.state.mapId] = null);
4182
4676
  }
4183
4677
  }]);
4678
+
4184
4679
  return OlMap;
4185
4680
  }(_react["default"].Component);
4186
- var _default = exports["default"] = OlMap;
4681
+
4682
+ var _default = OlMap;
4683
+ exports["default"] = _default;
4684
+
4187
4685
  var Popup = /*#__PURE__*/function (_React$Component2) {
4188
4686
  _inherits(Popup, _React$Component2);
4687
+
4189
4688
  var _super2 = _createSuper(Popup);
4689
+
4190
4690
  function Popup(props) {
4191
- var _this9;
4691
+ var _this10;
4692
+
4192
4693
  _classCallCheck(this, Popup);
4193
- _this9 = _super2.call(this);
4194
- _this9.map = props.map;
4195
- _this9.position = props.position;
4196
- _this9.overlay = null;
4197
- _this9.container = null;
4198
- _this9.innerHTML = props.innerHTML;
4199
- _this9.closeble = props.close;
4200
- return _this9;
4201
- }
4202
4694
 
4203
- // 弹出框
4695
+ _this10 = _super2.call(this);
4696
+ _this10.map = props.map;
4697
+ _this10.position = props.position;
4698
+ _this10.overlay = null;
4699
+ _this10.container = null;
4700
+ _this10.innerHTML = props.innerHTML;
4701
+ _this10.closeble = props.close;
4702
+ return _this10;
4703
+ } // 弹出框
4704
+
4705
+
4204
4706
  _createClass(Popup, [{
4205
4707
  key: "showPopup",
4206
4708
  value: function showPopup() {
4207
4709
  var t = this;
4208
- this.removePopup();
4209
- // 获取弹出层DOM
4710
+ this.removePopup(); // 获取弹出层DOM
4711
+
4210
4712
  t.container = document.createElement("div");
4211
4713
  t.container['className'] = "ol-popup";
4714
+
4212
4715
  if (t.closeble) {
4213
4716
  var close = document.createElement("a");
4214
4717
  close['className'] = "ol-popup-closer";
@@ -4217,8 +4720,10 @@ var Popup = /*#__PURE__*/function (_React$Component2) {
4217
4720
  });
4218
4721
  t.container.appendChild(close);
4219
4722
  }
4723
+
4220
4724
  var content = document.createElement("div");
4221
4725
  t.container.appendChild(content);
4726
+
4222
4727
  if (t.overlay) {} else {
4223
4728
  // 创建Overlay弹出层绑定DOM
4224
4729
  t.overlay = new ol.Overlay({
@@ -4228,85 +4733,100 @@ var Popup = /*#__PURE__*/function (_React$Component2) {
4228
4733
  duration: 250
4229
4734
  }
4230
4735
  }
4231
- });
4232
- // 添加到map
4736
+ }); // 添加到map
4737
+
4233
4738
  t.map.addOverlay(t.overlay);
4234
- }
4235
- // 弹出层内容
4236
- content.innerHTML = t.innerHTML;
4237
- // 设置弹出层位置即可出现
4739
+ } // 弹出层内容
4740
+
4741
+
4742
+ content.innerHTML = t.innerHTML; // 设置弹出层位置即可出现
4743
+
4238
4744
  t.overlay.setPosition(t.position);
4239
- }
4240
- // 清除弹出框
4745
+ } // 清除弹出框
4746
+
4241
4747
  }, {
4242
4748
  key: "removePopup",
4243
4749
  value: function removePopup() {
4244
4750
  if (this.overlay) {
4245
- this.container.remove();
4246
- // 设置位置undefined可达到隐藏清除弹出框
4751
+ this.container.remove(); // 设置位置undefined可达到隐藏清除弹出框
4752
+
4247
4753
  this.overlay.setPosition(undefined);
4248
4754
  this.overlay = null;
4249
4755
  }
4250
4756
  }
4251
4757
  }]);
4758
+
4252
4759
  return Popup;
4253
4760
  }(_react["default"].Component);
4761
+
4254
4762
  function getRgbColor(color, opacity) {
4255
4763
  var reg = /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/;
4764
+
4256
4765
  if (!reg.test(color) && typeof color !== 'string') {
4257
4766
  return;
4258
4767
  }
4768
+
4259
4769
  var newStr = color.toLowerCase().replace(/\#/g, '');
4260
4770
  var len = newStr.length;
4771
+
4261
4772
  if (len == 3) {
4262
4773
  var t = '';
4774
+
4263
4775
  for (var i = 0; i < len; i++) {
4264
4776
  t += newStr.slice(i, i + 1).concat(newStr.slice(i, i + 1));
4265
4777
  }
4778
+
4266
4779
  newStr = t;
4267
4780
  }
4781
+
4268
4782
  var arr = []; //将字符串分隔,两个两个的分隔
4783
+
4269
4784
  for (var i = 0; i < 6; i = i + 2) {
4270
4785
  var s = newStr.slice(i, i + 2);
4271
4786
  arr.push(parseInt('0x' + s));
4272
4787
  }
4788
+
4273
4789
  return 'rgba(' + arr.join(',') + ',' + opacity + ')';
4274
- }
4790
+ } // 压缩图片的方法
4791
+
4275
4792
 
4276
- // 压缩图片的方法
4277
4793
  function canvasDataURL(path, obj, callback) {
4278
4794
  var img = new Image();
4279
4795
  img.src = path;
4280
4796
  img.setAttribute("crossOrigin", 'Anonymous');
4797
+
4281
4798
  img.onload = function () {
4282
- var that = this;
4283
- // 默认按比例压缩
4799
+ var that = this; // 默认按比例压缩
4800
+
4284
4801
  var w = that.width,
4285
- h = that.height,
4286
- scale = w / h;
4802
+ h = that.height,
4803
+ scale = w / h;
4287
4804
  w = obj.width || w;
4288
4805
  h = obj.height || w / scale;
4289
4806
  var quality = 0.7; // 默认图片质量为0.7
4290
4807
  //生成canvas
4808
+
4291
4809
  var canvas = document.createElement('canvas');
4292
- var ctx = canvas.getContext('2d');
4293
- // 创建属性节点
4810
+ var ctx = canvas.getContext('2d'); // 创建属性节点
4811
+
4294
4812
  var anw = document.createAttribute("width");
4295
4813
  anw.nodeValue = w;
4296
4814
  var anh = document.createAttribute("height");
4297
4815
  anh.nodeValue = h;
4298
4816
  canvas.setAttributeNode(anw);
4299
4817
  canvas.setAttributeNode(anh);
4300
- ctx.drawImage(that, 0, 0, w, h);
4301
- // 图像质量
4818
+ ctx.drawImage(that, 0, 0, w, h); // 图像质量
4819
+
4302
4820
  if (obj.quality && obj.quality <= 1 && obj.quality > 0) {
4303
4821
  quality = obj.quality;
4304
- }
4305
- // quality值越小,所绘制出的图像越模糊
4306
- var base64 = canvas.toDataURL('image/png', quality);
4307
- // 回调函数返回base64的值
4822
+ } // quality值越小,所绘制出的图像越模糊
4823
+
4824
+
4825
+ var base64 = canvas.toDataURL('image/png', quality); // 回调函数返回base64的值
4826
+
4308
4827
  callback(base64);
4309
4828
  };
4310
4829
  }
4830
+
4311
4831
  module.exports = exports["default"];
4312
4832
  //# sourceMappingURL=Map.js.map