@meta2d/core 1.0.21 → 1.0.22
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 +2 -1
- package/src/canvas/canvas.js +11 -5
- package/src/canvas/canvas.js.map +1 -1
- package/src/canvas/canvasImage.js +1 -1
- package/src/canvas/canvasImage.js.map +1 -1
- package/src/core.d.ts +0 -1
- package/src/core.js +87 -66
- package/src/core.js.map +1 -1
- package/src/event/event.d.ts +3 -1
- package/src/pen/model.d.ts +0 -1
- package/src/pen/model.js.map +1 -1
- package/src/pen/render.js +78 -71
- package/src/pen/render.js.map +1 -1
- package/src/store/store.d.ts +5 -3
- package/src/store/store.js +2 -2
- package/src/store/store.js.map +1 -1
package/src/pen/render.js
CHANGED
|
@@ -377,6 +377,12 @@ function ctxDrawLinearGradientPath(ctx, pen) {
|
|
|
377
377
|
}
|
|
378
378
|
function getSmoothAdjacent(smoothLenth, p1, p2) {
|
|
379
379
|
var nexLength = Math.sqrt((p2.x - p1.x) * (p2.x - p1.x) + (p2.y - p1.y) * (p2.y - p1.y));
|
|
380
|
+
if (nexLength === 0) {
|
|
381
|
+
return {
|
|
382
|
+
x: p1.x,
|
|
383
|
+
y: p1.y,
|
|
384
|
+
};
|
|
385
|
+
}
|
|
380
386
|
if (smoothLenth < nexLength) {
|
|
381
387
|
return {
|
|
382
388
|
x: p1.x + ((p2.x - p1.x) * smoothLenth) / nexLength,
|
|
@@ -948,111 +954,112 @@ export function renderPen(ctx, pen) {
|
|
|
948
954
|
inspectRect(ctx, store, pen); // 审查 rect
|
|
949
955
|
var fill;
|
|
950
956
|
// 该变量控制在 hover active 状态下的节点是否设置填充颜色
|
|
951
|
-
|
|
957
|
+
// let setBack = true;
|
|
952
958
|
var lineGradientFlag = false;
|
|
959
|
+
var _stroke = undefined;
|
|
953
960
|
if (pen.calculative.hover) {
|
|
954
|
-
|
|
961
|
+
_stroke = pen.hoverColor || store.options.hoverColor;
|
|
955
962
|
fill = pen.hoverBackground || store.options.hoverBackground;
|
|
956
|
-
ctx.fillStyle = fill;
|
|
957
|
-
fill && (setBack = false);
|
|
963
|
+
// ctx.fillStyle = fill;
|
|
964
|
+
// fill && (setBack = false);
|
|
958
965
|
}
|
|
959
966
|
else if (pen.calculative.active) {
|
|
960
|
-
|
|
967
|
+
_stroke = pen.activeColor || store.options.activeColor;
|
|
961
968
|
fill = pen.activeBackground || store.options.activeBackground;
|
|
962
|
-
ctx.fillStyle = fill;
|
|
963
|
-
fill && (setBack = false);
|
|
969
|
+
// ctx.fillStyle = fill;
|
|
970
|
+
// fill && (setBack = false);
|
|
964
971
|
}
|
|
965
972
|
else if (pen.calculative.isDock) {
|
|
966
973
|
if (pen.type === PenType.Line) {
|
|
967
|
-
|
|
974
|
+
_stroke = store.options.dockPenColor;
|
|
968
975
|
}
|
|
969
976
|
else {
|
|
970
977
|
fill = rgba(store.options.dockPenColor, 0.2);
|
|
971
|
-
ctx.fillStyle = fill;
|
|
972
|
-
fill && (setBack = false);
|
|
978
|
+
// ctx.fillStyle = fill;
|
|
979
|
+
// fill && (setBack = false);
|
|
973
980
|
}
|
|
974
981
|
}
|
|
982
|
+
// else {
|
|
983
|
+
var strokeImg = pen.calculative.strokeImg;
|
|
984
|
+
if (pen.calculative.strokeImage && strokeImg) {
|
|
985
|
+
ctx.strokeStyle = _stroke || ctx.createPattern(strokeImg, 'repeat');
|
|
986
|
+
// fill = true;
|
|
987
|
+
}
|
|
975
988
|
else {
|
|
976
|
-
var
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
if (pen.name === 'line') {
|
|
987
|
-
lineGradientFlag = true;
|
|
989
|
+
var stroke = void 0;
|
|
990
|
+
// TODO: 线只有线性渐变
|
|
991
|
+
if (pen.calculative.strokeType) {
|
|
992
|
+
if (pen.calculative.lineGradientColors) {
|
|
993
|
+
if (pen.name === 'line') {
|
|
994
|
+
lineGradientFlag = true;
|
|
995
|
+
}
|
|
996
|
+
else {
|
|
997
|
+
if (pen.calculative.lineGradient) {
|
|
998
|
+
stroke = pen.calculative.lineGradient;
|
|
988
999
|
}
|
|
989
1000
|
else {
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
}
|
|
993
|
-
else {
|
|
994
|
-
stroke = getLineGradient(ctx, pen);
|
|
995
|
-
pen.calculative.lineGradient = stroke;
|
|
996
|
-
}
|
|
1001
|
+
stroke = getLineGradient(ctx, pen);
|
|
1002
|
+
pen.calculative.lineGradient = stroke;
|
|
997
1003
|
}
|
|
998
1004
|
}
|
|
999
|
-
else {
|
|
1000
|
-
stroke = strokeLinearGradient(ctx, pen);
|
|
1001
|
-
}
|
|
1002
1005
|
}
|
|
1003
1006
|
else {
|
|
1004
|
-
stroke = pen
|
|
1007
|
+
stroke = strokeLinearGradient(ctx, pen);
|
|
1005
1008
|
}
|
|
1006
|
-
ctx.strokeStyle = stroke;
|
|
1007
|
-
}
|
|
1008
|
-
}
|
|
1009
|
-
if (setBack) {
|
|
1010
|
-
var backgroundImg = pen.calculative.backgroundImg;
|
|
1011
|
-
if (pen.calculative.backgroundImage && backgroundImg) {
|
|
1012
|
-
ctx.fillStyle = ctx.createPattern(backgroundImg, 'repeat');
|
|
1013
|
-
fill = true;
|
|
1014
1009
|
}
|
|
1015
1010
|
else {
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
|
|
1020
|
-
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
if (pen.calculative.gradientColors) {
|
|
1037
|
-
if (pen.calculative.radialGradient) {
|
|
1038
|
-
back = pen.calculative.radialGradient;
|
|
1011
|
+
stroke = pen.calculative.color || getGlobalColor(store);
|
|
1012
|
+
}
|
|
1013
|
+
ctx.strokeStyle = _stroke || stroke;
|
|
1014
|
+
}
|
|
1015
|
+
// }
|
|
1016
|
+
//if (setBack) {
|
|
1017
|
+
var backgroundImg = pen.calculative.backgroundImg;
|
|
1018
|
+
if (pen.calculative.backgroundImage && backgroundImg) {
|
|
1019
|
+
ctx.fillStyle = fill || ctx.createPattern(backgroundImg, 'repeat');
|
|
1020
|
+
fill = true;
|
|
1021
|
+
}
|
|
1022
|
+
else {
|
|
1023
|
+
var back = void 0;
|
|
1024
|
+
if (pen.calculative.bkType === Gradient.Linear) {
|
|
1025
|
+
if (pen.calculative.gradientColors) {
|
|
1026
|
+
if (pen.name !== 'line') {
|
|
1027
|
+
//连线不考虑渐进背景
|
|
1028
|
+
if (pen.calculative.gradient) {
|
|
1029
|
+
//位置变化/放大缩小操作不会触发重新计算
|
|
1030
|
+
back = pen.calculative.gradient;
|
|
1039
1031
|
}
|
|
1040
1032
|
else {
|
|
1041
|
-
back =
|
|
1042
|
-
pen.calculative.
|
|
1033
|
+
back = getBkGradient(ctx, pen);
|
|
1034
|
+
pen.calculative.gradient = back;
|
|
1043
1035
|
}
|
|
1044
1036
|
}
|
|
1037
|
+
}
|
|
1038
|
+
else {
|
|
1039
|
+
back = drawBkLinearGradient(ctx, pen);
|
|
1040
|
+
}
|
|
1041
|
+
}
|
|
1042
|
+
else if (pen.calculative.bkType === Gradient.Radial) {
|
|
1043
|
+
if (pen.calculative.gradientColors) {
|
|
1044
|
+
if (pen.calculative.radialGradient) {
|
|
1045
|
+
back = pen.calculative.radialGradient;
|
|
1046
|
+
}
|
|
1045
1047
|
else {
|
|
1046
|
-
back =
|
|
1048
|
+
back = getBkRadialGradient(ctx, pen);
|
|
1049
|
+
pen.calculative.radialGradient = back;
|
|
1047
1050
|
}
|
|
1048
1051
|
}
|
|
1049
1052
|
else {
|
|
1050
|
-
back = pen
|
|
1053
|
+
back = drawBkRadialGradient(ctx, pen);
|
|
1051
1054
|
}
|
|
1052
|
-
ctx.fillStyle = back;
|
|
1053
|
-
fill = !!back;
|
|
1054
1055
|
}
|
|
1056
|
+
else {
|
|
1057
|
+
back = pen.calculative.background || store.data.penBackground;
|
|
1058
|
+
}
|
|
1059
|
+
ctx.fillStyle = fill || back;
|
|
1060
|
+
fill = !!back;
|
|
1055
1061
|
}
|
|
1062
|
+
// }
|
|
1056
1063
|
setLineCap(ctx, pen);
|
|
1057
1064
|
setLineJoin(ctx, pen);
|
|
1058
1065
|
setGlobalAlpha(ctx, pen);
|
|
@@ -2535,7 +2542,7 @@ function inspectRect(ctx, store, pen) {
|
|
|
2535
2542
|
}
|
|
2536
2543
|
export function setGlobalAlpha(ctx, pen) {
|
|
2537
2544
|
var globalAlpha = pen.calculative.globalAlpha;
|
|
2538
|
-
if (globalAlpha < 1) {
|
|
2545
|
+
if (globalAlpha < 1 || globalAlpha !== '') {
|
|
2539
2546
|
ctx.globalAlpha = globalAlpha;
|
|
2540
2547
|
}
|
|
2541
2548
|
}
|