@thienvu18/designable-shared 2.0.1 → 2.0.2
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.
- package/esm/animation.d.ts +8 -2
- package/esm/animation.js +29 -30
- package/esm/array.d.ts +163 -37
- package/esm/array.js +104 -87
- package/esm/clone.d.ts +4 -4
- package/esm/clone.js +79 -86
- package/esm/compose.d.ts +3 -1
- package/esm/compose.js +6 -6
- package/esm/coordinate.d.ts +120 -76
- package/esm/coordinate.js +480 -411
- package/esm/element.d.ts +11 -6
- package/esm/element.js +123 -125
- package/esm/event.d.ts +162 -75
- package/esm/event.js +197 -197
- package/esm/globalThisPolyfill.d.ts +1 -1
- package/esm/globalThisPolyfill.js +14 -17
- package/esm/index.d.ts +17 -17
- package/esm/index.js +17 -17
- package/esm/instanceof.d.ts +1 -1
- package/esm/instanceof.js +9 -10
- package/esm/keycode.d.ts +145 -145
- package/esm/keycode.js +149 -149
- package/esm/lru.d.ts +50 -47
- package/esm/lru.js +236 -245
- package/esm/observer.d.ts +7 -7
- package/esm/observer.js +37 -40
- package/esm/request-idle.d.ts +9 -6
- package/esm/request-idle.js +6 -6
- package/esm/scroller.d.ts +24 -8
- package/esm/scroller.js +78 -75
- package/esm/subscribable.d.ts +10 -10
- package/esm/subscribable.js +39 -40
- package/esm/types.d.ts +13 -13
- package/esm/types.js +19 -20
- package/esm/uid.d.ts +1 -1
- package/esm/uid.js +7 -7
- package/lib/animation.d.ts +8 -2
- package/lib/animation.js +34 -35
- package/lib/array.d.ts +163 -37
- package/lib/array.js +129 -101
- package/lib/clone.d.ts +4 -4
- package/lib/clone.js +84 -91
- package/lib/compose.d.ts +3 -1
- package/lib/compose.js +10 -10
- package/lib/coordinate.d.ts +120 -76
- package/lib/coordinate.js +538 -440
- package/lib/element.d.ts +11 -6
- package/lib/element.js +139 -133
- package/lib/event.d.ts +162 -75
- package/lib/event.js +206 -202
- package/lib/globalThisPolyfill.d.ts +1 -1
- package/lib/globalThisPolyfill.js +17 -20
- package/lib/index.d.ts +17 -17
- package/lib/index.js +49 -33
- package/lib/instanceof.d.ts +1 -1
- package/lib/instanceof.js +13 -14
- package/lib/keycode.d.ts +145 -145
- package/lib/keycode.js +153 -153
- package/lib/lru.d.ts +50 -47
- package/lib/lru.js +240 -249
- package/lib/observer.d.ts +7 -7
- package/lib/observer.js +41 -44
- package/lib/request-idle.d.ts +9 -6
- package/lib/request-idle.js +14 -11
- package/lib/scroller.d.ts +24 -8
- package/lib/scroller.js +89 -81
- package/lib/subscribable.d.ts +10 -10
- package/lib/subscribable.js +43 -44
- package/lib/types.d.ts +13 -13
- package/lib/types.js +40 -28
- package/lib/uid.d.ts +1 -1
- package/lib/uid.js +11 -11
- package/package.json +1 -1
package/esm/coordinate.js
CHANGED
|
@@ -1,103 +1,114 @@
|
|
|
1
|
-
import { isValidNumber } from './types'
|
|
1
|
+
import { isValidNumber } from './types'
|
|
2
2
|
export function isRect(rect) {
|
|
3
|
-
|
|
3
|
+
return rect?.x && rect?.y && rect?.width && rect?.height
|
|
4
4
|
}
|
|
5
5
|
export function isPoint(val) {
|
|
6
|
-
|
|
6
|
+
return isValidNumber(val?.x) && isValidNumber(val?.y)
|
|
7
7
|
}
|
|
8
8
|
export function isLineSegment(val) {
|
|
9
|
-
|
|
9
|
+
return isPoint(val?.start) && isPoint(val?.end)
|
|
10
10
|
}
|
|
11
11
|
export class Point {
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
constructor(x, y) {
|
|
13
|
+
this.x = x
|
|
14
|
+
this.y = y
|
|
15
|
+
}
|
|
16
16
|
}
|
|
17
17
|
export class Rect {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
18
|
+
constructor(x, y, width, height) {
|
|
19
|
+
this.x = 0
|
|
20
|
+
this.y = 0
|
|
21
|
+
this.width = 0
|
|
22
|
+
this.height = 0
|
|
23
|
+
this.x = x
|
|
24
|
+
this.y = y
|
|
25
|
+
this.width = width
|
|
26
|
+
this.height = height
|
|
27
|
+
}
|
|
28
|
+
get left() {
|
|
29
|
+
return this.x
|
|
30
|
+
}
|
|
31
|
+
get right() {
|
|
32
|
+
return this.x + this.width
|
|
33
|
+
}
|
|
34
|
+
get top() {
|
|
35
|
+
return this.y
|
|
36
|
+
}
|
|
37
|
+
get bottom() {
|
|
38
|
+
return this.y + this.height
|
|
39
|
+
}
|
|
40
40
|
}
|
|
41
41
|
export class LineSegment {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
42
|
+
constructor(start, end) {
|
|
43
|
+
this.start = { ...start }
|
|
44
|
+
this.end = { ...end }
|
|
45
|
+
}
|
|
46
46
|
}
|
|
47
|
-
export var RectQuadrant
|
|
48
|
-
(function (RectQuadrant) {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
})(RectQuadrant || (RectQuadrant = {}))
|
|
47
|
+
export var RectQuadrant
|
|
48
|
+
;(function (RectQuadrant) {
|
|
49
|
+
RectQuadrant['Inner1'] = 'I1'
|
|
50
|
+
RectQuadrant['Inner2'] = 'I2'
|
|
51
|
+
RectQuadrant['Inner3'] = 'I3'
|
|
52
|
+
RectQuadrant['Inner4'] = 'I4'
|
|
53
|
+
RectQuadrant['Outer1'] = 'O1'
|
|
54
|
+
RectQuadrant['Outer2'] = 'O2'
|
|
55
|
+
RectQuadrant['Outer3'] = 'O3'
|
|
56
|
+
RectQuadrant['Outer4'] = 'O4'
|
|
57
|
+
})(RectQuadrant || (RectQuadrant = {}))
|
|
58
58
|
export function isPointInRect(point, rect, sensitive = true) {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
point.y <= rect.y + rect.height - boundSensor(rect.height));
|
|
59
|
+
const boundSensor = (value) => {
|
|
60
|
+
if (!sensitive) return 0
|
|
61
|
+
const sensor = value * 0.1
|
|
62
|
+
if (sensor > 20) return 20
|
|
63
|
+
if (sensor < 10) return 10
|
|
64
|
+
return sensor
|
|
65
|
+
}
|
|
66
|
+
return (
|
|
67
|
+
point.x >= rect.x + boundSensor(rect.width) &&
|
|
68
|
+
point.x <= rect.x + rect.width - boundSensor(rect.width) &&
|
|
69
|
+
point.y >= rect.y + boundSensor(rect.height) &&
|
|
70
|
+
point.y <= rect.y + rect.height - boundSensor(rect.height)
|
|
71
|
+
)
|
|
73
72
|
}
|
|
74
73
|
export function isEqualRect(target, source) {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
74
|
+
return (
|
|
75
|
+
target?.x === source?.x &&
|
|
76
|
+
target.y === source.y &&
|
|
77
|
+
target.width === source.width &&
|
|
78
|
+
target.height === source.height
|
|
79
|
+
)
|
|
79
80
|
}
|
|
80
81
|
export function getRectPoints(source) {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
82
|
+
const p1 = new Point(source.x, source.y)
|
|
83
|
+
const p2 = new Point(source.x + source.width, source.y)
|
|
84
|
+
const p3 = new Point(source.x + source.width, source.y + source.height)
|
|
85
|
+
const p4 = new Point(source.x, source.y + source.height)
|
|
86
|
+
return [p1, p2, p3, p4]
|
|
86
87
|
}
|
|
87
88
|
export function isRectInRect(target, source) {
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
89
|
+
const [p1, p2, p3, p4] = getRectPoints(target)
|
|
90
|
+
return (
|
|
91
|
+
isPointInRect(p1, source, false) &&
|
|
92
|
+
isPointInRect(p2, source, false) &&
|
|
93
|
+
isPointInRect(p3, source, false) &&
|
|
94
|
+
isPointInRect(p4, source, false)
|
|
95
|
+
)
|
|
93
96
|
}
|
|
94
97
|
export function isCrossRectInRect(target, source) {
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
98
|
+
const targetCenterPoint = new Point(
|
|
99
|
+
target.x + target.width / 2,
|
|
100
|
+
target.y + target.height / 2
|
|
101
|
+
)
|
|
102
|
+
const sourceCenterPoint = new Point(
|
|
103
|
+
source.x + source.width / 2,
|
|
104
|
+
source.y + source.height / 2
|
|
105
|
+
)
|
|
106
|
+
return (
|
|
107
|
+
Math.abs(targetCenterPoint.x - sourceCenterPoint.x) <=
|
|
108
|
+
target.width / 2 + source.width / 2 &&
|
|
109
|
+
Math.abs(targetCenterPoint.y - sourceCenterPoint.y) <=
|
|
110
|
+
target.height / 2 + source.height / 2
|
|
111
|
+
)
|
|
101
112
|
}
|
|
102
113
|
/**
|
|
103
114
|
* 计算点在矩形的哪个象限
|
|
@@ -105,69 +116,70 @@ export function isCrossRectInRect(target, source) {
|
|
|
105
116
|
* @param rect
|
|
106
117
|
*/
|
|
107
118
|
export function calcQuadrantOfPointToRect(point, rect) {
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
return RectQuadrant.Inner3;
|
|
139
|
-
}
|
|
140
|
-
else {
|
|
141
|
-
return RectQuadrant.Outer3;
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
}
|
|
119
|
+
const isInner = isPointInRect(point, rect)
|
|
120
|
+
if (point.x <= rect.x + rect.width / 2) {
|
|
121
|
+
if (point.y <= rect.y + rect.height / 2) {
|
|
122
|
+
if (isInner) {
|
|
123
|
+
return RectQuadrant.Inner1
|
|
124
|
+
} else {
|
|
125
|
+
return RectQuadrant.Outer1
|
|
126
|
+
}
|
|
127
|
+
} else {
|
|
128
|
+
if (isInner) {
|
|
129
|
+
return RectQuadrant.Inner4
|
|
130
|
+
} else {
|
|
131
|
+
return RectQuadrant.Outer4
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
} else {
|
|
135
|
+
if (point.y <= rect.y + rect.height / 2) {
|
|
136
|
+
if (isInner) {
|
|
137
|
+
return RectQuadrant.Inner2
|
|
138
|
+
} else {
|
|
139
|
+
return RectQuadrant.Outer2
|
|
140
|
+
}
|
|
141
|
+
} else {
|
|
142
|
+
if (isInner) {
|
|
143
|
+
return RectQuadrant.Inner3
|
|
144
|
+
} else {
|
|
145
|
+
return RectQuadrant.Outer3
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
}
|
|
145
149
|
}
|
|
146
150
|
export function calcDistanceOfPointToRect(point, rect) {
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
151
|
+
let minX = Math.min(
|
|
152
|
+
Math.abs(point.x - rect.x),
|
|
153
|
+
Math.abs(point.x - (rect.x + rect.width))
|
|
154
|
+
)
|
|
155
|
+
let minY = Math.min(
|
|
156
|
+
Math.abs(point.y - rect.y),
|
|
157
|
+
Math.abs(point.y - (rect.y + rect.height))
|
|
158
|
+
)
|
|
159
|
+
if (point.x >= rect.x && point.x <= rect.x + rect.width) {
|
|
160
|
+
minX = 0
|
|
161
|
+
}
|
|
162
|
+
if (point.y >= rect.y && point.y <= rect.y + rect.height) {
|
|
163
|
+
minY = 0
|
|
164
|
+
}
|
|
165
|
+
return Math.sqrt(minX ** 2 + minY ** 2)
|
|
156
166
|
}
|
|
157
167
|
export function calcDistancePointToEdge(point, rect) {
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
168
|
+
const distanceTop = Math.abs(point.y - rect.y)
|
|
169
|
+
const distanceBottom = Math.abs(point.y - (rect.y + rect.height))
|
|
170
|
+
const distanceLeft = Math.abs(point.x - rect.x)
|
|
171
|
+
const distanceRight = Math.abs(point.x - (rect.x + rect.width))
|
|
172
|
+
return Math.min(distanceTop, distanceBottom, distanceLeft, distanceRight)
|
|
163
173
|
}
|
|
164
174
|
export function isNearAfter(point, rect, inline = false) {
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
175
|
+
if (inline) {
|
|
176
|
+
return (
|
|
177
|
+
Math.abs(point.x - rect.x) + Math.abs(point.y - rect.y) >
|
|
178
|
+
Math.abs(point.x - (rect.x + rect.width)) +
|
|
179
|
+
Math.abs(point.y - (rect.y + rect.height))
|
|
180
|
+
)
|
|
181
|
+
}
|
|
182
|
+
return Math.abs(point.y - rect.y) > Math.abs(point.y - (rect.y + rect.height))
|
|
171
183
|
}
|
|
172
184
|
/**
|
|
173
185
|
* 计算点鱼矩形的相对位置信息
|
|
@@ -175,299 +187,356 @@ export function isNearAfter(point, rect, inline = false) {
|
|
|
175
187
|
* @param rect
|
|
176
188
|
*/
|
|
177
189
|
export function calcRelativeOfPointToRect(point, rect) {
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
190
|
+
const distance = calcDistanceOfPointToRect(point, rect)
|
|
191
|
+
const quadrant = calcQuadrantOfPointToRect(point, rect)
|
|
192
|
+
return {
|
|
193
|
+
quadrant,
|
|
194
|
+
distance,
|
|
195
|
+
}
|
|
184
196
|
}
|
|
185
197
|
export function calcBoundingRect(rects) {
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
});
|
|
209
|
-
return new Rect(minLeft, minTop, maxRight - minLeft, maxBottom - minTop);
|
|
198
|
+
if (!rects?.length) return
|
|
199
|
+
if (rects?.length === 1 && !rects[0]) return
|
|
200
|
+
let minTop = Infinity
|
|
201
|
+
let maxBottom = -Infinity
|
|
202
|
+
let minLeft = Infinity
|
|
203
|
+
let maxRight = -Infinity
|
|
204
|
+
rects.forEach((item) => {
|
|
205
|
+
const rect = new Rect(item.x, item.y, item.width, item.height)
|
|
206
|
+
if (rect.top <= minTop) {
|
|
207
|
+
minTop = rect.top
|
|
208
|
+
}
|
|
209
|
+
if (rect.bottom >= maxBottom) {
|
|
210
|
+
maxBottom = rect.bottom
|
|
211
|
+
}
|
|
212
|
+
if (rect.left <= minLeft) {
|
|
213
|
+
minLeft = rect.left
|
|
214
|
+
}
|
|
215
|
+
if (rect.right >= maxRight) {
|
|
216
|
+
maxRight = rect.right
|
|
217
|
+
}
|
|
218
|
+
})
|
|
219
|
+
return new Rect(minLeft, minTop, maxRight - minLeft, maxBottom - minTop)
|
|
210
220
|
}
|
|
211
|
-
export function calcRectByStartEndPoint(
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
221
|
+
export function calcRectByStartEndPoint(
|
|
222
|
+
startPoint,
|
|
223
|
+
endPoint,
|
|
224
|
+
scrollX = 0,
|
|
225
|
+
scrollY = 0
|
|
226
|
+
) {
|
|
227
|
+
let drawStartX = 0,
|
|
228
|
+
drawStartY = 0
|
|
229
|
+
if (
|
|
230
|
+
endPoint.x + scrollX >= startPoint.x &&
|
|
231
|
+
endPoint.y + scrollY >= startPoint.y
|
|
232
|
+
) {
|
|
233
|
+
//4象限
|
|
234
|
+
drawStartX = startPoint.x
|
|
235
|
+
drawStartY = startPoint.y
|
|
236
|
+
return new Rect(
|
|
237
|
+
drawStartX - scrollX,
|
|
238
|
+
drawStartY - scrollY,
|
|
239
|
+
Math.abs(endPoint.x - startPoint.x + scrollX),
|
|
240
|
+
Math.abs(endPoint.y - startPoint.y + scrollY)
|
|
241
|
+
)
|
|
242
|
+
} else if (
|
|
243
|
+
endPoint.x + scrollX < startPoint.x &&
|
|
244
|
+
endPoint.y + scrollY < startPoint.y
|
|
245
|
+
) {
|
|
246
|
+
//1象限
|
|
247
|
+
drawStartX = endPoint.x
|
|
248
|
+
drawStartY = endPoint.y
|
|
249
|
+
return new Rect(
|
|
250
|
+
drawStartX,
|
|
251
|
+
drawStartY,
|
|
252
|
+
Math.abs(endPoint.x - startPoint.x + scrollX),
|
|
253
|
+
Math.abs(endPoint.y - startPoint.y + scrollY)
|
|
254
|
+
)
|
|
255
|
+
} else if (
|
|
256
|
+
endPoint.x + scrollX < startPoint.x &&
|
|
257
|
+
endPoint.y + scrollY >= startPoint.y
|
|
258
|
+
) {
|
|
259
|
+
//3象限
|
|
260
|
+
drawStartX = endPoint.x
|
|
261
|
+
drawStartY = startPoint.y
|
|
262
|
+
return new Rect(
|
|
263
|
+
drawStartX - scrollX,
|
|
264
|
+
drawStartY - scrollY,
|
|
265
|
+
Math.abs(endPoint.x - startPoint.x + scrollX),
|
|
266
|
+
Math.abs(endPoint.y - startPoint.y + scrollY)
|
|
267
|
+
)
|
|
268
|
+
} else {
|
|
269
|
+
//2象限
|
|
270
|
+
drawStartX = startPoint.x
|
|
271
|
+
drawStartY = endPoint.y
|
|
272
|
+
return new Rect(
|
|
273
|
+
drawStartX,
|
|
274
|
+
drawStartY,
|
|
275
|
+
Math.abs(endPoint.x - startPoint.x + scrollX),
|
|
276
|
+
Math.abs(endPoint.y - startPoint.y + scrollY)
|
|
277
|
+
)
|
|
278
|
+
}
|
|
240
279
|
}
|
|
241
280
|
export function calcEdgeLinesOfRect(rect) {
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
281
|
+
return {
|
|
282
|
+
v: [
|
|
283
|
+
new LineSegment(
|
|
284
|
+
new Point(rect.x, rect.y),
|
|
285
|
+
new Point(rect.x, rect.y + rect.height)
|
|
286
|
+
),
|
|
287
|
+
new LineSegment(
|
|
288
|
+
new Point(rect.x + rect.width / 2, rect.y),
|
|
289
|
+
new Point(rect.x + rect.width / 2, rect.y + rect.height)
|
|
290
|
+
),
|
|
291
|
+
new LineSegment(
|
|
292
|
+
new Point(rect.x + rect.width, rect.y),
|
|
293
|
+
new Point(rect.x + rect.width, rect.y + rect.height)
|
|
294
|
+
),
|
|
295
|
+
],
|
|
296
|
+
h: [
|
|
297
|
+
new LineSegment(
|
|
298
|
+
new Point(rect.x, rect.y),
|
|
299
|
+
new Point(rect.x + rect.width, rect.y)
|
|
300
|
+
),
|
|
301
|
+
new LineSegment(
|
|
302
|
+
new Point(rect.x, rect.y + rect.height / 2),
|
|
303
|
+
new Point(rect.x + rect.width, rect.y + rect.height / 2)
|
|
304
|
+
),
|
|
305
|
+
new LineSegment(
|
|
306
|
+
new Point(rect.x, rect.y + rect.height),
|
|
307
|
+
new Point(rect.x + rect.width, rect.y + rect.height)
|
|
308
|
+
),
|
|
309
|
+
],
|
|
310
|
+
}
|
|
254
311
|
}
|
|
255
312
|
export function calcRectOfAxisLineSegment(line) {
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
313
|
+
if (!isLineSegment(line)) return
|
|
314
|
+
const isXAxis = line.start.x === line.end.x
|
|
315
|
+
return new Rect(
|
|
316
|
+
line.start.x,
|
|
317
|
+
line.start.y,
|
|
318
|
+
isXAxis ? 0 : line.end.x - line.start.x,
|
|
319
|
+
isXAxis ? line.end.y - line.start.y : 0
|
|
320
|
+
)
|
|
260
321
|
}
|
|
261
322
|
export function calcSpaceBlockOfRect(target, source, type) {
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
const bottom = Math.max(sourceRect.bottom, targetRect.bottom);
|
|
312
|
-
if (type && type !== 'right')
|
|
313
|
-
return;
|
|
314
|
-
return {
|
|
315
|
-
type: 'right',
|
|
316
|
-
distance,
|
|
317
|
-
rect: new Rect(targetRect.right, top, distance, bottom - top),
|
|
318
|
-
};
|
|
323
|
+
const targetRect = new Rect(target.x, target.y, target.width, target.height)
|
|
324
|
+
const sourceRect = new Rect(source.x, source.y, source.width, source.height)
|
|
325
|
+
if (sourceRect.bottom < targetRect.top && sourceRect.left > targetRect.right)
|
|
326
|
+
return
|
|
327
|
+
if (sourceRect.top > targetRect.bottom && sourceRect.left > targetRect.right)
|
|
328
|
+
return
|
|
329
|
+
if (sourceRect.bottom < targetRect.top && sourceRect.right < targetRect.left)
|
|
330
|
+
return
|
|
331
|
+
if (sourceRect.top > targetRect.bottom && sourceRect.right < targetRect.left)
|
|
332
|
+
return
|
|
333
|
+
if (sourceRect.bottom < targetRect.top) {
|
|
334
|
+
const distance = targetRect.top - sourceRect.bottom
|
|
335
|
+
const left = Math.min(sourceRect.left, targetRect.left)
|
|
336
|
+
const right = Math.max(sourceRect.right, targetRect.right)
|
|
337
|
+
if (type && type !== 'top') return
|
|
338
|
+
return {
|
|
339
|
+
type: 'top',
|
|
340
|
+
distance,
|
|
341
|
+
rect: new Rect(left, sourceRect.bottom, right - left, distance),
|
|
342
|
+
}
|
|
343
|
+
} else if (sourceRect.top > targetRect.bottom) {
|
|
344
|
+
const distance = sourceRect.top - targetRect.bottom
|
|
345
|
+
const left = Math.min(sourceRect.left, targetRect.left)
|
|
346
|
+
const right = Math.max(sourceRect.right, targetRect.right)
|
|
347
|
+
if (type && type !== 'bottom') return
|
|
348
|
+
return {
|
|
349
|
+
type: 'bottom',
|
|
350
|
+
distance,
|
|
351
|
+
rect: new Rect(left, targetRect.bottom, right - left, distance),
|
|
352
|
+
}
|
|
353
|
+
} else if (sourceRect.right < targetRect.left) {
|
|
354
|
+
const distance = targetRect.left - sourceRect.right
|
|
355
|
+
const top = Math.min(sourceRect.top, targetRect.top)
|
|
356
|
+
const bottom = Math.max(sourceRect.bottom, targetRect.bottom)
|
|
357
|
+
if (type && type !== 'left') return
|
|
358
|
+
return {
|
|
359
|
+
type: 'left',
|
|
360
|
+
distance,
|
|
361
|
+
rect: new Rect(sourceRect.right, top, distance, bottom - top),
|
|
362
|
+
}
|
|
363
|
+
} else if (sourceRect.left > targetRect.right) {
|
|
364
|
+
const distance = sourceRect.left - targetRect.right
|
|
365
|
+
const top = Math.min(sourceRect.top, targetRect.top)
|
|
366
|
+
const bottom = Math.max(sourceRect.bottom, targetRect.bottom)
|
|
367
|
+
if (type && type !== 'right') return
|
|
368
|
+
return {
|
|
369
|
+
type: 'right',
|
|
370
|
+
distance,
|
|
371
|
+
rect: new Rect(targetRect.right, top, distance, bottom - top),
|
|
319
372
|
}
|
|
373
|
+
}
|
|
320
374
|
}
|
|
321
375
|
export function calcExtendsLineSegmentOfRect(targetRect, referRect) {
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
}
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
376
|
+
if (
|
|
377
|
+
referRect.right < targetRect.right &&
|
|
378
|
+
targetRect.left <= referRect.right
|
|
379
|
+
) {
|
|
380
|
+
//右侧
|
|
381
|
+
if (referRect.bottom < targetRect.top) {
|
|
382
|
+
//上方
|
|
383
|
+
return {
|
|
384
|
+
start: { x: referRect.right, y: referRect.bottom },
|
|
385
|
+
end: { x: targetRect.right, y: referRect.bottom },
|
|
386
|
+
}
|
|
387
|
+
} else if (referRect.top > targetRect.bottom) {
|
|
388
|
+
//下方
|
|
389
|
+
return {
|
|
390
|
+
start: { x: referRect.right, y: referRect.top },
|
|
391
|
+
end: { x: targetRect.right, y: referRect.top },
|
|
392
|
+
}
|
|
393
|
+
}
|
|
394
|
+
} else if (
|
|
395
|
+
referRect.left > targetRect.left &&
|
|
396
|
+
targetRect.right >= referRect.left
|
|
397
|
+
) {
|
|
398
|
+
//左侧
|
|
399
|
+
if (referRect.bottom < targetRect.top) {
|
|
400
|
+
//上方
|
|
401
|
+
return {
|
|
402
|
+
start: { x: targetRect.left, y: referRect.bottom },
|
|
403
|
+
end: { x: referRect.left, y: referRect.bottom },
|
|
404
|
+
}
|
|
405
|
+
} else if (referRect.top > targetRect.bottom) {
|
|
406
|
+
//下方
|
|
407
|
+
return {
|
|
408
|
+
start: { x: targetRect.left, y: referRect.top },
|
|
409
|
+
end: { x: referRect.left, y: referRect.top },
|
|
410
|
+
}
|
|
411
|
+
}
|
|
412
|
+
}
|
|
413
|
+
if (referRect.top < targetRect.top && targetRect.bottom >= referRect.top) {
|
|
414
|
+
//refer在上方
|
|
415
|
+
if (referRect.right < targetRect.left) {
|
|
416
|
+
//右侧
|
|
417
|
+
return {
|
|
418
|
+
start: { x: referRect.right, y: referRect.bottom },
|
|
419
|
+
end: { x: referRect.right, y: targetRect.bottom },
|
|
420
|
+
}
|
|
421
|
+
} else if (referRect.left > targetRect.right) {
|
|
422
|
+
//左侧
|
|
423
|
+
return {
|
|
424
|
+
start: { x: referRect.left, y: referRect.bottom },
|
|
425
|
+
end: { x: referRect.left, y: targetRect.bottom },
|
|
426
|
+
}
|
|
427
|
+
}
|
|
428
|
+
} else if (
|
|
429
|
+
referRect.bottom > targetRect.bottom &&
|
|
430
|
+
referRect.top <= targetRect.bottom
|
|
431
|
+
) {
|
|
432
|
+
//refer下方
|
|
433
|
+
if (referRect.right < targetRect.left) {
|
|
434
|
+
//右侧
|
|
435
|
+
return {
|
|
436
|
+
start: { x: referRect.right, y: targetRect.top },
|
|
437
|
+
end: { x: referRect.right, y: referRect.top },
|
|
438
|
+
}
|
|
439
|
+
} else if (referRect.left > targetRect.right) {
|
|
440
|
+
//左侧
|
|
441
|
+
return {
|
|
442
|
+
start: { x: referRect.left, y: targetRect.top },
|
|
443
|
+
end: { x: referRect.left, y: referRect.top },
|
|
444
|
+
}
|
|
445
|
+
}
|
|
446
|
+
}
|
|
393
447
|
}
|
|
394
448
|
export function calcOffsetOfSnapLineSegmentToEdge(line, current) {
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
449
|
+
const edges = calcEdgeLinesOfRect(current)
|
|
450
|
+
const isVerticalLine = line.start.x === line.end.x
|
|
451
|
+
if (isVerticalLine) {
|
|
452
|
+
return { x: calcMinDistanceValue(edges.x, line.start.x) - current.x, y: 0 }
|
|
453
|
+
}
|
|
454
|
+
function calcEdgeLinesOfRect(rect) {
|
|
455
|
+
return {
|
|
456
|
+
x: [rect.x, rect.x + rect.width / 2, rect.x + rect.width],
|
|
457
|
+
y: [rect.y, rect.y + rect.height / 2, rect.y + rect.height],
|
|
458
|
+
}
|
|
459
|
+
}
|
|
460
|
+
function calcMinDistanceValue(edges, targetValue) {
|
|
461
|
+
let minDistance = Infinity,
|
|
462
|
+
minDistanceIndex = -1
|
|
463
|
+
for (let i = 0; i < edges.length; i++) {
|
|
464
|
+
const distance = Math.abs(edges[i] - targetValue)
|
|
465
|
+
if (minDistance > distance) {
|
|
466
|
+
minDistance = distance
|
|
467
|
+
minDistanceIndex = i
|
|
468
|
+
}
|
|
469
|
+
}
|
|
470
|
+
return edges[minDistanceIndex]
|
|
471
|
+
}
|
|
472
|
+
return { x: 0, y: calcMinDistanceValue(edges.y, line.start.y) - current.y }
|
|
418
473
|
}
|
|
419
474
|
export function calcDistanceOfSnapLineToEdges(line, edges) {
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
}
|
|
440
|
-
return distance;
|
|
475
|
+
let distance = Infinity
|
|
476
|
+
if (line?.start?.y === line?.end?.y) {
|
|
477
|
+
edges.h.forEach((target) => {
|
|
478
|
+
const _distance = Math.abs(target.start.y - line.start.y)
|
|
479
|
+
if (_distance < distance) {
|
|
480
|
+
distance = _distance
|
|
481
|
+
}
|
|
482
|
+
})
|
|
483
|
+
} else if (line?.start?.x === line?.end?.x) {
|
|
484
|
+
edges.v.forEach((target) => {
|
|
485
|
+
const _distance = Math.abs(target.start.x - line.start.x)
|
|
486
|
+
if (_distance < distance) {
|
|
487
|
+
distance = _distance
|
|
488
|
+
}
|
|
489
|
+
})
|
|
490
|
+
} else {
|
|
491
|
+
throw new Error('can not calculate slash distance')
|
|
492
|
+
}
|
|
493
|
+
return distance
|
|
441
494
|
}
|
|
442
495
|
export function calcCombineSnapLineSegment(target, source) {
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
496
|
+
if (target.start.x === target.end.x) {
|
|
497
|
+
return new LineSegment(
|
|
498
|
+
new Point(
|
|
499
|
+
target.start.x,
|
|
500
|
+
target.start.y > source.start.y ? source.start.y : target.start.y
|
|
501
|
+
),
|
|
502
|
+
new Point(
|
|
503
|
+
target.start.x,
|
|
504
|
+
target.end.y > source.end.y ? target.end.y : source.end.y
|
|
505
|
+
)
|
|
506
|
+
)
|
|
507
|
+
}
|
|
508
|
+
return new LineSegment(
|
|
509
|
+
new Point(
|
|
510
|
+
target.start.x > source.start.x ? source.start.x : target.start.x,
|
|
511
|
+
target.start.y
|
|
512
|
+
),
|
|
513
|
+
new Point(
|
|
514
|
+
target.end.x > source.end.x ? target.end.x : source.end.x,
|
|
515
|
+
target.end.y
|
|
516
|
+
)
|
|
517
|
+
)
|
|
447
518
|
}
|
|
448
519
|
export function calcClosestEdges(line, edges) {
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
}
|
|
472
|
-
return [distance, result];
|
|
520
|
+
let result
|
|
521
|
+
let distance = Infinity
|
|
522
|
+
if (line?.start?.y === line?.end?.y) {
|
|
523
|
+
edges.h.forEach((target) => {
|
|
524
|
+
const _distance = Math.abs(target.start.y - line.start.y)
|
|
525
|
+
if (_distance < distance) {
|
|
526
|
+
distance = _distance
|
|
527
|
+
result = target
|
|
528
|
+
}
|
|
529
|
+
})
|
|
530
|
+
} else if (line?.start?.x === line?.end?.x) {
|
|
531
|
+
edges.v.forEach((target) => {
|
|
532
|
+
const _distance = Math.abs(target.start.x - line.start.x)
|
|
533
|
+
if (_distance < distance) {
|
|
534
|
+
distance = _distance
|
|
535
|
+
result = target
|
|
536
|
+
}
|
|
537
|
+
})
|
|
538
|
+
} else {
|
|
539
|
+
throw new Error('can not calculate slash distance')
|
|
540
|
+
}
|
|
541
|
+
return [distance, result]
|
|
473
542
|
}
|