@vtx/ol-map 2.0.0-beta.12 → 2.0.0-beta.13

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.
@@ -0,0 +1,1259 @@
1
+ "use strict";
2
+
3
+ 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); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports["default"] = _default;
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _antd = require("antd");
10
+ var _Modal = _interopRequireDefault(require("../../components/Modal"));
11
+ var _html2canvas = _interopRequireDefault(require("html2canvas"));
12
+ var _interaction = require("ol/interaction");
13
+ var _Vector = _interopRequireDefault(require("ol/layer/Vector"));
14
+ var _Tile = _interopRequireDefault(require("ol/layer/Tile"));
15
+ var _Image = _interopRequireDefault(require("ol/layer/Image"));
16
+ var _Vector2 = _interopRequireDefault(require("ol/source/Vector"));
17
+ var _Draw = require("ol/interaction/Draw");
18
+ var _Draw2 = require("../../Utils/Draw");
19
+ var _useProps2 = _interopRequireDefault(require("../../../use-props"));
20
+ var _olMap = require("@vtx/ol-map");
21
+ require("./index.less");
22
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
23
+ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
24
+ function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
25
+ 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."); }
26
+ function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
27
+ function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
28
+ function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, 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 o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
29
+ function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
30
+ function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
31
+ function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
32
+ function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
33
+ 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; }
34
+ 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; }
35
+ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
36
+ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
37
+ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
38
+ function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
39
+ 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."); }
40
+ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
41
+ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
42
+ 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; } }
43
+ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
44
+ var pageSizeOptions = ['A4', 'A3', 'A2', 'A1', 'A0'];
45
+ var pageSizeMap = {
46
+ A4: {
47
+ width: 210,
48
+ height: 297
49
+ },
50
+ A3: {
51
+ width: 297,
52
+ height: 420
53
+ },
54
+ A2: {
55
+ width: 420,
56
+ height: 594
57
+ },
58
+ A1: {
59
+ width: 594,
60
+ height: 841
61
+ },
62
+ A0: {
63
+ width: 841,
64
+ height: 1189
65
+ }
66
+ };
67
+ var DIMENSION_DPI = 96;
68
+ var EXPORT_DPI = 144;
69
+ var PREVIEW_HEIGHT = 610;
70
+ var PREVIEW_WIDTH = 980;
71
+ var pxToMm = function pxToMm(px) {
72
+ var dpi = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DIMENSION_DPI;
73
+ return px * 25.4 / dpi;
74
+ };
75
+ var mmToPx = function mmToPx(mm) {
76
+ var dpi = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : EXPORT_DPI;
77
+ return mm * dpi / 25.4;
78
+ };
79
+ var mmToPt = function mmToPt(mm) {
80
+ return mm * 72 / 25.4;
81
+ };
82
+ var isValidExtent = function isValidExtent(extent) {
83
+ return Array.isArray(extent) && extent.length === 4 && extent.every(function (item) {
84
+ return Number.isFinite(item);
85
+ }) && extent[2] > extent[0] && extent[3] > extent[1];
86
+ };
87
+
88
+ // 按指定层级把地理范围换算成屏幕像素和毫米尺寸。
89
+ // 这里算出来的宽高是后面分幅、预览和导出的统一基础数据。
90
+ var calcMetricsFromZoom = function calcMetricsFromZoom(extent, view, zoom) {
91
+ if (!isValidExtent(extent)) {
92
+ return null;
93
+ }
94
+ var resolution = view.getResolutionForZoom(zoom) || view.getResolution();
95
+ var geoWidth = extent[2] - extent[0];
96
+ var geoHeight = extent[3] - extent[1];
97
+ var pixelWidth = geoWidth / resolution;
98
+ var pixelHeight = geoHeight / resolution;
99
+ var widthMm = pxToMm(pixelWidth, DIMENSION_DPI);
100
+ var heightMm = pxToMm(pixelHeight, DIMENSION_DPI);
101
+ return {
102
+ extent: extent,
103
+ zoom: zoom,
104
+ resolution: resolution,
105
+ geoWidth: geoWidth,
106
+ geoHeight: geoHeight,
107
+ pixelWidth: pixelWidth,
108
+ pixelHeight: pixelHeight,
109
+ widthMm: widthMm,
110
+ heightMm: heightMm,
111
+ ratio: heightMm / widthMm
112
+ };
113
+ };
114
+
115
+ // 根据总宽高、纸张尺寸和重叠边距,计算需要切成多少张纸,
116
+ // 以及每一张纸在整幅图中的毫米位置。
117
+ var calcSplitPlan = function calcSplitPlan(_ref) {
118
+ var totalWidthMm = _ref.totalWidthMm,
119
+ totalHeightMm = _ref.totalHeightMm,
120
+ pageSize = _ref.pageSize,
121
+ _ref$overlapMargin = _ref.overlapMargin,
122
+ overlapMargin = _ref$overlapMargin === void 0 ? 0 : _ref$overlapMargin;
123
+ var paper = pageSizeMap[pageSize];
124
+ if (!paper || !totalWidthMm || !totalHeightMm) {
125
+ return null;
126
+ }
127
+ var safeOverlap = Math.max(0, Number(overlapMargin) || 0);
128
+ var stepX = Math.max(1, paper.width - safeOverlap);
129
+ var stepY = Math.max(1, paper.height - safeOverlap);
130
+ var cols = Math.max(1, Math.ceil(totalWidthMm / stepX));
131
+ var rows = Math.max(1, Math.ceil(totalHeightMm / stepY));
132
+ var sheets = [];
133
+ for (var row = 0; row < rows; row++) {
134
+ for (var col = 0; col < cols; col++) {
135
+ var xMm = col * stepX;
136
+ var yMm = row * stepY;
137
+ var widthMm = Math.min(paper.width, totalWidthMm - xMm);
138
+ var heightMm = Math.min(paper.height, totalHeightMm - yMm);
139
+ sheets.push({
140
+ id: "".concat(row + 1, "-").concat(col + 1),
141
+ index: row * cols + col + 1,
142
+ row: row + 1,
143
+ col: col + 1,
144
+ xMm: xMm,
145
+ yMm: yMm,
146
+ widthMm: widthMm,
147
+ heightMm: heightMm,
148
+ isPartial: widthMm < paper.width || heightMm < paper.height
149
+ });
150
+ }
151
+ }
152
+ return {
153
+ paperWidthMm: paper.width,
154
+ paperHeightMm: paper.height,
155
+ overlapMargin: safeOverlap,
156
+ totalWidthMm: totalWidthMm,
157
+ totalHeightMm: totalHeightMm,
158
+ stepX: stepX,
159
+ stepY: stepY,
160
+ cols: cols,
161
+ rows: rows,
162
+ totalSheets: sheets.length,
163
+ sheets: sheets
164
+ };
165
+ };
166
+
167
+ // 把某一张分幅纸在整幅图中的毫米位置,映射回真实地图 extent。
168
+ var buildSheetExtent = function buildSheetExtent(sheet, plan, totalExtent) {
169
+ var _totalExtent = _slicedToArray(totalExtent, 4),
170
+ minX = _totalExtent[0],
171
+ minY = _totalExtent[1],
172
+ maxX = _totalExtent[2],
173
+ maxY = _totalExtent[3];
174
+ var xScale = (maxX - minX) / plan.totalWidthMm;
175
+ var yScale = (maxY - minY) / plan.totalHeightMm;
176
+ var left = minX + sheet.xMm * xScale;
177
+ var right = left + sheet.widthMm * xScale;
178
+ var top = maxY - sheet.yMm * yScale;
179
+ var bottom = top - sheet.heightMm * yScale;
180
+ return [left, bottom, right, top];
181
+ };
182
+
183
+ // 预览区显示的是“完整纸张网格”的外框,不是仅仅显示用户选中的蓝框范围。
184
+ // 这样最后一张纸即使没铺满,虚线纸张尺寸也仍然是完整的。
185
+ var buildPreviewFrameExtent = function buildPreviewFrameExtent(plan, totalExtent) {
186
+ if (!plan || !isValidExtent(totalExtent)) {
187
+ return null;
188
+ }
189
+ var _totalExtent2 = _slicedToArray(totalExtent, 4),
190
+ minX = _totalExtent2[0],
191
+ minY = _totalExtent2[1],
192
+ maxX = _totalExtent2[2],
193
+ maxY = _totalExtent2[3];
194
+ var xScale = (maxX - minX) / plan.totalWidthMm;
195
+ var yScale = (maxY - minY) / plan.totalHeightMm;
196
+ var frameWidthMm = plan.cols * plan.paperWidthMm;
197
+ var frameHeightMm = plan.rows * plan.paperHeightMm;
198
+ return [minX, maxY - frameHeightMm * yScale, minX + frameWidthMm * xScale, maxY];
199
+ };
200
+
201
+ // 预览/导出地图会复用原地图的图层源。
202
+ // 矢量图层这里做一份克隆,避免直接操作原图层上的 feature。
203
+ var cloneVectorSource = function cloneVectorSource(source) {
204
+ if (!(source !== null && source !== void 0 && source.getFeatures)) {
205
+ return source;
206
+ }
207
+ return new _Vector2["default"]({
208
+ features: source.getFeatures().map(function (feature) {
209
+ return feature.clone();
210
+ })
211
+ });
212
+ };
213
+
214
+ // 这里只同步常见业务图层到隐藏导出地图中,
215
+ // 不把框选图层、高亮层和底图标注层混进去,避免预览污染。
216
+ var cloneLayer = function cloneLayer(layer) {
217
+ var _layer$getOpacity, _layer$getVisible, _layer$getZIndex, _layer$getExtent;
218
+ var common = {
219
+ opacity: (_layer$getOpacity = layer.getOpacity) === null || _layer$getOpacity === void 0 ? void 0 : _layer$getOpacity.call(layer),
220
+ visible: (_layer$getVisible = layer.getVisible) === null || _layer$getVisible === void 0 ? void 0 : _layer$getVisible.call(layer),
221
+ zIndex: (_layer$getZIndex = layer.getZIndex) === null || _layer$getZIndex === void 0 ? void 0 : _layer$getZIndex.call(layer),
222
+ extent: (_layer$getExtent = layer.getExtent) === null || _layer$getExtent === void 0 ? void 0 : _layer$getExtent.call(layer)
223
+ };
224
+ if (layer instanceof _Vector["default"]) {
225
+ var clonedLayer = new _Vector["default"](_objectSpread(_objectSpread({}, common), {}, {
226
+ source: cloneVectorSource(layer.getSource()),
227
+ style: layer.getStyle()
228
+ }));
229
+ clonedLayer.set('__sheetPrintClone', true);
230
+ return clonedLayer;
231
+ }
232
+ if (layer instanceof _Tile["default"]) {
233
+ var _clonedLayer = new _Tile["default"](_objectSpread(_objectSpread({}, common), {}, {
234
+ source: layer.getSource()
235
+ }));
236
+ _clonedLayer.set('__sheetPrintClone', true);
237
+ return _clonedLayer;
238
+ }
239
+ if (layer instanceof _Image["default"]) {
240
+ var _clonedLayer2 = new _Image["default"](_objectSpread(_objectSpread({}, common), {}, {
241
+ source: layer.getSource()
242
+ }));
243
+ _clonedLayer2.set('__sheetPrintClone', true);
244
+ return _clonedLayer2;
245
+ }
246
+ return null;
247
+ };
248
+ var clearClonedLayers = function clearClonedLayers(mapInstance) {
249
+ if (!mapInstance) {
250
+ return;
251
+ }
252
+ mapInstance.getLayers().getArray().filter(function (layer) {
253
+ return layer.get('__sheetPrintClone');
254
+ }).forEach(function (layer) {
255
+ return mapInstance.removeLayer(layer);
256
+ });
257
+ };
258
+
259
+ // 隐藏导出地图和主地图不是同一个实例,所以需要把当前可见业务图层同步过去。
260
+ var syncBusinessLayers = function syncBusinessLayers(sourceMap, targetMap, excludeLayer) {
261
+ if (!sourceMap || !targetMap) {
262
+ return;
263
+ }
264
+ clearClonedLayers(targetMap);
265
+ sourceMap.getLayers().getArray().filter(function (layer) {
266
+ var _layer$getVisible2;
267
+ if (layer === excludeLayer) {
268
+ return false;
269
+ }
270
+ if (!(layer !== null && layer !== void 0 && (_layer$getVisible2 = layer.getVisible) !== null && _layer$getVisible2 !== void 0 && _layer$getVisible2.call(layer))) {
271
+ return false;
272
+ }
273
+ if (layer.get('key') === 'Highlight') {
274
+ return false;
275
+ }
276
+ if (layer.get('key') === '__TDT_TILE' || layer.get('key') === '__TDT_MARK') {
277
+ return false;
278
+ }
279
+ return layer instanceof _Vector["default"] || layer instanceof _Tile["default"] || layer instanceof _Image["default"];
280
+ }).forEach(function (layer) {
281
+ var clonedLayer = cloneLayer(layer);
282
+ if (clonedLayer) {
283
+ targetMap.addLayer(clonedLayer);
284
+ }
285
+ });
286
+ };
287
+ var waitNextFrame = function waitNextFrame() {
288
+ return new Promise(function (resolve) {
289
+ requestAnimationFrame(function () {
290
+ requestAnimationFrame(resolve);
291
+ });
292
+ });
293
+ };
294
+ var waitMapRender = function waitMapRender(mapInstance) {
295
+ return new Promise(function (resolve) {
296
+ var _mapInstance$renderSy;
297
+ if (!mapInstance) {
298
+ resolve();
299
+ return;
300
+ }
301
+ var done = false;
302
+ var finish = function finish() {
303
+ if (done) {
304
+ return;
305
+ }
306
+ done = true;
307
+ resolve();
308
+ };
309
+ mapInstance.once('rendercomplete', finish);
310
+ setTimeout(finish, 600);
311
+ (_mapInstance$renderSy = mapInstance.renderSync) === null || _mapInstance$renderSy === void 0 || _mapInstance$renderSy.call(mapInstance);
312
+ });
313
+ };
314
+
315
+ // 统一用 html2canvas 截取隐藏导出地图的 DOM,
316
+ // 预览图和最终分幅图片都走这条截图链路。
317
+ var captureDomCanvas = /*#__PURE__*/function () {
318
+ var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(dom, width, height) {
319
+ return _regenerator().w(function (_context) {
320
+ while (1) switch (_context.n) {
321
+ case 0:
322
+ return _context.a(2, (0, _html2canvas["default"])(dom, {
323
+ width: width,
324
+ height: height,
325
+ useCORS: true,
326
+ allowTaint: false,
327
+ backgroundColor: '#ffffff',
328
+ scale: 1
329
+ }));
330
+ }
331
+ }, _callee);
332
+ }));
333
+ return function captureDomCanvas(_x, _x2, _x3) {
334
+ return _ref2.apply(this, arguments);
335
+ };
336
+ }();
337
+ var dataUrlToUint8Array = function dataUrlToUint8Array(dataUrl) {
338
+ var base64 = dataUrl.split(',')[1];
339
+ var binary = atob(base64);
340
+ var bytes = new Uint8Array(binary.length);
341
+ for (var i = 0; i < binary.length; i++) {
342
+ bytes[i] = binary.charCodeAt(i);
343
+ }
344
+ return bytes;
345
+ };
346
+
347
+ // 这里没有依赖第三方 PDF 库,直接把多张 jpeg 包成一个简单 PDF。
348
+ var createPdfFromImages = function createPdfFromImages(_ref3) {
349
+ var images = _ref3.images,
350
+ pageWidthMm = _ref3.pageWidthMm,
351
+ pageHeightMm = _ref3.pageHeightMm,
352
+ title = _ref3.title;
353
+ var encoder = new TextEncoder();
354
+ var pageWidthPt = mmToPt(pageWidthMm);
355
+ var pageHeightPt = mmToPt(pageHeightMm);
356
+ var chunks = [];
357
+ var size = 0;
358
+ var pushString = function pushString(value) {
359
+ var bytes = encoder.encode(value);
360
+ chunks.push(bytes);
361
+ size += bytes.length;
362
+ };
363
+ var pushBytes = function pushBytes(value) {
364
+ chunks.push(value);
365
+ size += value.length;
366
+ };
367
+ var objectStarts = [];
368
+ var beginObject = function beginObject(id) {
369
+ objectStarts[id] = size;
370
+ pushString("".concat(id, " 0 obj\n"));
371
+ };
372
+ var endObject = function endObject() {
373
+ pushString('\nendobj\n');
374
+ };
375
+ pushString('%PDF-1.4\n');
376
+ beginObject(1);
377
+ pushString('<< /Type /Catalog /Pages 2 0 R >>');
378
+ endObject();
379
+ var pageRefs = [];
380
+ var nextObjectId = 3;
381
+ images.forEach(function (item, index) {
382
+ var imageBytes = dataUrlToUint8Array(item.url);
383
+ var pageId = nextObjectId;
384
+ var contentId = nextObjectId + 1;
385
+ var imageId = nextObjectId + 2;
386
+ var imageName = "/Im".concat(index + 1);
387
+ var content = "q\n".concat(pageWidthPt, " 0 0 ").concat(pageHeightPt, " 0 0 cm\n").concat(imageName, " Do\nQ");
388
+ pageRefs.push("".concat(pageId, " 0 R"));
389
+ beginObject(pageId);
390
+ pushString("<< /Type /Page /Parent 2 0 R /MediaBox [0 0 ".concat(pageWidthPt, " ").concat(pageHeightPt, "] /Resources << /XObject << ").concat(imageName, " ").concat(imageId, " 0 R >> >> /Contents ").concat(contentId, " 0 R >>"));
391
+ endObject();
392
+ beginObject(contentId);
393
+ pushString("<< /Length ".concat(content.length, " >>\nstream\n").concat(content, "\nendstream"));
394
+ endObject();
395
+ beginObject(imageId);
396
+ pushString("<< /Type /XObject /Subtype /Image /Width ".concat(item.pixelWidth, " /Height ").concat(item.pixelHeight, " /ColorSpace /DeviceRGB /BitsPerComponent 8 /Filter /DCTDecode /Length ").concat(imageBytes.length, " >>\nstream\n"));
397
+ pushBytes(imageBytes);
398
+ pushString('\nendstream');
399
+ endObject();
400
+ nextObjectId += 3;
401
+ });
402
+ var pagesOffset = size;
403
+ objectStarts[2] = pagesOffset;
404
+ pushString("2 0 obj\n<< /Type /Pages /Count ".concat(images.length, " /Kids [").concat(pageRefs.join(' '), "] >>\nendobj\n"));
405
+ var xrefOffset = size;
406
+ pushString("xref\n0 ".concat(nextObjectId, "\n0000000000 65535 f \n"));
407
+ for (var i = 1; i < nextObjectId; i++) {
408
+ var offset = objectStarts[i] || 0;
409
+ pushString("".concat(String(offset).padStart(10, '0'), " 00000 n \n"));
410
+ }
411
+ pushString("trailer\n<< /Size ".concat(nextObjectId, " /Root 1 0 R >>\nstartxref\n").concat(xrefOffset, "\n%%EOF"));
412
+ var blob = new Blob(chunks, {
413
+ type: 'application/pdf'
414
+ });
415
+ var url = URL.createObjectURL(blob);
416
+ var a = document.createElement('a');
417
+ a.href = url;
418
+ a.download = decodeURIComponent("".concat(title || 'map-sheet-print', ".pdf"));
419
+ document.body.appendChild(a);
420
+ a.click();
421
+ document.body.removeChild(a);
422
+ setTimeout(function () {
423
+ return URL.revokeObjectURL(url);
424
+ }, 1000);
425
+ };
426
+ function _default(props) {
427
+ var _splitPlan$sheets2;
428
+ var onClose = props.onClose;
429
+ var _useProps = (0, _useProps2["default"])(),
430
+ map = _useProps.map,
431
+ TextEnum = _useProps.TextEnum;
432
+ var _Form$useForm = _antd.Form.useForm(),
433
+ _Form$useForm2 = _slicedToArray(_Form$useForm, 1),
434
+ form = _Form$useForm2[0];
435
+ var _useState = (0, _react.useState)(false),
436
+ _useState2 = _slicedToArray(_useState, 2),
437
+ previewVisible = _useState2[0],
438
+ setPreviewVisible = _useState2[1];
439
+ var _useState3 = (0, _react.useState)(false),
440
+ _useState4 = _slicedToArray(_useState3, 2),
441
+ sheetVisible = _useState4[0],
442
+ setSheetVisible = _useState4[1];
443
+ var _useState5 = (0, _react.useState)({}),
444
+ _useState6 = _slicedToArray(_useState5, 2),
445
+ formVal = _useState6[0],
446
+ setFormVal = _useState6[1];
447
+ var _useState7 = (0, _react.useState)(null),
448
+ _useState8 = _slicedToArray(_useState7, 2),
449
+ metrics = _useState8[0],
450
+ setMetrics = _useState8[1];
451
+ var _useState9 = (0, _react.useState)(null),
452
+ _useState0 = _slicedToArray(_useState9, 2),
453
+ totalWidthMm = _useState0[0],
454
+ setTotalWidthMm = _useState0[1];
455
+ var _useState1 = (0, _react.useState)(null),
456
+ _useState10 = _slicedToArray(_useState1, 2),
457
+ totalHeightMm = _useState10[0],
458
+ setTotalHeightMm = _useState10[1];
459
+ var _useState11 = (0, _react.useState)(false),
460
+ _useState12 = _slicedToArray(_useState11, 2),
461
+ previewReady = _useState12[0],
462
+ setPreviewReady = _useState12[1];
463
+ var _useState13 = (0, _react.useState)(''),
464
+ _useState14 = _slicedToArray(_useState13, 2),
465
+ previewImage = _useState14[0],
466
+ setPreviewImage = _useState14[1];
467
+ var _useState15 = (0, _react.useState)([]),
468
+ _useState16 = _slicedToArray(_useState15, 2),
469
+ sheetImages = _useState16[0],
470
+ setSheetImages = _useState16[1];
471
+ var _useState17 = (0, _react.useState)([]),
472
+ _useState18 = _slicedToArray(_useState17, 2),
473
+ selectedSheetIds = _useState18[0],
474
+ setSelectedSheetIds = _useState18[1];
475
+ var _useState19 = (0, _react.useState)(false),
476
+ _useState20 = _slicedToArray(_useState19, 2),
477
+ generating = _useState20[0],
478
+ setGenerating = _useState20[1];
479
+ var _useState21 = (0, _react.useState)(0),
480
+ _useState22 = _slicedToArray(_useState21, 2),
481
+ previewMapVersion = _useState22[0],
482
+ setPreviewMapVersion = _useState22[1];
483
+ var drawTool = (0, _react.useRef)(null);
484
+ var boxExtentRef = (0, _react.useRef)(null);
485
+ var boxLayerRef = (0, _react.useRef)(null);
486
+ var exportMapRef = (0, _react.useRef)(null);
487
+ var exportStageRef = (0, _react.useRef)(null);
488
+ var renderLayersSyncedRef = (0, _react.useRef)(false);
489
+ var previewRenderSeqRef = (0, _react.useRef)(0);
490
+ var previewRenderTimerRef = (0, _react.useRef)(null);
491
+ var _useState23 = (0, _react.useState)({
492
+ width: 1,
493
+ height: 1
494
+ }),
495
+ _useState24 = _slicedToArray(_useState23, 2),
496
+ exportSize = _useState24[0],
497
+ setExportSize = _useState24[1];
498
+ (0, _react.useEffect)(function () {
499
+ form.setFieldsValue({
500
+ range: '1',
501
+ pageSize: 'A4',
502
+ overlapMargin: 0
503
+ });
504
+ }, []);
505
+ (0, _react.useEffect)(function () {
506
+ var boxSource = new _Vector2["default"]();
507
+ var boxLayer = new _Vector["default"]({
508
+ source: boxSource,
509
+ style: (0, _Draw2.drawStyle)(),
510
+ zIndex: 9999
511
+ });
512
+ var tool = new _interaction.Draw({
513
+ source: boxSource,
514
+ type: 'Circle',
515
+ style: function style(feature) {
516
+ return (0, _Draw2.drawStyle)(feature);
517
+ },
518
+ geometryFunction: (0, _Draw.createBox)()
519
+ });
520
+ boxLayerRef.current = boxLayer;
521
+ drawTool.current = tool;
522
+ tool.setActive(false);
523
+ tool.on('drawstart', function () {
524
+ boxSource.clear();
525
+ map.showTip(TextEnum.clickAgainToEnd);
526
+ });
527
+ tool.on('drawend', function (event) {
528
+ var extent = event.feature.getGeometry().getExtent();
529
+ boxExtentRef.current = extent;
530
+ map.showTip(TextEnum.leftClickToStart);
531
+ });
532
+ map.addLayer(boxLayer);
533
+ map.addInteraction(tool);
534
+ return function () {
535
+ if (previewRenderTimerRef.current) {
536
+ clearTimeout(previewRenderTimerRef.current);
537
+ }
538
+ boxSource.clear();
539
+ map.removeLayer(boxLayer);
540
+ map.removeInteraction(tool);
541
+ map.hideTip();
542
+ };
543
+ }, []);
544
+ var splitPlan = (0, _react.useMemo)(function () {
545
+ return calcSplitPlan({
546
+ totalWidthMm: totalWidthMm,
547
+ totalHeightMm: totalHeightMm,
548
+ pageSize: formVal.pageSize,
549
+ overlapMargin: formVal.overlapMargin
550
+ });
551
+ }, [totalWidthMm, totalHeightMm, formVal.pageSize, formVal.overlapMargin]);
552
+ var previewFrameExtent = (0, _react.useMemo)(function () {
553
+ return buildPreviewFrameExtent(splitPlan, metrics === null || metrics === void 0 ? void 0 : metrics.extent);
554
+ }, [splitPlan, metrics === null || metrics === void 0 ? void 0 : metrics.extent]);
555
+ var previewFramePixels = (0, _react.useMemo)(function () {
556
+ if (!splitPlan || !(metrics !== null && metrics !== void 0 && metrics.widthMm) || !(metrics !== null && metrics !== void 0 && metrics.heightMm) || !(metrics !== null && metrics !== void 0 && metrics.pixelWidth) || !(metrics !== null && metrics !== void 0 && metrics.pixelHeight)) {
557
+ return null;
558
+ }
559
+ var pixelsPerMmX = metrics.pixelWidth / metrics.widthMm;
560
+ var pixelsPerMmY = metrics.pixelHeight / metrics.heightMm;
561
+ return {
562
+ width: splitPlan.cols * splitPlan.paperWidthMm * pixelsPerMmX,
563
+ height: splitPlan.rows * splitPlan.paperHeightMm * pixelsPerMmY
564
+ };
565
+ }, [splitPlan, metrics]);
566
+ var selectedRangeCoverage = (0, _react.useMemo)(function () {
567
+ if (!splitPlan || !totalWidthMm || !totalHeightMm) {
568
+ return null;
569
+ }
570
+ return {
571
+ widthPercent: totalWidthMm / (splitPlan.cols * splitPlan.paperWidthMm) * 100,
572
+ heightPercent: totalHeightMm / (splitPlan.rows * splitPlan.paperHeightMm) * 100
573
+ };
574
+ }, [splitPlan, totalWidthMm, totalHeightMm]);
575
+ (0, _react.useEffect)(function () {
576
+ if (splitPlan) {
577
+ setSelectedSheetIds(splitPlan.sheets.map(function (item) {
578
+ return item.id;
579
+ }));
580
+ }
581
+ }, [splitPlan]);
582
+ var handleRangeChange = function handleRangeChange(value) {
583
+ var _drawTool$current;
584
+ if (value === '1') {
585
+ var _boxLayerRef$current;
586
+ map.hideTip();
587
+ (_boxLayerRef$current = boxLayerRef.current) === null || _boxLayerRef$current === void 0 || (_boxLayerRef$current = _boxLayerRef$current.getSource()) === null || _boxLayerRef$current === void 0 || _boxLayerRef$current.clear();
588
+ boxExtentRef.current = null;
589
+ } else {
590
+ map.showTip(TextEnum.leftClickToStart);
591
+ }
592
+ (_drawTool$current = drawTool.current) === null || _drawTool$current === void 0 || _drawTool$current.setActive(value === '2');
593
+ };
594
+ var handleExportMapCreated = function handleExportMapCreated(exportMap) {
595
+ exportMapRef.current = exportMap;
596
+ exportMap.getInteractions().forEach(function (item) {
597
+ return item.setActive(false);
598
+ });
599
+ syncBusinessLayers(map, exportMap, boxLayerRef.current);
600
+ };
601
+
602
+ // 隐藏导出地图只在第一次真正需要时补同步业务图层,
603
+ // 后面同一轮预览/导出尽量复用,避免频繁清空重建。
604
+ var ensureRenderMapLayers = function ensureRenderMapLayers() {
605
+ if (!exportMapRef.current) {
606
+ return false;
607
+ }
608
+ if (!renderLayersSyncedRef.current) {
609
+ syncBusinessLayers(map, exportMapRef.current, boxLayerRef.current);
610
+ renderLayersSyncedRef.current = true;
611
+ }
612
+ return true;
613
+ };
614
+
615
+ // 点击“执行分幅”时,直接读取外部主地图当前层级,
616
+ // 也就是“外面地图是什么层级,进去就按什么层级算”。
617
+ var handleSubmit = function handleSubmit(values) {
618
+ var _map$getView$getZoom, _map$getView;
619
+ var extent = values.range === '1' ? map.getView().calculateExtent(map.getSize()) : boxExtentRef.current;
620
+ if (!isValidExtent(extent)) {
621
+ return;
622
+ }
623
+ var zoom = Math.round(((_map$getView$getZoom = (_map$getView = map.getView()).getZoom) === null || _map$getView$getZoom === void 0 ? void 0 : _map$getView$getZoom.call(_map$getView)) || 0);
624
+ var nextMetrics = calcMetricsFromZoom(extent, map.getView(), zoom);
625
+ if (!nextMetrics) {
626
+ return;
627
+ }
628
+ console.log('[MapSheetPrint] 执行分幅参数', {
629
+ rangeMode: values.range,
630
+ extent: extent,
631
+ zoom: zoom,
632
+ pageSize: values.pageSize,
633
+ overlapMargin: values.overlapMargin,
634
+ metrics: {
635
+ geoWidth: nextMetrics.geoWidth,
636
+ geoHeight: nextMetrics.geoHeight,
637
+ pixelWidth: nextMetrics.pixelWidth,
638
+ pixelHeight: nextMetrics.pixelHeight,
639
+ widthMm: nextMetrics.widthMm,
640
+ heightMm: nextMetrics.heightMm,
641
+ ratio: nextMetrics.ratio
642
+ }
643
+ });
644
+ setFormVal(_objectSpread(_objectSpread({}, values), {}, {
645
+ printZoom: zoom
646
+ }));
647
+ setMetrics(nextMetrics);
648
+ setTotalWidthMm(Number(nextMetrics.widthMm.toFixed(3)));
649
+ setTotalHeightMm(Number(nextMetrics.heightMm.toFixed(3)));
650
+ setPreviewReady(false);
651
+ setPreviewImage('');
652
+ renderLayersSyncedRef.current = false;
653
+ setPreviewMapVersion(function (current) {
654
+ return current + 1;
655
+ });
656
+ setSheetImages([]);
657
+ setSheetVisible(false);
658
+ setPreviewVisible(true);
659
+ };
660
+ var handleWidthChange = function handleWidthChange(value) {
661
+ if (!metrics || !value) {
662
+ return;
663
+ }
664
+ var nextWidth = Number(value);
665
+ setTotalWidthMm(nextWidth);
666
+ setTotalHeightMm(Number((nextWidth * metrics.ratio).toFixed(3)));
667
+ };
668
+ var handleHeightChange = function handleHeightChange(value) {
669
+ if (!metrics || !value) {
670
+ return;
671
+ }
672
+ var nextHeight = Number(value);
673
+ setTotalHeightMm(nextHeight);
674
+ setTotalWidthMm(Number((nextHeight / metrics.ratio).toFixed(3)));
675
+ };
676
+ var renderSheetImage = /*#__PURE__*/function () {
677
+ var _ref4 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(sheet) {
678
+ var _exportMapRef$current, _exportMapRef$current2;
679
+ var sheetExtent, captureWidthPx, captureHeightPx, pageWidthPx, pageHeightPx, sourceCanvas, pageCanvas, ctx;
680
+ return _regenerator().w(function (_context2) {
681
+ while (1) switch (_context2.n) {
682
+ case 0:
683
+ if (!(!(metrics !== null && metrics !== void 0 && metrics.extent) || !splitPlan || !exportMapRef.current || !exportStageRef.current)) {
684
+ _context2.n = 1;
685
+ break;
686
+ }
687
+ return _context2.a(2, null);
688
+ case 1:
689
+ // 每一张纸先按自己的真实内容范围渲染,
690
+ // 再贴到完整纸张大小的白底画布上,末页不足的部分自然留白。
691
+ sheetExtent = buildSheetExtent(sheet, splitPlan, metrics.extent);
692
+ captureWidthPx = Math.max(1, Math.round(mmToPx(sheet.widthMm, EXPORT_DPI)));
693
+ captureHeightPx = Math.max(1, Math.round(mmToPx(sheet.heightMm, EXPORT_DPI)));
694
+ pageWidthPx = Math.max(1, Math.round(mmToPx(splitPlan.paperWidthMm, EXPORT_DPI)));
695
+ pageHeightPx = Math.max(1, Math.round(mmToPx(splitPlan.paperHeightMm, EXPORT_DPI)));
696
+ console.log('[MapSheetPrint] 生成单张图幅', {
697
+ sheetId: sheet.id,
698
+ sheetIndex: sheet.index,
699
+ sheetExtent: sheetExtent,
700
+ sheetWidthMm: sheet.widthMm,
701
+ sheetHeightMm: sheet.heightMm,
702
+ captureWidthPx: captureWidthPx,
703
+ captureHeightPx: captureHeightPx,
704
+ pageWidthPx: pageWidthPx,
705
+ pageHeightPx: pageHeightPx
706
+ });
707
+ setExportSize({
708
+ width: captureWidthPx,
709
+ height: captureHeightPx
710
+ });
711
+ _context2.n = 2;
712
+ return waitNextFrame();
713
+ case 2:
714
+ ensureRenderMapLayers();
715
+ (_exportMapRef$current = (_exportMapRef$current2 = exportMapRef.current).updateSize) === null || _exportMapRef$current === void 0 || _exportMapRef$current.call(_exportMapRef$current2);
716
+ exportMapRef.current.getView().fit(sheetExtent, {
717
+ size: [captureWidthPx, captureHeightPx],
718
+ duration: 0
719
+ });
720
+ _context2.n = 3;
721
+ return waitMapRender(exportMapRef.current);
722
+ case 3:
723
+ _context2.n = 4;
724
+ return captureDomCanvas(exportStageRef.current, captureWidthPx, captureHeightPx);
725
+ case 4:
726
+ sourceCanvas = _context2.v;
727
+ pageCanvas = document.createElement('canvas');
728
+ pageCanvas.width = pageWidthPx;
729
+ pageCanvas.height = pageHeightPx;
730
+ ctx = pageCanvas.getContext('2d');
731
+ ctx.fillStyle = '#fff';
732
+ ctx.fillRect(0, 0, pageWidthPx, pageHeightPx);
733
+ ctx.drawImage(sourceCanvas, 0, 0, captureWidthPx, captureHeightPx);
734
+ return _context2.a(2, _objectSpread(_objectSpread({}, sheet), {}, {
735
+ url: pageCanvas.toDataURL('image/jpeg', 0.92),
736
+ pixelWidth: pageWidthPx,
737
+ pixelHeight: pageHeightPx
738
+ }));
739
+ }
740
+ }, _callee2);
741
+ }));
742
+ return function renderSheetImage(_x4) {
743
+ return _ref4.apply(this, arguments);
744
+ };
745
+ }();
746
+
747
+ // 预览图显示的是“整套纸张网格下的总览图”:
748
+ // 蓝框表示真实选区,虚线表示每一张纸的边界。
749
+ // 这里会按当前层级和纸张网格尺寸,重新驱动隐藏地图渲染一张总览图。
750
+ var renderPreviewImage = /*#__PURE__*/function () {
751
+ var _ref5 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee3(seq) {
752
+ var _exportMapRef$current3, _exportMapRef$current4;
753
+ var view, center, canvas;
754
+ return _regenerator().w(function (_context3) {
755
+ while (1) switch (_context3.n) {
756
+ case 0:
757
+ if (!(!previewVisible || !(metrics !== null && metrics !== void 0 && metrics.extent) || !previewFrameExtent || !previewFramePixels || !exportMapRef.current || !exportStageRef.current)) {
758
+ _context3.n = 1;
759
+ break;
760
+ }
761
+ return _context3.a(2);
762
+ case 1:
763
+ console.log('[MapSheetPrint] 生成预览图', {
764
+ seq: seq,
765
+ extent: metrics.extent,
766
+ zoom: metrics.zoom,
767
+ totalWidthMm: totalWidthMm,
768
+ totalHeightMm: totalHeightMm,
769
+ previewFrameExtent: previewFrameExtent,
770
+ previewFramePixels: previewFramePixels,
771
+ splitPlan: splitPlan ? {
772
+ cols: splitPlan.cols,
773
+ rows: splitPlan.rows,
774
+ totalSheets: splitPlan.totalSheets,
775
+ paperWidthMm: splitPlan.paperWidthMm,
776
+ paperHeightMm: splitPlan.paperHeightMm,
777
+ stepX: splitPlan.stepX,
778
+ stepY: splitPlan.stepY
779
+ } : null
780
+ });
781
+ setExportSize({
782
+ width: Math.max(1, Math.round(previewFramePixels.width)),
783
+ height: Math.max(1, Math.round(previewFramePixels.height))
784
+ });
785
+ _context3.n = 2;
786
+ return waitNextFrame();
787
+ case 2:
788
+ if (!(seq !== previewRenderSeqRef.current)) {
789
+ _context3.n = 3;
790
+ break;
791
+ }
792
+ return _context3.a(2);
793
+ case 3:
794
+ if (ensureRenderMapLayers()) {
795
+ _context3.n = 4;
796
+ break;
797
+ }
798
+ return _context3.a(2);
799
+ case 4:
800
+ (_exportMapRef$current3 = (_exportMapRef$current4 = exportMapRef.current).updateSize) === null || _exportMapRef$current3 === void 0 || _exportMapRef$current3.call(_exportMapRef$current4);
801
+ view = exportMapRef.current.getView();
802
+ center = [(previewFrameExtent[0] + previewFrameExtent[2]) / 2, (previewFrameExtent[1] + previewFrameExtent[3]) / 2];
803
+ view.setCenter(center);
804
+ view.setZoom(metrics.zoom);
805
+ _context3.n = 5;
806
+ return waitMapRender(exportMapRef.current);
807
+ case 5:
808
+ _context3.n = 6;
809
+ return waitNextFrame();
810
+ case 6:
811
+ if (!(seq !== previewRenderSeqRef.current)) {
812
+ _context3.n = 7;
813
+ break;
814
+ }
815
+ return _context3.a(2);
816
+ case 7:
817
+ _context3.n = 8;
818
+ return captureDomCanvas(exportStageRef.current, Math.max(1, Math.round(previewFramePixels.width)), Math.max(1, Math.round(previewFramePixels.height)));
819
+ case 8:
820
+ canvas = _context3.v;
821
+ if (!(seq !== previewRenderSeqRef.current)) {
822
+ _context3.n = 9;
823
+ break;
824
+ }
825
+ return _context3.a(2);
826
+ case 9:
827
+ setPreviewImage(canvas.toDataURL('image/jpeg', 0.92));
828
+ setPreviewReady(true);
829
+ case 10:
830
+ return _context3.a(2);
831
+ }
832
+ }, _callee3);
833
+ }));
834
+ return function renderPreviewImage(_x5) {
835
+ return _ref5.apply(this, arguments);
836
+ };
837
+ }();
838
+ (0, _react.useEffect)(function () {
839
+ if (previewRenderTimerRef.current) {
840
+ clearTimeout(previewRenderTimerRef.current);
841
+ }
842
+ if (!previewVisible) {
843
+ return;
844
+ }
845
+ var seq = previewRenderSeqRef.current + 1;
846
+ previewRenderSeqRef.current = seq;
847
+ previewRenderTimerRef.current = setTimeout(function () {
848
+ renderPreviewImage(seq);
849
+ }, 120);
850
+ return function () {
851
+ if (previewRenderTimerRef.current) {
852
+ clearTimeout(previewRenderTimerRef.current);
853
+ }
854
+ };
855
+ }, [previewVisible, previewMapVersion, metrics === null || metrics === void 0 ? void 0 : metrics.zoom, previewFrameExtent, previewFramePixels]);
856
+ (0, _react.useEffect)(function () {
857
+ if (!splitPlan) {
858
+ return;
859
+ }
860
+ console.log('[MapSheetPrint] 分幅计算结果', {
861
+ totalWidthMm: totalWidthMm,
862
+ totalHeightMm: totalHeightMm,
863
+ pageSize: formVal.pageSize,
864
+ overlapMargin: formVal.overlapMargin,
865
+ cols: splitPlan.cols,
866
+ rows: splitPlan.rows,
867
+ totalSheets: splitPlan.totalSheets,
868
+ paperWidthMm: splitPlan.paperWidthMm,
869
+ paperHeightMm: splitPlan.paperHeightMm,
870
+ sheets: splitPlan.sheets.map(function (item) {
871
+ return {
872
+ id: item.id,
873
+ index: item.index,
874
+ xMm: item.xMm,
875
+ yMm: item.yMm,
876
+ widthMm: item.widthMm,
877
+ heightMm: item.heightMm,
878
+ isPartial: item.isPartial
879
+ };
880
+ })
881
+ });
882
+ }, [splitPlan, totalWidthMm, totalHeightMm, formVal.pageSize, formVal.overlapMargin]);
883
+ var handleGenerateSheets = /*#__PURE__*/function () {
884
+ var _ref6 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4() {
885
+ var _splitPlan$sheets;
886
+ var images, _iterator, _step, sheet, image, _t;
887
+ return _regenerator().w(function (_context4) {
888
+ while (1) switch (_context4.p = _context4.n) {
889
+ case 0:
890
+ if (splitPlan !== null && splitPlan !== void 0 && (_splitPlan$sheets = splitPlan.sheets) !== null && _splitPlan$sheets !== void 0 && _splitPlan$sheets.length) {
891
+ _context4.n = 1;
892
+ break;
893
+ }
894
+ return _context4.a(2);
895
+ case 1:
896
+ setGenerating(true);
897
+ _context4.p = 2;
898
+ images = [];
899
+ _iterator = _createForOfIteratorHelper(splitPlan.sheets);
900
+ _context4.p = 3;
901
+ _iterator.s();
902
+ case 4:
903
+ if ((_step = _iterator.n()).done) {
904
+ _context4.n = 7;
905
+ break;
906
+ }
907
+ sheet = _step.value;
908
+ _context4.n = 5;
909
+ return renderSheetImage(sheet);
910
+ case 5:
911
+ image = _context4.v;
912
+ if (image) {
913
+ images.push(image);
914
+ }
915
+ case 6:
916
+ _context4.n = 4;
917
+ break;
918
+ case 7:
919
+ _context4.n = 9;
920
+ break;
921
+ case 8:
922
+ _context4.p = 8;
923
+ _t = _context4.v;
924
+ _iterator.e(_t);
925
+ case 9:
926
+ _context4.p = 9;
927
+ _iterator.f();
928
+ return _context4.f(9);
929
+ case 10:
930
+ setSheetImages(images);
931
+ setSelectedSheetIds(images.map(function (item) {
932
+ return item.id;
933
+ }));
934
+ setPreviewVisible(false);
935
+ setSheetVisible(true);
936
+ case 11:
937
+ _context4.p = 11;
938
+ setGenerating(false);
939
+ return _context4.f(11);
940
+ case 12:
941
+ return _context4.a(2);
942
+ }
943
+ }, _callee4, null, [[3, 8, 9, 10], [2,, 11, 12]]);
944
+ }));
945
+ return function handleGenerateSheets() {
946
+ return _ref6.apply(this, arguments);
947
+ };
948
+ }();
949
+ var handleExportPdf = function handleExportPdf() {
950
+ var selectedImages = sheetImages.filter(function (item) {
951
+ return selectedSheetIds.includes(item.id);
952
+ });
953
+ if (!selectedImages.length || !splitPlan) {
954
+ return;
955
+ }
956
+ createPdfFromImages({
957
+ images: selectedImages,
958
+ pageWidthMm: splitPlan.paperWidthMm,
959
+ pageHeightMm: splitPlan.paperHeightMm,
960
+ title: formVal.title
961
+ });
962
+ };
963
+ return /*#__PURE__*/_react["default"].createElement(_Modal["default"], {
964
+ title: TextEnum.toolMapSheetPrint,
965
+ onClose: onClose
966
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Form, {
967
+ form: form,
968
+ name: "mapSheetPrint",
969
+ labelCol: {
970
+ span: 8
971
+ },
972
+ wrapperCol: {
973
+ span: 16
974
+ },
975
+ onFinish: handleSubmit
976
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Form.Item, {
977
+ label: TextEnum.mapTitle,
978
+ name: "title",
979
+ rules: [{
980
+ required: true,
981
+ message: TextEnum.pleaseInputTitle
982
+ }]
983
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Input, {
984
+ placeholder: TextEnum.pleaseInput
985
+ })), /*#__PURE__*/_react["default"].createElement(_antd.Form.Item, {
986
+ label: TextEnum.downloadRange,
987
+ name: "range",
988
+ rules: [{
989
+ required: true,
990
+ message: TextEnum.pleaseSelect
991
+ }]
992
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
993
+ placeholder: TextEnum.pleaseSelect,
994
+ allowClear: true,
995
+ onChange: handleRangeChange,
996
+ options: [{
997
+ value: '1',
998
+ label: TextEnum.currentView
999
+ }, {
1000
+ value: '2',
1001
+ label: TextEnum.manualBoxSelect
1002
+ }]
1003
+ })), /*#__PURE__*/_react["default"].createElement(_antd.Form.Item, {
1004
+ label: "\u7EB8\u5F20\u5C3A\u5BF8",
1005
+ name: "pageSize",
1006
+ rules: [{
1007
+ required: true,
1008
+ message: TextEnum.pleaseSelect
1009
+ }]
1010
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
1011
+ placeholder: TextEnum.pleaseSelect,
1012
+ allowClear: true,
1013
+ options: pageSizeOptions.map(function (item) {
1014
+ return {
1015
+ value: item,
1016
+ label: item
1017
+ };
1018
+ })
1019
+ })), /*#__PURE__*/_react["default"].createElement(_antd.Form.Item, {
1020
+ label: "\u91CD\u53E0\u8FB9\u8DDD",
1021
+ name: "overlapMargin"
1022
+ }, /*#__PURE__*/_react["default"].createElement(_antd.InputNumber, {
1023
+ min: 0,
1024
+ precision: 0,
1025
+ style: {
1026
+ width: 'calc(100% - 40px)'
1027
+ }
1028
+ }), "\uFF08mm\uFF09"), /*#__PURE__*/_react["default"].createElement(_antd.Form.Item, {
1029
+ wrapperCol: {
1030
+ offset: 8,
1031
+ span: 16
1032
+ }
1033
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Button, {
1034
+ type: "primary",
1035
+ htmlType: "submit"
1036
+ }, "\u6267\u884C\u5206\u5E45"))), /*#__PURE__*/_react["default"].createElement(_antd.Modal, {
1037
+ open: previewVisible,
1038
+ title: TextEnum.preview,
1039
+ onCancel: function onCancel() {
1040
+ return setPreviewVisible(false);
1041
+ },
1042
+ onOk: handleGenerateSheets,
1043
+ okText: "\u786E\u5B9A",
1044
+ cancelText: TextEnum.cancel,
1045
+ width: map.getViewport().clientWidth - 80,
1046
+ centered: true,
1047
+ wrapClassName: "ol-mapprint-modal",
1048
+ confirmLoading: generating,
1049
+ destroyOnHidden: false
1050
+ }, /*#__PURE__*/_react["default"].createElement("div", {
1051
+ style: {
1052
+ display: 'flex',
1053
+ gap: 12,
1054
+ alignItems: 'center',
1055
+ marginBottom: 12
1056
+ }
1057
+ }, /*#__PURE__*/_react["default"].createElement("span", null, "\u5BBD"), /*#__PURE__*/_react["default"].createElement(_antd.InputNumber, {
1058
+ min: 0.001,
1059
+ precision: 3,
1060
+ value: totalWidthMm,
1061
+ onChange: handleWidthChange
1062
+ }), /*#__PURE__*/_react["default"].createElement("span", null, "mm"), /*#__PURE__*/_react["default"].createElement("span", {
1063
+ style: {
1064
+ color: '#999'
1065
+ }
1066
+ }, "\u56FA\u5B9A\u6BD4\u4F8B"), /*#__PURE__*/_react["default"].createElement("span", null, "\u9AD8"), /*#__PURE__*/_react["default"].createElement(_antd.InputNumber, {
1067
+ min: 0.001,
1068
+ precision: 3,
1069
+ value: totalHeightMm,
1070
+ onChange: handleHeightChange
1071
+ }), /*#__PURE__*/_react["default"].createElement("span", null, "mm"), splitPlan && /*#__PURE__*/_react["default"].createElement("span", {
1072
+ style: {
1073
+ marginLeft: 'auto',
1074
+ color: '#666'
1075
+ }
1076
+ }, splitPlan.cols, " \u5217 x ", splitPlan.rows, " \u884C\uFF0C\u5171 ", splitPlan.totalSheets, " \u5E45")), /*#__PURE__*/_react["default"].createElement("div", {
1077
+ style: {
1078
+ position: 'relative',
1079
+ height: PREVIEW_HEIGHT,
1080
+ overflow: 'auto',
1081
+ background: '#f5f5f5',
1082
+ border: '1px solid #e5e5e5'
1083
+ }
1084
+ }, !previewReady && /*#__PURE__*/_react["default"].createElement("div", {
1085
+ style: {
1086
+ position: 'absolute',
1087
+ inset: 0,
1088
+ display: 'flex',
1089
+ alignItems: 'center',
1090
+ justifyContent: 'center',
1091
+ zIndex: 2,
1092
+ background: 'rgba(255,255,255,0.72)'
1093
+ }
1094
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Spin, null)), metrics && previewFramePixels && splitPlan && /*#__PURE__*/_react["default"].createElement("div", {
1095
+ style: {
1096
+ position: 'relative',
1097
+ width: previewFramePixels.width,
1098
+ height: previewFramePixels.height,
1099
+ transformOrigin: 'top left'
1100
+ }
1101
+ }, /*#__PURE__*/_react["default"].createElement("div", {
1102
+ style: {
1103
+ width: previewFramePixels.width,
1104
+ height: previewFramePixels.height,
1105
+ display: previewImage ? 'block' : 'none'
1106
+ }
1107
+ }, /*#__PURE__*/_react["default"].createElement("img", {
1108
+ src: previewImage,
1109
+ alt: "sheet-preview",
1110
+ style: {
1111
+ width: '100%',
1112
+ height: '100%',
1113
+ display: 'block'
1114
+ }
1115
+ })), selectedRangeCoverage && selectedRangeCoverage.widthPercent < 100 && /*#__PURE__*/_react["default"].createElement("div", {
1116
+ style: {
1117
+ position: 'absolute',
1118
+ top: 0,
1119
+ right: 0,
1120
+ width: "".concat(100 - selectedRangeCoverage.widthPercent, "%"),
1121
+ height: "".concat(selectedRangeCoverage.heightPercent, "%"),
1122
+ background: 'rgba(255,255,255,0.96)',
1123
+ pointerEvents: 'none'
1124
+ }
1125
+ }), selectedRangeCoverage && selectedRangeCoverage.heightPercent < 100 && /*#__PURE__*/_react["default"].createElement("div", {
1126
+ style: {
1127
+ position: 'absolute',
1128
+ left: 0,
1129
+ bottom: 0,
1130
+ width: '100%',
1131
+ height: "".concat(100 - selectedRangeCoverage.heightPercent, "%"),
1132
+ background: 'rgba(255,255,255,0.96)',
1133
+ pointerEvents: 'none'
1134
+ }
1135
+ }), selectedRangeCoverage && /*#__PURE__*/_react["default"].createElement("div", {
1136
+ style: {
1137
+ position: 'absolute',
1138
+ left: 0,
1139
+ top: 0,
1140
+ width: "".concat(selectedRangeCoverage.widthPercent, "%"),
1141
+ height: "".concat(selectedRangeCoverage.heightPercent, "%"),
1142
+ border: '2px solid rgba(24, 144, 255, 0.9)',
1143
+ boxSizing: 'border-box',
1144
+ pointerEvents: 'none'
1145
+ }
1146
+ }), splitPlan === null || splitPlan === void 0 || (_splitPlan$sheets2 = splitPlan.sheets) === null || _splitPlan$sheets2 === void 0 ? void 0 : _splitPlan$sheets2.map(function (sheet) {
1147
+ return /*#__PURE__*/_react["default"].createElement("div", {
1148
+ key: sheet.id,
1149
+ style: {
1150
+ position: 'absolute',
1151
+ left: "".concat(sheet.xMm / (splitPlan.cols * splitPlan.paperWidthMm) * 100, "%"),
1152
+ top: "".concat(sheet.yMm / (splitPlan.rows * splitPlan.paperHeightMm) * 100, "%"),
1153
+ width: "".concat(splitPlan.paperWidthMm / (splitPlan.cols * splitPlan.paperWidthMm) * 100, "%"),
1154
+ height: "".concat(splitPlan.paperHeightMm / (splitPlan.rows * splitPlan.paperHeightMm) * 100, "%"),
1155
+ border: '2px dashed #333',
1156
+ boxSizing: 'border-box',
1157
+ pointerEvents: 'none'
1158
+ }
1159
+ }, /*#__PURE__*/_react["default"].createElement("div", {
1160
+ style: {
1161
+ position: 'absolute',
1162
+ top: 4,
1163
+ left: 4,
1164
+ background: 'rgba(255,255,255,0.92)',
1165
+ padding: '0 4px',
1166
+ fontSize: 12
1167
+ }
1168
+ }, sheet.index));
1169
+ })))), /*#__PURE__*/_react["default"].createElement(_antd.Modal, {
1170
+ open: sheetVisible,
1171
+ title: "\u56FE\u5E45\u7ED3\u679C",
1172
+ onCancel: function onCancel() {
1173
+ return setSheetVisible(false);
1174
+ },
1175
+ onOk: handleExportPdf,
1176
+ okText: "\u6253\u5370",
1177
+ cancelText: TextEnum.cancel,
1178
+ width: map.getViewport().clientWidth - 80,
1179
+ centered: true,
1180
+ wrapClassName: "ol-mapprint-modal"
1181
+ }, /*#__PURE__*/_react["default"].createElement("div", {
1182
+ style: {
1183
+ marginBottom: 12
1184
+ }
1185
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Checkbox, {
1186
+ indeterminate: selectedSheetIds.length > 0 && selectedSheetIds.length < sheetImages.length,
1187
+ checked: sheetImages.length > 0 && selectedSheetIds.length === sheetImages.length,
1188
+ onChange: function onChange(e) {
1189
+ return setSelectedSheetIds(e.target.checked ? sheetImages.map(function (item) {
1190
+ return item.id;
1191
+ }) : []);
1192
+ }
1193
+ }, "\u5168\u9009")), /*#__PURE__*/_react["default"].createElement("div", {
1194
+ style: {
1195
+ display: 'grid',
1196
+ gridTemplateColumns: 'repeat(auto-fill, minmax(240px, 1fr))',
1197
+ gap: 16,
1198
+ maxHeight: '70vh',
1199
+ overflow: 'auto'
1200
+ }
1201
+ }, sheetImages.map(function (item) {
1202
+ return /*#__PURE__*/_react["default"].createElement("label", {
1203
+ key: item.id,
1204
+ style: {
1205
+ display: 'block',
1206
+ border: '1px solid #ddd',
1207
+ borderRadius: 6,
1208
+ padding: 12,
1209
+ background: '#fff'
1210
+ }
1211
+ }, /*#__PURE__*/_react["default"].createElement("div", {
1212
+ style: {
1213
+ marginBottom: 8,
1214
+ display: 'flex',
1215
+ alignItems: 'center',
1216
+ gap: 8
1217
+ }
1218
+ }, /*#__PURE__*/_react["default"].createElement(_antd.Checkbox, {
1219
+ checked: selectedSheetIds.includes(item.id),
1220
+ onChange: function onChange(e) {
1221
+ setSelectedSheetIds(function (current) {
1222
+ return e.target.checked ? [].concat(_toConsumableArray(current), [item.id]) : current.filter(function (id) {
1223
+ return id !== item.id;
1224
+ });
1225
+ });
1226
+ }
1227
+ }), /*#__PURE__*/_react["default"].createElement("span", null, "\u7B2C ", item.index, " \u5E45 (", item.row, "-", item.col, ")")), /*#__PURE__*/_react["default"].createElement("img", {
1228
+ src: item.url,
1229
+ alt: "sheet-".concat(item.index),
1230
+ style: {
1231
+ width: '100%',
1232
+ display: 'block',
1233
+ border: '1px solid #eee'
1234
+ }
1235
+ }));
1236
+ }))), /*#__PURE__*/_react["default"].createElement("div", {
1237
+ style: {
1238
+ position: 'absolute',
1239
+ left: '-100000px',
1240
+ top: 0,
1241
+ width: exportSize.width,
1242
+ height: exportSize.height,
1243
+ overflow: 'hidden'
1244
+ }
1245
+ }, /*#__PURE__*/_react["default"].createElement("div", {
1246
+ ref: exportStageRef,
1247
+ style: {
1248
+ width: exportSize.width,
1249
+ height: exportSize.height
1250
+ }
1251
+ }, /*#__PURE__*/_react["default"].createElement(_olMap.Map, {
1252
+ width: "".concat(exportSize.width, "px"),
1253
+ height: "".concat(exportSize.height, "px"),
1254
+ tk: "1adbb6e47668cb33757cd799548bf1f4",
1255
+ hidePopupTable: true,
1256
+ createdMap: handleExportMapCreated
1257
+ }))));
1258
+ }
1259
+ //# sourceMappingURL=index-1.js.map