@meta2d/core 1.0.12 → 1.0.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.
- package/package.json +1 -1
- package/src/canvas/canvas.d.ts +1 -0
- package/src/canvas/canvas.js +109 -55
- package/src/canvas/canvas.js.map +1 -1
- package/src/core.d.ts +1 -1
- package/src/core.js +16 -1
- package/src/core.js.map +1 -1
- package/src/diagrams/gif.js +1 -0
- package/src/diagrams/gif.js.map +1 -1
- package/src/diagrams/iframe.js +1 -1
- package/src/diagrams/iframe.js.map +1 -1
- package/src/pen/model.d.ts +4 -0
- package/src/pen/model.js.map +1 -1
- package/src/pen/render.js +1 -1
- package/src/pen/render.js.map +1 -1
package/package.json
CHANGED
package/src/canvas/canvas.d.ts
CHANGED
|
@@ -198,6 +198,7 @@ export declare class Canvas {
|
|
|
198
198
|
inactive(drawing?: boolean): void;
|
|
199
199
|
active(pens: Pen[], emit?: boolean): void;
|
|
200
200
|
getSizeCPs(): void;
|
|
201
|
+
getSpecialAngle(to: Point, last: Point): void;
|
|
201
202
|
onResize: () => void;
|
|
202
203
|
onScroll: () => void;
|
|
203
204
|
calibrateMouse: (pt: Point) => Point;
|
package/src/canvas/canvas.js
CHANGED
|
@@ -930,6 +930,19 @@ var Canvas = /** @class */ (function () {
|
|
|
930
930
|
_this.hoverType = HoverType.None;
|
|
931
931
|
}
|
|
932
932
|
}
|
|
933
|
+
else if (_this.hoverType === HoverType.NodeAnchor) {
|
|
934
|
+
//钢笔模式下 可以连节点锚点
|
|
935
|
+
_this.drawingLineName = _this.store.options.drawingLineName;
|
|
936
|
+
var pt = {
|
|
937
|
+
id: s8(),
|
|
938
|
+
x: _this.store.hoverAnchor.x,
|
|
939
|
+
y: _this.store.hoverAnchor.y,
|
|
940
|
+
};
|
|
941
|
+
_this.drawingLine = _this.createDrawingLine(pt);
|
|
942
|
+
_this.drawingLine.calculative.activeAnchor = pt;
|
|
943
|
+
connectLine(_this.store.hover, _this.store.hoverAnchor, _this.drawingLine, pt);
|
|
944
|
+
// this.drawline();
|
|
945
|
+
}
|
|
933
946
|
else if (!_this.drawingLine && _this.drawingLineName !== 'curve') {
|
|
934
947
|
_this.inactive(true);
|
|
935
948
|
var pt = { id: s8(), x: e.x, y: e.y };
|
|
@@ -1232,58 +1245,8 @@ var Canvas = /** @class */ (function () {
|
|
|
1232
1245
|
_this.drawingLine.calculative.worldAnchors[_this.drawingLine.calculative.worldAnchors.length - 2].y;
|
|
1233
1246
|
}
|
|
1234
1247
|
else if (e.shiftKey && e.ctrlKey) {
|
|
1235
|
-
//快捷定位到特殊角度
|
|
1236
1248
|
var last = _this.drawingLine.calculative.worldAnchors[_this.drawingLine.calculative.worldAnchors.length - 2];
|
|
1237
|
-
|
|
1238
|
-
var angleArr = [0, 30, 45, 60, 90, 120, 150, 135, 180];
|
|
1239
|
-
//获取实际角度
|
|
1240
|
-
if (to.x - last.x !== 0) {
|
|
1241
|
-
angle =
|
|
1242
|
-
(Math.atan((last.y - to.y) / (to.x - last.x)) * 180) / Math.PI;
|
|
1243
|
-
if (to.x < last.x) {
|
|
1244
|
-
if (angle > 0) {
|
|
1245
|
-
angle -= 180;
|
|
1246
|
-
}
|
|
1247
|
-
else {
|
|
1248
|
-
angle += 180;
|
|
1249
|
-
}
|
|
1250
|
-
}
|
|
1251
|
-
}
|
|
1252
|
-
else {
|
|
1253
|
-
if (last.y > to.y) {
|
|
1254
|
-
angle = 90;
|
|
1255
|
-
}
|
|
1256
|
-
else if (last.y < to.y) {
|
|
1257
|
-
angle = -90;
|
|
1258
|
-
}
|
|
1259
|
-
}
|
|
1260
|
-
//取最近角度
|
|
1261
|
-
var _min = 999;
|
|
1262
|
-
var index = -1;
|
|
1263
|
-
for (var i = 0; i < angleArr.length; i++) {
|
|
1264
|
-
if (angle < 0) {
|
|
1265
|
-
if (Math.abs(angle + angleArr[i]) < _min) {
|
|
1266
|
-
index = i;
|
|
1267
|
-
_min = Math.abs(angle + angleArr[i]);
|
|
1268
|
-
}
|
|
1269
|
-
}
|
|
1270
|
-
else {
|
|
1271
|
-
if (Math.abs(angle - angleArr[i]) < _min) {
|
|
1272
|
-
index = i;
|
|
1273
|
-
_min = Math.abs(angle - angleArr[i]);
|
|
1274
|
-
}
|
|
1275
|
-
}
|
|
1276
|
-
}
|
|
1277
|
-
if (angle < 0) {
|
|
1278
|
-
angle = -angleArr[index];
|
|
1279
|
-
}
|
|
1280
|
-
else {
|
|
1281
|
-
angle = angleArr[index];
|
|
1282
|
-
}
|
|
1283
|
-
var length_1 = Math.sqrt((last.x - to.x) * (last.x - to.x) +
|
|
1284
|
-
(last.y - to.y) * (last.y - to.y));
|
|
1285
|
-
to.x = last.x + Math.cos((angle / 180) * Math.PI) * length_1;
|
|
1286
|
-
to.y = last.y - Math.sin((angle / 180) * Math.PI) * length_1;
|
|
1249
|
+
_this.getSpecialAngle(to, last);
|
|
1287
1250
|
}
|
|
1288
1251
|
}
|
|
1289
1252
|
_this.drawline();
|
|
@@ -3236,6 +3199,57 @@ var Canvas = /** @class */ (function () {
|
|
|
3236
3199
|
_this.sizeCPs.push(p);
|
|
3237
3200
|
});
|
|
3238
3201
|
};
|
|
3202
|
+
Canvas.prototype.getSpecialAngle = function (to, last) {
|
|
3203
|
+
//快捷定位到特殊角度
|
|
3204
|
+
var angle = 0;
|
|
3205
|
+
var angleArr = [0, 30, 45, 60, 90, 120, 150, 135, 180];
|
|
3206
|
+
//获取实际角度
|
|
3207
|
+
if (to.x - last.x !== 0) {
|
|
3208
|
+
angle = (Math.atan((last.y - to.y) / (to.x - last.x)) * 180) / Math.PI;
|
|
3209
|
+
if (to.x < last.x) {
|
|
3210
|
+
if (angle > 0) {
|
|
3211
|
+
angle -= 180;
|
|
3212
|
+
}
|
|
3213
|
+
else {
|
|
3214
|
+
angle += 180;
|
|
3215
|
+
}
|
|
3216
|
+
}
|
|
3217
|
+
}
|
|
3218
|
+
else {
|
|
3219
|
+
if (last.y > to.y) {
|
|
3220
|
+
angle = 90;
|
|
3221
|
+
}
|
|
3222
|
+
else if (last.y < to.y) {
|
|
3223
|
+
angle = -90;
|
|
3224
|
+
}
|
|
3225
|
+
}
|
|
3226
|
+
//取最近角度
|
|
3227
|
+
var _min = 999;
|
|
3228
|
+
var index = -1;
|
|
3229
|
+
for (var i = 0; i < angleArr.length; i++) {
|
|
3230
|
+
if (angle < 0) {
|
|
3231
|
+
if (Math.abs(angle + angleArr[i]) < _min) {
|
|
3232
|
+
index = i;
|
|
3233
|
+
_min = Math.abs(angle + angleArr[i]);
|
|
3234
|
+
}
|
|
3235
|
+
}
|
|
3236
|
+
else {
|
|
3237
|
+
if (Math.abs(angle - angleArr[i]) < _min) {
|
|
3238
|
+
index = i;
|
|
3239
|
+
_min = Math.abs(angle - angleArr[i]);
|
|
3240
|
+
}
|
|
3241
|
+
}
|
|
3242
|
+
}
|
|
3243
|
+
if (angle < 0) {
|
|
3244
|
+
angle = -angleArr[index];
|
|
3245
|
+
}
|
|
3246
|
+
else {
|
|
3247
|
+
angle = angleArr[index];
|
|
3248
|
+
}
|
|
3249
|
+
var length = Math.sqrt((last.x - to.x) * (last.x - to.x) + (last.y - to.y) * (last.y - to.y));
|
|
3250
|
+
to.x = last.x + Math.cos((angle / 180) * Math.PI) * length;
|
|
3251
|
+
to.y = last.y - Math.sin((angle / 180) * Math.PI) * length;
|
|
3252
|
+
};
|
|
3239
3253
|
Canvas.prototype.clearHover = function () {
|
|
3240
3254
|
this.hoverType = HoverType.None;
|
|
3241
3255
|
this.store.hover = null;
|
|
@@ -3248,7 +3262,9 @@ var Canvas = /** @class */ (function () {
|
|
|
3248
3262
|
if (!anchor || anchor.locked > LockState.DisableEdit) {
|
|
3249
3263
|
return HoverType.None;
|
|
3250
3264
|
}
|
|
3251
|
-
if (
|
|
3265
|
+
if ((!(pen.type && pen.calculative.active) &&
|
|
3266
|
+
this.store.options.disableAnchor) ||
|
|
3267
|
+
pen.disableAnchor) {
|
|
3252
3268
|
return HoverType.None;
|
|
3253
3269
|
}
|
|
3254
3270
|
if ((this.mouseDown || this.drawingLine) &&
|
|
@@ -4174,6 +4190,7 @@ var Canvas = /** @class */ (function () {
|
|
|
4174
4190
|
return;
|
|
4175
4191
|
}
|
|
4176
4192
|
scalePen(pen, s, center);
|
|
4193
|
+
pen.onScale && pen.onScale(pen);
|
|
4177
4194
|
if (pen.isRuleLine) {
|
|
4178
4195
|
// 扩大线的比例,若是放大,即不缩小,若是缩小,会放大
|
|
4179
4196
|
var lineScale = s > 1 ? 1 : 1 / s / s;
|
|
@@ -4492,8 +4509,41 @@ var Canvas = /** @class */ (function () {
|
|
|
4492
4509
|
translatePolylineAnchor(line, this.store.activeAnchor, pt);
|
|
4493
4510
|
}
|
|
4494
4511
|
else {
|
|
4495
|
-
var offsetX =
|
|
4496
|
-
var offsetY =
|
|
4512
|
+
var offsetX = 0;
|
|
4513
|
+
var offsetY = 0;
|
|
4514
|
+
if (line.lineName === 'line' &&
|
|
4515
|
+
line.calculative.worldAnchors[line.calculative.worldAnchors.length - 1] === this.store.activeAnchor) {
|
|
4516
|
+
if (keyOptions.ctrlKey && keyOptions.shiftKey) {
|
|
4517
|
+
var _pt = deepClone(pt);
|
|
4518
|
+
this.getSpecialAngle(_pt, line.calculative.worldAnchors[line.calculative.worldAnchors.length - 2]);
|
|
4519
|
+
offsetX = _pt.x - this.store.activeAnchor.x;
|
|
4520
|
+
offsetY = _pt.y - this.store.activeAnchor.y;
|
|
4521
|
+
}
|
|
4522
|
+
else if (!keyOptions.ctrlKey && keyOptions.shiftKey) {
|
|
4523
|
+
var _pt = {
|
|
4524
|
+
x: pt.x,
|
|
4525
|
+
y: line.calculative.worldAnchors[line.calculative.worldAnchors.length - 2].y,
|
|
4526
|
+
};
|
|
4527
|
+
offsetX = _pt.x - this.store.activeAnchor.x;
|
|
4528
|
+
offsetY = _pt.y - this.store.activeAnchor.y;
|
|
4529
|
+
}
|
|
4530
|
+
else if (keyOptions.ctrlKey && !keyOptions.shiftKey) {
|
|
4531
|
+
var _pt = {
|
|
4532
|
+
x: line.calculative.worldAnchors[line.calculative.worldAnchors.length - 2].x,
|
|
4533
|
+
y: pt.y,
|
|
4534
|
+
};
|
|
4535
|
+
offsetX = _pt.x - this.store.activeAnchor.x;
|
|
4536
|
+
offsetY = _pt.y - this.store.activeAnchor.y;
|
|
4537
|
+
}
|
|
4538
|
+
else {
|
|
4539
|
+
offsetX = pt.x - this.store.activeAnchor.x;
|
|
4540
|
+
offsetY = pt.y - this.store.activeAnchor.y;
|
|
4541
|
+
}
|
|
4542
|
+
}
|
|
4543
|
+
else {
|
|
4544
|
+
offsetX = pt.x - this.store.activeAnchor.x;
|
|
4545
|
+
offsetY = pt.y - this.store.activeAnchor.y;
|
|
4546
|
+
}
|
|
4497
4547
|
translatePoint(this.store.activeAnchor, offsetX, offsetY);
|
|
4498
4548
|
if (this.store.hover &&
|
|
4499
4549
|
this.store.hoverAnchor &&
|
|
@@ -4819,7 +4869,7 @@ var Canvas = /** @class */ (function () {
|
|
|
4819
4869
|
k !== 'height' &&
|
|
4820
4870
|
k !== 'initRect' &&
|
|
4821
4871
|
(typeof pen[k] !== 'object' || k === 'lineDash')) {
|
|
4822
|
-
if (k === 'fontSize') {
|
|
4872
|
+
if (k === 'fontSize' || k === 'lineWidth') {
|
|
4823
4873
|
pen[k] =
|
|
4824
4874
|
pen.calculative[k] / pen.calculative.canvas.store.data.scale;
|
|
4825
4875
|
}
|
|
@@ -5843,6 +5893,10 @@ var Canvas = /** @class */ (function () {
|
|
|
5843
5893
|
pen.calculative.gradient = undefined;
|
|
5844
5894
|
pen.calculative.radialGradient = undefined;
|
|
5845
5895
|
}
|
|
5896
|
+
if (data.gradientRadius) {
|
|
5897
|
+
pen.calculative.gradient = undefined;
|
|
5898
|
+
pen.calculative.radialGradient = undefined;
|
|
5899
|
+
}
|
|
5846
5900
|
if (data.animateLineWidth) {
|
|
5847
5901
|
pen.calculative.gradientAnimatePath = undefined;
|
|
5848
5902
|
}
|