@idraw/renderer 0.4.0-beta.29 → 0.4.0-beta.30
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/dist/esm/draw/box.d.ts +1 -1
- package/dist/esm/draw/text.js +126 -120
- package/dist/index.global.js +124 -118
- package/dist/index.global.min.js +1 -1
- package/package.json +3 -3
package/dist/esm/draw/box.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ export declare function drawBox(ctx: ViewContext2D, viewElem: Element, opts: {
|
|
|
4
4
|
originElem: Element;
|
|
5
5
|
calcElemSize: ElementSize;
|
|
6
6
|
pattern?: string | CanvasPattern | null;
|
|
7
|
-
renderContent
|
|
7
|
+
renderContent?: () => void;
|
|
8
8
|
viewScaleInfo: ViewScaleInfo;
|
|
9
9
|
viewSizeInfo: ViewSizeInfo;
|
|
10
10
|
parentOpacity: number;
|
package/dist/esm/draw/text.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { rotateElement, calcViewElementSize, enhanceFontFamliy } from '@idraw/util';
|
|
2
2
|
import { is, isColorStr, getDefaultElementDetailConfig } from '@idraw/util';
|
|
3
|
-
import { drawBox } from './box';
|
|
3
|
+
import { drawBox, drawBoxShadow } from './box';
|
|
4
4
|
const detailConfig = getDefaultElementDetailConfig();
|
|
5
5
|
function isTextWidthWithinErrorRange(w0, w1, scale) {
|
|
6
6
|
if (scale < 0.5) {
|
|
@@ -15,147 +15,153 @@ export function drawText(ctx, elem, opts) {
|
|
|
15
15
|
const { x, y, w, h, angle } = calcViewElementSize(elem, { viewScaleInfo }) || elem;
|
|
16
16
|
const viewElem = Object.assign(Object.assign({}, elem), { x, y, w, h, angle });
|
|
17
17
|
rotateElement(ctx, { x, y, w, h, angle }, () => {
|
|
18
|
-
|
|
19
|
-
originElem: elem,
|
|
20
|
-
calcElemSize: { x, y, w, h, angle },
|
|
18
|
+
drawBoxShadow(ctx, viewElem, {
|
|
21
19
|
viewScaleInfo,
|
|
22
20
|
viewSizeInfo,
|
|
23
|
-
parentOpacity,
|
|
24
21
|
renderContent: () => {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
const originLineHeight = detail.lineHeight || originFontSize;
|
|
32
|
-
const lineHeight = originLineHeight * viewScaleInfo.scale;
|
|
33
|
-
ctx.fillStyle = elem.detail.color || detailConfig.color;
|
|
34
|
-
ctx.textBaseline = 'top';
|
|
35
|
-
ctx.$setFont({
|
|
36
|
-
fontWeight: detail.fontWeight,
|
|
37
|
-
fontSize: fontSize,
|
|
38
|
-
fontFamily: enhanceFontFamliy(detail.fontFamily)
|
|
22
|
+
drawBox(ctx, viewElem, {
|
|
23
|
+
originElem: elem,
|
|
24
|
+
calcElemSize: { x, y, w, h, angle },
|
|
25
|
+
viewScaleInfo,
|
|
26
|
+
viewSizeInfo,
|
|
27
|
+
parentOpacity
|
|
39
28
|
});
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
29
|
+
}
|
|
30
|
+
});
|
|
31
|
+
{
|
|
32
|
+
const detail = Object.assign(Object.assign({}, detailConfig), elem.detail);
|
|
33
|
+
const originFontSize = detail.fontSize || detailConfig.fontSize;
|
|
34
|
+
const fontSize = originFontSize * viewScaleInfo.scale;
|
|
35
|
+
if (fontSize < 2) {
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
const originLineHeight = detail.lineHeight || originFontSize;
|
|
39
|
+
const lineHeight = originLineHeight * viewScaleInfo.scale;
|
|
40
|
+
ctx.fillStyle = elem.detail.color || detailConfig.color;
|
|
41
|
+
ctx.textBaseline = 'top';
|
|
42
|
+
ctx.$setFont({
|
|
43
|
+
fontWeight: detail.fontWeight,
|
|
44
|
+
fontSize: fontSize,
|
|
45
|
+
fontFamily: enhanceFontFamliy(detail.fontFamily)
|
|
46
|
+
});
|
|
47
|
+
let detailText = detail.text.replace(/\r\n/gi, '\n');
|
|
48
|
+
if (detail.textTransform === 'lowercase') {
|
|
49
|
+
detailText = detailText.toLowerCase();
|
|
50
|
+
}
|
|
51
|
+
else if (detail.textTransform === 'uppercase') {
|
|
52
|
+
detailText = detailText.toUpperCase();
|
|
53
|
+
}
|
|
54
|
+
const fontHeight = lineHeight;
|
|
55
|
+
const detailTextList = detailText.split('\n');
|
|
56
|
+
const lines = [];
|
|
57
|
+
let lineNum = 0;
|
|
58
|
+
detailTextList.forEach((itemText, idx) => {
|
|
59
|
+
if (detail.minInlineSize === 'maxContent') {
|
|
60
|
+
lines.push({
|
|
61
|
+
text: itemText,
|
|
62
|
+
width: ctx.$undoPixelRatio(ctx.measureText(itemText).width)
|
|
63
|
+
});
|
|
46
64
|
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
65
|
+
else {
|
|
66
|
+
let lineText = '';
|
|
67
|
+
let splitStr = '';
|
|
68
|
+
let tempStrList = itemText.split(splitStr);
|
|
69
|
+
if (detail.wordBreak === 'normal') {
|
|
70
|
+
const splitStr = ' ';
|
|
71
|
+
const wordList = itemText.split(splitStr);
|
|
72
|
+
tempStrList = [];
|
|
73
|
+
wordList.forEach((word, idx) => {
|
|
74
|
+
tempStrList.push(word);
|
|
75
|
+
if (idx < wordList.length - 1) {
|
|
76
|
+
tempStrList.push(splitStr);
|
|
77
|
+
}
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
if (tempStrList.length === 1 && detail.overflow === 'visible') {
|
|
53
81
|
lines.push({
|
|
54
|
-
text:
|
|
55
|
-
width: ctx.$undoPixelRatio(ctx.measureText(
|
|
82
|
+
text: tempStrList[0],
|
|
83
|
+
width: ctx.$undoPixelRatio(ctx.measureText(tempStrList[0]).width)
|
|
56
84
|
});
|
|
57
85
|
}
|
|
58
|
-
else {
|
|
59
|
-
let
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
width: ctx.$undoPixelRatio(ctx.measureText(tempStrList[0]).width)
|
|
77
|
-
});
|
|
78
|
-
}
|
|
79
|
-
else if (tempStrList.length > 0) {
|
|
80
|
-
for (let i = 0; i < tempStrList.length; i++) {
|
|
81
|
-
if (isTextWidthWithinErrorRange(ctx.$doPixelRatio(w), ctx.measureText(lineText + tempStrList[i]).width, viewScaleInfo.scale)) {
|
|
82
|
-
lineText += tempStrList[i] || '';
|
|
83
|
-
}
|
|
84
|
-
else {
|
|
86
|
+
else if (tempStrList.length > 0) {
|
|
87
|
+
for (let i = 0; i < tempStrList.length; i++) {
|
|
88
|
+
if (isTextWidthWithinErrorRange(ctx.$doPixelRatio(w), ctx.measureText(lineText + tempStrList[i]).width, viewScaleInfo.scale)) {
|
|
89
|
+
lineText += tempStrList[i] || '';
|
|
90
|
+
}
|
|
91
|
+
else {
|
|
92
|
+
lines.push({
|
|
93
|
+
text: lineText,
|
|
94
|
+
width: ctx.$undoPixelRatio(ctx.measureText(lineText).width)
|
|
95
|
+
});
|
|
96
|
+
lineText = tempStrList[i] || '';
|
|
97
|
+
lineNum++;
|
|
98
|
+
}
|
|
99
|
+
if ((lineNum + 1) * fontHeight > h && detail.overflow === 'hidden') {
|
|
100
|
+
break;
|
|
101
|
+
}
|
|
102
|
+
if (tempStrList.length - 1 === i) {
|
|
103
|
+
if ((lineNum + 1) * fontHeight <= h) {
|
|
85
104
|
lines.push({
|
|
86
105
|
text: lineText,
|
|
87
106
|
width: ctx.$undoPixelRatio(ctx.measureText(lineText).width)
|
|
88
107
|
});
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
}
|
|
92
|
-
if ((lineNum + 1) * fontHeight > h && detail.overflow === 'hidden') {
|
|
93
|
-
break;
|
|
94
|
-
}
|
|
95
|
-
if (tempStrList.length - 1 === i) {
|
|
96
|
-
if ((lineNum + 1) * fontHeight <= h) {
|
|
97
|
-
lines.push({
|
|
98
|
-
text: lineText,
|
|
99
|
-
width: ctx.$undoPixelRatio(ctx.measureText(lineText).width)
|
|
100
|
-
});
|
|
101
|
-
if (idx < detailTextList.length - 1) {
|
|
102
|
-
lineNum++;
|
|
103
|
-
}
|
|
104
|
-
break;
|
|
108
|
+
if (idx < detailTextList.length - 1) {
|
|
109
|
+
lineNum++;
|
|
105
110
|
}
|
|
111
|
+
break;
|
|
106
112
|
}
|
|
107
113
|
}
|
|
108
114
|
}
|
|
109
|
-
else {
|
|
110
|
-
lines.push({
|
|
111
|
-
text: '',
|
|
112
|
-
width: 0
|
|
113
|
-
});
|
|
114
|
-
}
|
|
115
|
-
}
|
|
116
|
-
});
|
|
117
|
-
let startY = 0;
|
|
118
|
-
let eachLineStartY = 0;
|
|
119
|
-
if (fontHeight > fontSize) {
|
|
120
|
-
eachLineStartY = (fontHeight - fontSize) / 2;
|
|
121
|
-
}
|
|
122
|
-
if (lines.length * fontHeight < h) {
|
|
123
|
-
if (elem.detail.verticalAlign === 'top') {
|
|
124
|
-
startY = 0;
|
|
125
|
-
}
|
|
126
|
-
else if (elem.detail.verticalAlign === 'bottom') {
|
|
127
|
-
startY += h - lines.length * fontHeight;
|
|
128
115
|
}
|
|
129
116
|
else {
|
|
130
|
-
|
|
117
|
+
lines.push({
|
|
118
|
+
text: '',
|
|
119
|
+
width: 0
|
|
120
|
+
});
|
|
131
121
|
}
|
|
132
122
|
}
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
123
|
+
});
|
|
124
|
+
let startY = 0;
|
|
125
|
+
let eachLineStartY = 0;
|
|
126
|
+
if (fontHeight > fontSize) {
|
|
127
|
+
eachLineStartY = (fontHeight - fontSize) / 2;
|
|
128
|
+
}
|
|
129
|
+
if (lines.length * fontHeight < h) {
|
|
130
|
+
if (elem.detail.verticalAlign === 'top') {
|
|
131
|
+
startY = 0;
|
|
132
|
+
}
|
|
133
|
+
else if (elem.detail.verticalAlign === 'bottom') {
|
|
134
|
+
startY += h - lines.length * fontHeight;
|
|
135
|
+
}
|
|
136
|
+
else {
|
|
137
|
+
startY += (h - lines.length * fontHeight) / 2;
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
{
|
|
141
|
+
const _y = y + startY;
|
|
142
|
+
if (detail.textShadowColor !== undefined && isColorStr(detail.textShadowColor)) {
|
|
143
|
+
ctx.shadowColor = detail.textShadowColor;
|
|
144
|
+
}
|
|
145
|
+
if (detail.textShadowOffsetX !== undefined && is.number(detail.textShadowOffsetX)) {
|
|
146
|
+
ctx.shadowOffsetX = detail.textShadowOffsetX;
|
|
147
|
+
}
|
|
148
|
+
if (detail.textShadowOffsetY !== undefined && is.number(detail.textShadowOffsetY)) {
|
|
149
|
+
ctx.shadowOffsetY = detail.textShadowOffsetY;
|
|
150
|
+
}
|
|
151
|
+
if (detail.textShadowBlur !== undefined && is.number(detail.textShadowBlur)) {
|
|
152
|
+
ctx.shadowBlur = detail.textShadowBlur;
|
|
153
|
+
}
|
|
154
|
+
lines.forEach((line, i) => {
|
|
155
|
+
let _x = x;
|
|
156
|
+
if (detail.textAlign === 'center') {
|
|
157
|
+
_x = x + (w - line.width) / 2;
|
|
143
158
|
}
|
|
144
|
-
if (detail.
|
|
145
|
-
|
|
159
|
+
else if (detail.textAlign === 'right') {
|
|
160
|
+
_x = x + (w - line.width);
|
|
146
161
|
}
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
if (detail.textAlign === 'center') {
|
|
150
|
-
_x = x + (w - line.width) / 2;
|
|
151
|
-
}
|
|
152
|
-
else if (detail.textAlign === 'right') {
|
|
153
|
-
_x = x + (w - line.width);
|
|
154
|
-
}
|
|
155
|
-
ctx.fillText(line.text, _x, _y + fontHeight * i + eachLineStartY);
|
|
156
|
-
});
|
|
157
|
-
}
|
|
162
|
+
ctx.fillText(line.text, _x, _y + fontHeight * i + eachLineStartY);
|
|
163
|
+
});
|
|
158
164
|
}
|
|
159
|
-
}
|
|
165
|
+
}
|
|
160
166
|
});
|
|
161
167
|
}
|
package/dist/index.global.js
CHANGED
|
@@ -1145,143 +1145,149 @@ var __privateMethod = (obj, member, method) => {
|
|
|
1145
1145
|
const { x: x2, y: y2, w: w2, h: h2, angle: angle2 } = calcViewElementSize(elem, { viewScaleInfo }) || elem;
|
|
1146
1146
|
const viewElem = { ...elem, ...{ x: x2, y: y2, w: w2, h: h2, angle: angle2 } };
|
|
1147
1147
|
rotateElement(ctx, { x: x2, y: y2, w: w2, h: h2, angle: angle2 }, () => {
|
|
1148
|
-
|
|
1149
|
-
originElem: elem,
|
|
1150
|
-
calcElemSize: { x: x2, y: y2, w: w2, h: h2, angle: angle2 },
|
|
1148
|
+
drawBoxShadow(ctx, viewElem, {
|
|
1151
1149
|
viewScaleInfo,
|
|
1152
1150
|
viewSizeInfo,
|
|
1153
|
-
parentOpacity,
|
|
1154
1151
|
renderContent: () => {
|
|
1155
|
-
|
|
1156
|
-
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
if (fontSize2 < 2) {
|
|
1162
|
-
return;
|
|
1163
|
-
}
|
|
1164
|
-
const originLineHeight = detail.lineHeight || originFontSize;
|
|
1165
|
-
const lineHeight2 = originLineHeight * viewScaleInfo.scale;
|
|
1166
|
-
ctx.fillStyle = elem.detail.color || detailConfig.color;
|
|
1167
|
-
ctx.textBaseline = "top";
|
|
1168
|
-
ctx.$setFont({
|
|
1169
|
-
fontWeight: detail.fontWeight,
|
|
1170
|
-
fontSize: fontSize2,
|
|
1171
|
-
fontFamily: enhanceFontFamliy(detail.fontFamily)
|
|
1152
|
+
drawBox(ctx, viewElem, {
|
|
1153
|
+
originElem: elem,
|
|
1154
|
+
calcElemSize: { x: x2, y: y2, w: w2, h: h2, angle: angle2 },
|
|
1155
|
+
viewScaleInfo,
|
|
1156
|
+
viewSizeInfo,
|
|
1157
|
+
parentOpacity
|
|
1172
1158
|
});
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1159
|
+
}
|
|
1160
|
+
});
|
|
1161
|
+
{
|
|
1162
|
+
const detail = {
|
|
1163
|
+
...detailConfig,
|
|
1164
|
+
...elem.detail
|
|
1165
|
+
};
|
|
1166
|
+
const originFontSize = detail.fontSize || detailConfig.fontSize;
|
|
1167
|
+
const fontSize2 = originFontSize * viewScaleInfo.scale;
|
|
1168
|
+
if (fontSize2 < 2) {
|
|
1169
|
+
return;
|
|
1170
|
+
}
|
|
1171
|
+
const originLineHeight = detail.lineHeight || originFontSize;
|
|
1172
|
+
const lineHeight2 = originLineHeight * viewScaleInfo.scale;
|
|
1173
|
+
ctx.fillStyle = elem.detail.color || detailConfig.color;
|
|
1174
|
+
ctx.textBaseline = "top";
|
|
1175
|
+
ctx.$setFont({
|
|
1176
|
+
fontWeight: detail.fontWeight,
|
|
1177
|
+
fontSize: fontSize2,
|
|
1178
|
+
fontFamily: enhanceFontFamliy(detail.fontFamily)
|
|
1179
|
+
});
|
|
1180
|
+
let detailText = detail.text.replace(/\r\n/gi, "\n");
|
|
1181
|
+
if (detail.textTransform === "lowercase") {
|
|
1182
|
+
detailText = detailText.toLowerCase();
|
|
1183
|
+
} else if (detail.textTransform === "uppercase") {
|
|
1184
|
+
detailText = detailText.toUpperCase();
|
|
1185
|
+
}
|
|
1186
|
+
const fontHeight = lineHeight2;
|
|
1187
|
+
const detailTextList = detailText.split("\n");
|
|
1188
|
+
const lines = [];
|
|
1189
|
+
let lineNum = 0;
|
|
1190
|
+
detailTextList.forEach((itemText, idx) => {
|
|
1191
|
+
if (detail.minInlineSize === "maxContent") {
|
|
1192
|
+
lines.push({
|
|
1193
|
+
text: itemText,
|
|
1194
|
+
width: ctx.$undoPixelRatio(ctx.measureText(itemText).width)
|
|
1195
|
+
});
|
|
1196
|
+
} else {
|
|
1197
|
+
let lineText = "";
|
|
1198
|
+
let splitStr = "";
|
|
1199
|
+
let tempStrList = itemText.split(splitStr);
|
|
1200
|
+
if (detail.wordBreak === "normal") {
|
|
1201
|
+
const splitStr2 = " ";
|
|
1202
|
+
const wordList = itemText.split(splitStr2);
|
|
1203
|
+
tempStrList = [];
|
|
1204
|
+
wordList.forEach((word, idx2) => {
|
|
1205
|
+
tempStrList.push(word);
|
|
1206
|
+
if (idx2 < wordList.length - 1) {
|
|
1207
|
+
tempStrList.push(splitStr2);
|
|
1208
|
+
}
|
|
1209
|
+
});
|
|
1210
|
+
}
|
|
1211
|
+
if (tempStrList.length === 1 && detail.overflow === "visible") {
|
|
1185
1212
|
lines.push({
|
|
1186
|
-
text:
|
|
1187
|
-
width: ctx.$undoPixelRatio(ctx.measureText(
|
|
1213
|
+
text: tempStrList[0],
|
|
1214
|
+
width: ctx.$undoPixelRatio(ctx.measureText(tempStrList[0]).width)
|
|
1188
1215
|
});
|
|
1189
|
-
} else {
|
|
1190
|
-
let
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
tempStrList
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
text: tempStrList[0],
|
|
1207
|
-
width: ctx.$undoPixelRatio(ctx.measureText(tempStrList[0]).width)
|
|
1208
|
-
});
|
|
1209
|
-
} else if (tempStrList.length > 0) {
|
|
1210
|
-
for (let i = 0; i < tempStrList.length; i++) {
|
|
1211
|
-
if (isTextWidthWithinErrorRange(ctx.$doPixelRatio(w2), ctx.measureText(lineText + tempStrList[i]).width, viewScaleInfo.scale)) {
|
|
1212
|
-
lineText += tempStrList[i] || "";
|
|
1213
|
-
} else {
|
|
1216
|
+
} else if (tempStrList.length > 0) {
|
|
1217
|
+
for (let i = 0; i < tempStrList.length; i++) {
|
|
1218
|
+
if (isTextWidthWithinErrorRange(ctx.$doPixelRatio(w2), ctx.measureText(lineText + tempStrList[i]).width, viewScaleInfo.scale)) {
|
|
1219
|
+
lineText += tempStrList[i] || "";
|
|
1220
|
+
} else {
|
|
1221
|
+
lines.push({
|
|
1222
|
+
text: lineText,
|
|
1223
|
+
width: ctx.$undoPixelRatio(ctx.measureText(lineText).width)
|
|
1224
|
+
});
|
|
1225
|
+
lineText = tempStrList[i] || "";
|
|
1226
|
+
lineNum++;
|
|
1227
|
+
}
|
|
1228
|
+
if ((lineNum + 1) * fontHeight > h2 && detail.overflow === "hidden") {
|
|
1229
|
+
break;
|
|
1230
|
+
}
|
|
1231
|
+
if (tempStrList.length - 1 === i) {
|
|
1232
|
+
if ((lineNum + 1) * fontHeight <= h2) {
|
|
1214
1233
|
lines.push({
|
|
1215
1234
|
text: lineText,
|
|
1216
1235
|
width: ctx.$undoPixelRatio(ctx.measureText(lineText).width)
|
|
1217
1236
|
});
|
|
1218
|
-
|
|
1219
|
-
|
|
1220
|
-
}
|
|
1221
|
-
if ((lineNum + 1) * fontHeight > h2 && detail.overflow === "hidden") {
|
|
1222
|
-
break;
|
|
1223
|
-
}
|
|
1224
|
-
if (tempStrList.length - 1 === i) {
|
|
1225
|
-
if ((lineNum + 1) * fontHeight <= h2) {
|
|
1226
|
-
lines.push({
|
|
1227
|
-
text: lineText,
|
|
1228
|
-
width: ctx.$undoPixelRatio(ctx.measureText(lineText).width)
|
|
1229
|
-
});
|
|
1230
|
-
if (idx < detailTextList.length - 1) {
|
|
1231
|
-
lineNum++;
|
|
1232
|
-
}
|
|
1233
|
-
break;
|
|
1237
|
+
if (idx < detailTextList.length - 1) {
|
|
1238
|
+
lineNum++;
|
|
1234
1239
|
}
|
|
1240
|
+
break;
|
|
1235
1241
|
}
|
|
1236
1242
|
}
|
|
1237
|
-
} else {
|
|
1238
|
-
lines.push({
|
|
1239
|
-
text: "",
|
|
1240
|
-
width: 0
|
|
1241
|
-
});
|
|
1242
1243
|
}
|
|
1243
|
-
}
|
|
1244
|
-
});
|
|
1245
|
-
let startY = 0;
|
|
1246
|
-
let eachLineStartY = 0;
|
|
1247
|
-
if (fontHeight > fontSize2) {
|
|
1248
|
-
eachLineStartY = (fontHeight - fontSize2) / 2;
|
|
1249
|
-
}
|
|
1250
|
-
if (lines.length * fontHeight < h2) {
|
|
1251
|
-
if (elem.detail.verticalAlign === "top") {
|
|
1252
|
-
startY = 0;
|
|
1253
|
-
} else if (elem.detail.verticalAlign === "bottom") {
|
|
1254
|
-
startY += h2 - lines.length * fontHeight;
|
|
1255
1244
|
} else {
|
|
1256
|
-
|
|
1245
|
+
lines.push({
|
|
1246
|
+
text: "",
|
|
1247
|
+
width: 0
|
|
1248
|
+
});
|
|
1257
1249
|
}
|
|
1258
1250
|
}
|
|
1259
|
-
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
}
|
|
1273
|
-
lines.forEach((line, i) => {
|
|
1274
|
-
let _x = x2;
|
|
1275
|
-
if (detail.textAlign === "center") {
|
|
1276
|
-
_x = x2 + (w2 - line.width) / 2;
|
|
1277
|
-
} else if (detail.textAlign === "right") {
|
|
1278
|
-
_x = x2 + (w2 - line.width);
|
|
1279
|
-
}
|
|
1280
|
-
ctx.fillText(line.text, _x, _y + fontHeight * i + eachLineStartY);
|
|
1281
|
-
});
|
|
1251
|
+
});
|
|
1252
|
+
let startY = 0;
|
|
1253
|
+
let eachLineStartY = 0;
|
|
1254
|
+
if (fontHeight > fontSize2) {
|
|
1255
|
+
eachLineStartY = (fontHeight - fontSize2) / 2;
|
|
1256
|
+
}
|
|
1257
|
+
if (lines.length * fontHeight < h2) {
|
|
1258
|
+
if (elem.detail.verticalAlign === "top") {
|
|
1259
|
+
startY = 0;
|
|
1260
|
+
} else if (elem.detail.verticalAlign === "bottom") {
|
|
1261
|
+
startY += h2 - lines.length * fontHeight;
|
|
1262
|
+
} else {
|
|
1263
|
+
startY += (h2 - lines.length * fontHeight) / 2;
|
|
1282
1264
|
}
|
|
1283
1265
|
}
|
|
1284
|
-
|
|
1266
|
+
{
|
|
1267
|
+
const _y = y2 + startY;
|
|
1268
|
+
if (detail.textShadowColor !== void 0 && isColorStr(detail.textShadowColor)) {
|
|
1269
|
+
ctx.shadowColor = detail.textShadowColor;
|
|
1270
|
+
}
|
|
1271
|
+
if (detail.textShadowOffsetX !== void 0 && is.number(detail.textShadowOffsetX)) {
|
|
1272
|
+
ctx.shadowOffsetX = detail.textShadowOffsetX;
|
|
1273
|
+
}
|
|
1274
|
+
if (detail.textShadowOffsetY !== void 0 && is.number(detail.textShadowOffsetY)) {
|
|
1275
|
+
ctx.shadowOffsetY = detail.textShadowOffsetY;
|
|
1276
|
+
}
|
|
1277
|
+
if (detail.textShadowBlur !== void 0 && is.number(detail.textShadowBlur)) {
|
|
1278
|
+
ctx.shadowBlur = detail.textShadowBlur;
|
|
1279
|
+
}
|
|
1280
|
+
lines.forEach((line, i) => {
|
|
1281
|
+
let _x = x2;
|
|
1282
|
+
if (detail.textAlign === "center") {
|
|
1283
|
+
_x = x2 + (w2 - line.width) / 2;
|
|
1284
|
+
} else if (detail.textAlign === "right") {
|
|
1285
|
+
_x = x2 + (w2 - line.width);
|
|
1286
|
+
}
|
|
1287
|
+
ctx.fillText(line.text, _x, _y + fontHeight * i + eachLineStartY);
|
|
1288
|
+
});
|
|
1289
|
+
}
|
|
1290
|
+
}
|
|
1285
1291
|
});
|
|
1286
1292
|
}
|
|
1287
1293
|
function drawPath(ctx, elem, opts) {
|
package/dist/index.global.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var iDrawRenderer=function(e){"use strict";var t,n,i,o,a,r,l,s,c,d,h,f,u,w,g,v,p,y,m,S,x,b,I,z=(e,t,n)=>{if(!t.has(e))throw TypeError("Cannot "+n)},T=(e,t,n)=>(z(e,t,"read from private field"),n?n.call(e):t.get(e)),k=(e,t,n)=>{if(t.has(e))throw TypeError("Cannot add the same private member more than once");t instanceof WeakSet?t.add(e):t.set(e,n)},A=(e,t,n,i)=>(z(e,t,"write to private field"),i?i.call(e,n):t.set(e,n),n),C=(e,t,n)=>(z(e,t,"access private method"),n);function P(e){return"string"==typeof e&&(/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e)||/^[a-z]{1,}$/i.test(e))}function E(e,t){if(1===t)return e;let n=1;const i=/^\#[0-9a-f]{6,6}$/i;let o=e;if(i.test(e)?n=parseInt(e.substring(5,7).replace(/^\#/,"0x")):/^\#[0-9a-f]{8,8}$/i.test(e)&&(n=parseInt(e.substring(7,9).replace(/^\#/,"0x")),o=e.substring(0,7)),n*=t,i.test(o)&&n>0&&n<1){const e=Math.max(0,Math.min(255,Math.ceil(256*n)));o=`${o.toUpperCase()}${e.toString(16).toUpperCase()}`}return o}function W(){function e(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${e()}${e()}-${e()}-${e()}-${e()}-${e()}${e()}${e()}`}function O(e){let t=0;for(let n=0;n<e.length;n++)t+=e.charCodeAt(n)*e.charCodeAt(n)*n*n;return t.toString(16).substring(0,4)}function $(e){const t=e.length,n=Math.floor(t/2),i=e.substring(0,4).padEnd(4,"0"),o=e.substring(0,4).padEnd(4,"0");return`@assets/${O(t.toString(16).padEnd(4,i))}${O(e.substring(n-4,n).padEnd(4,i)).padEnd(4,"f")}-${O(e.substring(n-8,n-4).padEnd(4,i)).padEnd(4,"f")}-${O(e.substring(n-12,n-8).padEnd(4,i)).padEnd(4,"f")}-${O(e.substring(n-16,n-12).padEnd(4,o)).padEnd(4,"f")}-${O(e.substring(n,n+4).padEnd(4,o)).padEnd(4,"f")}${O(e.substring(n+4,n+8).padEnd(4,o)).padEnd(4,"f")}${O(o.padEnd(4,i).padEnd(4,o))}`}function M(e){return(Object.prototype.toString.call(e)||"").replace(/(\[object|\])/gi,"").trim()}const R={type(e,t){const n=M(e);return!0===t?n.toLocaleLowerCase():n},array:e=>"Array"===M(e),json:e=>"Object"===M(e),function:e=>"Function"===M(e),asyncFunction:e=>"AsyncFunction"===M(e),boolean:e=>"Boolean"===M(e),string:e=>"String"===M(e),number:e=>"Number"===M(e),undefined:e=>"Undefined"===M(e),null:e=>"Null"===M(e),promise:e=>"Promise"===M(e)};var D=function(e,t,n,i){return new(n||(n=Promise))((function(o,a){function r(e){try{s(i.next(e))}catch(e){a(e)}}function l(e){try{s(i.throw(e))}catch(e){a(e)}}function s(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(r,l)}s((i=i.apply(e,t||[])).next())}))};const{Image:L}=window;function B(e){return new Promise(((t,n)=>{const i=new L;i.crossOrigin="anonymous",i.onload=function(){t(i)},i.onabort=n,i.onerror=n,i.src=e}))}function X(e){return D(this,void 0,void 0,(function*(){const t=yield function(e){return new Promise(((t,n)=>{const i=new Blob([e],{type:"image/svg+xml;charset=utf-8"}),o=new FileReader;o.readAsDataURL(i),o.onload=function(e){var n;const i=null===(n=null==e?void 0:e.target)||void 0===n?void 0:n.result;t(i)},o.onerror=function(e){n(e)}}))}(e);return yield B(t)}))}function Y(e,t){return D(this,void 0,void 0,(function*(){e=e.replace(/\&/gi,"&");const n=yield function(e,t){const{width:n,height:i}=t;return new Promise(((t,o)=>{const a=new Blob([`\n <svg \n xmlns="http://www.w3.org/2000/svg" \n width="${n||""}" \n height = "${i||""}">\n <foreignObject width="100%" height="100%">\n <div xmlns = "http://www.w3.org/1999/xhtml">\n ${e}\n </div>\n </foreignObject>\n </svg>\n `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(a),r.onload=function(e){var n;const i=null===(n=null==e?void 0:e.target)||void 0===n?void 0:n.result;t(i)},r.onerror=function(e){o(e)}}))}(e,t);return yield B(n)}))}function F(e){return"number"==typeof e&&(e>0||e<=0)}function H(e){return"number"==typeof e&&e>=0}function j(e){return"string"==typeof e&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${e}`)}function U(e){return"string"==typeof e&&/^(data:image\/)/.test(`${e}`)}const N={x:function(e){return F(e)},y:function(e){return F(e)},w:H,h:function(e){return"number"==typeof e&&e>=0},angle:function(e){return"number"==typeof e&&e>=-360&&e<=360},number:F,numberStr:function(e){return/^(-?\d+(?:\.\d+)?)$/.test(`${e}`)},borderWidth:function(e){return H(e)},borderRadius:function(e){return F(e)&&e>=0},color:function(e){return P(e)},imageSrc:function(e){return U(e)||j(e)},imageURL:j,imageBase64:U,svg:function(e){return"string"==typeof e&&/^(<svg[\s]{1,}|<svg>)/i.test(`${e}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${e}`.trim())},html:function(e){let t=!1;if("string"==typeof e){let n=document.createElement("div");n.innerHTML=e,n.children.length>0&&(t=!0),n=null}return t},text:function(e){return"string"==typeof e},fontSize:function(e){return F(e)&&e>0},lineHeight:function(e){return F(e)&&e>0},textAlign:function(e){return["center","left","right"].includes(e)},fontFamily:function(e){return"string"==typeof e&&e.length>0},fontWeight:function(e){return["bold"].includes(e)},strokeWidth:function(e){return F(e)&&e>0}};var q,G=function(e,t,n,i){if("a"===n&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!i:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?i:"a"===n?i.call(e):i?i.value:t.get(e)};class J{constructor(){q.set(this,void 0),function(e,t,n,i,o){if("m"===i)throw new TypeError("Private method is not writable");if("a"===i&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");"a"===i?o.call(e,n):o?o.value=n:t.set(e,n)}(this,q,new Map,"f")}on(e,t){if(G(this,q,"f").has(e)){const n=G(this,q,"f").get(e)||[];null==n||n.push(t),G(this,q,"f").set(e,n)}else G(this,q,"f").set(e,[t])}off(e,t){if(G(this,q,"f").has(e)){const n=G(this,q,"f").get(e);if(Array.isArray(n))for(let e=0;e<(null==n?void 0:n.length);e++)if(n[e]===t){n.splice(e,1);break}G(this,q,"f").set(e,n||[])}}trigger(e,t){const n=G(this,q,"f").get(e);return!!Array.isArray(n)&&(n.forEach((e=>{e(t)})),!0)}has(e){if(G(this,q,"f").has(e)){const t=G(this,q,"f").get(e);if(Array.isArray(t)&&t.length>0)return!0}return!1}destroy(){this.clear()}clear(){G(this,q,"f").clear()}}function K(e,t,n,i){const o=function(e){return e/180*Math.PI}(t||0);n&&(o>0||o<0)&&(e.translate(n.x,n.y),e.rotate(o),e.translate(-n.x,-n.y)),i(e),n&&(o>0||o<0)&&(e.translate(n.x,n.y),e.rotate(-o),e.translate(-n.x,-n.y))}function Q(e,t,n){const i={x:(o=t).x+o.w/2,y:o.y+o.h/2};var o;K(e,t.angle||0,i,(()=>{n(e)}))}function V(e,t){const{viewScaleInfo:n}=t,{x:i,y:o,w:a,h:r,angle:l}=e,{scale:s,offsetTop:c,offsetLeft:d}=n;return{x:i*s+d,y:o*s+c,w:a*s,h:r*s,angle:l}}function Z(e){let t="";return e.forEach((e=>{t+=e.type+e.params.join(" ")})),t}q=new WeakMap;const _={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};function ee(e,t){const{viewScaleInfo:n}=t,{scale:i}=n;let{borderRadius:o,borderDash:a}=e.detail;const r=Array.isArray(a)&&a.length>0,{boxSizing:l=_.boxSizing,borderWidth:s}=e.detail;Array.isArray(s)&&(o=0);let{x:c,y:d,w:h,h:f}=e,u=[0,0,0,0];if("number"==typeof o){const e=o*i;u=[e,e,e,e]}else Array.isArray(o)&&4===(null==o?void 0:o.length)&&(u=[o[0]*i,o[1]*i,o[2]*i,o[3]*i]);let w=0;return"number"==typeof s&&(w=(s||0)*i),"border-box"!==l||r?"content-box"===l?(c=e.x-w/2,d=e.y-w/2,h=e.w+w,f=e.h+w):(c=e.x,d=e.y,h=e.w,f=e.h):(c=e.x+w/2,d=e.y+w/2,h=e.w-w,f=e.h-w),h=Math.max(h,1),f=Math.max(f,1),u=u.map((e=>Math.min(e,h/2,f/2))),{x:c,y:d,w:h,h:f,radiusList:u}}const te=["-apple-system",'"system-ui"',' "Segoe UI"'," Roboto",'"Helvetica Neue"',"Arial",'"Noto Sans"'," sans-serif"];function ne(e,t,n){if("string"==typeof t)return t;const{viewElementSize:i,viewScaleInfo:o,opacity:a=1}=n,{x:r,y:l}=i,{scale:s}=o;if("linear-gradient"===(null==t?void 0:t.type)){const{start:n,end:i,stops:o}=t,c={x:r+n.x*s,y:l+n.y*s},d={x:r+i.x*s,y:l+i.y*s},h=e.createLinearGradient(c.x,c.y,d.x,d.y);return o.forEach((e=>{h.addColorStop(e.offset,E(e.color,a))})),h}if("radial-gradient"===(null==t?void 0:t.type)){const{inner:n,outer:i,stops:o}=t,c={x:r+n.x*s,y:l+n.y*s,radius:n.radius*s},d={x:r+i.x*s,y:l+i.y*s,radius:i.radius*s},h=e.createRadialGradient(c.x,c.y,c.radius,d.x,d.y,d.radius);return o.forEach((e=>{h.addColorStop(e.offset,E(e.color,a))})),h}return"#000000"}const ie={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};function oe(e){var t,n,i,o;let a=1;return void 0!==(null==(t=null==e?void 0:e.detail)?void 0:t.opacity)&&(null==(n=null==e?void 0:e.detail)?void 0:n.opacity)>=0&&(null==(i=null==e?void 0:e.detail)?void 0:i.opacity)<=1&&(a=null==(o=null==e?void 0:e.detail)?void 0:o.opacity),a}function ae(e,t,n){const{pattern:i,renderContent:o,originElem:a,calcElemSize:r,viewScaleInfo:l,viewSizeInfo:s}=n||{},{parentOpacity:c}=n,d=oe(a)*c,{clipPath:h,clipPathStrokeColor:f,clipPathStrokeWidth:u}=a.detail,w=()=>{e.globalAlpha=d,re(e,t,{pattern:i,viewScaleInfo:l,viewSizeInfo:s}),null==o||o(),le(e,t,{viewScaleInfo:l,viewSizeInfo:s}),e.globalAlpha=c};h?(function(e,t,n){const{renderContent:i,originElem:o,calcElemSize:a,viewSizeInfo:r}=n,l=r.devicePixelRatio,{clipPath:s}=(null==o?void 0:o.detail)||{};if(s&&a&&s.commands){const{x:n,y:o,w:r,h:c}=a,{originW:d,originH:h,originX:f,originY:u}=s,w=r/d,g=c/h,v=n-f*w,p=o-u*g;e.save(),e.translate(v,p),e.scale(l*w,l*g);const y=Z(s.commands||[]),m=new Path2D(y);e.clip(m),e.translate(0-v,0-p),e.setTransform(1,0,0,1,0,0),Q(e,{...t},(()=>{null==i||i()})),e.restore()}else null==i||i()}(e,t,{originElem:a,calcElemSize:r,viewScaleInfo:l,viewSizeInfo:s,renderContent:()=>{w()}}),"number"==typeof u&&u>0&&f&&function(e,t,n){const{renderContent:i,originElem:o,calcElemSize:a,viewSizeInfo:r,parentOpacity:l}=n,s=r.devicePixelRatio,{clipPath:c,clipPathStrokeColor:d,clipPathStrokeWidth:h}=(null==o?void 0:o.detail)||{};if(c&&a&&c.commands&&"number"==typeof h&&h>0&&d){const{x:n,y:o,w:r,h:f}=a,{originW:u,originH:w,originX:g,originY:v}=c,p=r/u,y=f/w,m=n-g*p,S=o-v*y;e.save(),e.globalAlpha=l,e.translate(m,S),e.scale(s*p,s*y);const x=Z(c.commands||[]),b=new Path2D(x);e.strokeStyle=d,e.lineWidth=h,e.stroke(b),e.translate(0-m,0-S),e.setTransform(1,0,0,1,0,0),Q(e,{...t},(()=>{null==i||i()})),e.restore()}else null==i||i()}(e,t,{originElem:a,calcElemSize:r,viewScaleInfo:l,viewSizeInfo:s,parentOpacity:c})):w()}function re(e,t,n){var i,o;const{pattern:a,viewScaleInfo:r,viewSizeInfo:l}=n,s=[];if(t.detail.background||a){const{x:n,y:c,w:d,h:h,radiusList:f}=ee(t,{viewScaleInfo:r,viewSizeInfo:l});if(e.beginPath(),e.moveTo(n+f[0],c),e.arcTo(n+d,c,n+d,c+h,f[1]),e.arcTo(n+d,c+h,n,c+h,f[2]),e.arcTo(n,c+h,n,c,f[3]),e.arcTo(n,c,n+d,c,f[0]),e.closePath(),"string"==typeof a)e.fillStyle=a;else if(["CanvasPattern"].includes(R.type(a)))e.fillStyle=a;else if("string"==typeof t.detail.background)e.fillStyle=t.detail.background;else if("linear-gradient"===(null==(i=t.detail.background)?void 0:i.type)){const i=ne(e,t.detail.background,{viewElementSize:{x:n,y:c,w:d,h:h},viewScaleInfo:r,opacity:e.globalAlpha});e.fillStyle=i}else if("radial-gradient"===(null==(o=t.detail.background)?void 0:o.type)){const i=ne(e,t.detail.background,{viewElementSize:{x:n,y:c,w:d,h:h},viewScaleInfo:r,opacity:e.globalAlpha});if(e.fillStyle=i,s&&s.length>0)for(let t=0;t<(null==s?void 0:s.length);t++){const i=s[t];"translate"===i.method?e.translate(i.args[0]+n,i.args[1]+c):"rotate"===i.method?e.rotate(...i.args):"scale"===i.method&&e.scale(...i.args)}}e.fill(),s&&s.length>0&&e.setTransform(1,0,0,1,0,0)}}function le(e,t,n){if(0===t.detail.borderWidth)return;if(!P(t.detail.borderColor))return;const{viewScaleInfo:i}=n,{scale:o}=i;let a=ie.borderColor;!0===P(t.detail.borderColor)&&(a=t.detail.borderColor);const{borderWidth:r,borderRadius:l,borderDash:s,boxSizing:c=ie.boxSizing}=t.detail;let d=0;"number"==typeof r&&(d=r||1),d*=o;let h=[0,0,0,0];if("number"==typeof l){const e=l*o;h=[e,e,e,e]}else Array.isArray(l)&&4===(null==l?void 0:l.length)&&(h=[l[0]*o,l[1]*o,l[2]*o,l[3]*o]);e.strokeStyle=a;let f=[];Array.isArray(s)&&s.length>0&&(f=s.map((e=>Math.ceil(e*o))));let u=0,w=0,g=0,v=0;if(Array.isArray(r)&&(u=(r[0]||0)*o,w=(r[1]||0)*o,g=(r[2]||0)*o,v=(r[3]||0)*o),v||w||u||g){e.lineCap="butt";let{x:n,y:i,w:o,h:a}=t;"border-box"===c?(n+=v/2,i+=u/2,o=o-v/2-w/2,a=a-u/2-g/2):"content-box"===c?(n-=v/2,i-=u/2,o=o+v/2+w/2,a=a+u/2+g/2):(n=t.x,i=t.y,o=t.w,a=t.h),u&&(e.beginPath(),e.lineWidth=u,e.moveTo(n-v/2,i),e.lineTo(n+o+w/2,i),e.closePath(),e.stroke()),w&&(e.beginPath(),e.lineWidth=w,e.moveTo(n+o,i-u/2),e.lineTo(n+o,i+a+g/2),e.closePath(),e.stroke()),g&&(e.beginPath(),e.lineWidth=g,e.moveTo(n-v/2,i+a),e.lineTo(n+o+w/2,i+a),e.closePath(),e.stroke()),v&&(e.beginPath(),e.lineWidth=v,e.moveTo(n,i-u/2),e.lineTo(n,i+a+g/2),e.closePath(),e.stroke())}else{let{x:n,y:i,w:o,h:a}=t;"border-box"===c?(n=t.x+d/2,i=t.y+d/2,o=t.w-d,a=t.h-d):"content-box"===c?(n=t.x-d/2,i=t.y-d/2,o=t.w+d,a=t.h+d):(n=t.x,i=t.y,o=t.w,a=t.h),f.length>0?e.lineCap="butt":e.lineCap="square",o=Math.max(o,1),a=Math.max(a,1),h=h.map((e=>Math.min(e,o/2,a/2))),e.setLineDash(f),e.lineWidth=d,e.beginPath(),e.moveTo(n+h[0],i),e.arcTo(n+o,i,n+o,i+a,h[1]),e.arcTo(n+o,i+a,n,i+a,h[2]),e.arcTo(n,i+a,n,i,h[3]),e.arcTo(n,i,n+o,i,h[0]),e.closePath(),e.stroke()}e.setLineDash([])}function se(e,t,n){const{detail:i}=t,{viewScaleInfo:o,renderContent:a}=n,{shadowColor:r,shadowOffsetX:l,shadowOffsetY:s,shadowBlur:c}=i;N.number(c)?(e.save(),e.shadowColor=r||ie.shadowColor,e.shadowOffsetX=(l||0)*o.scale,e.shadowOffsetY=(s||0)*o.scale,e.shadowBlur=(c||0)*o.scale,a(),e.restore()):(e.save(),e.shadowColor="transparent",e.shadowOffsetX=0,e.shadowOffsetY=0,e.shadowBlur=0,a(),e.restore())}function ce(e,t,n){const{viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a}=n,{x:r,y:l,w:s,h:c,angle:d}=V(t,{viewScaleInfo:i})||t,h={...t,x:r,y:l,w:s,h:c,angle:d};Q(e,{x:r,y:l,w:s,h:c,angle:d},(()=>{se(e,h,{viewScaleInfo:i,viewSizeInfo:o,renderContent:()=>{ae(e,h,{originElem:t,calcElemSize:{x:r,y:l,w:s,h:c,angle:d},viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a,renderContent:()=>{}})}})}))}const de={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};const he=.4;function fe(e,t,n){var i,o,a;if(!0===(null==(i=null==t?void 0:t.operations)?void 0:i.invisible))return;const{w:r,h:l}=t,{scale:s}=n.viewScaleInfo;if(s<1&&(r*s<he||l*s<he)||0===n.parentOpacity)return;const{overrideElementMap:c}=n;if(!(null==(a=null==(o=null==c?void 0:c[t.uuid])?void 0:o.operations)?void 0:a.invisible))try{switch(t.type){case"rect":ce(e,t,n);break;case"circle":!function(e,t,n){const{detail:i,angle:o}=t,{viewScaleInfo:a,viewSizeInfo:r,parentOpacity:l}=n,{background:s="#000000",borderColor:c="#000000",boxSizing:d,borderWidth:h=0,borderDash:f}=i;let u=0;"number"==typeof h&&h>0?u=h:Array.isArray(h)&&"number"==typeof h[0]&&h[0]>0&&(u=h[0]),u*=a.scale;const{x:w,y:g,w:v,h:p}=V({x:t.x,y:t.y,w:t.w,h:t.h},{viewScaleInfo:a})||t,y={...t,x:w,y:g,w:v,h:p,angle:o};Q(e,{x:w,y:g,w:v,h:p,angle:o},(()=>{se(e,y,{viewScaleInfo:a,viewSizeInfo:r,renderContent:()=>{let t=v/2,n=p/2;const i=w+t,o=g+n,r=t,h=n;if(u>0&&("content-box"===d||("center-line"===d?(t-=u/2,n-=u/2):(t-=u,n-=u))),t>=0&&n>=0){const d=oe(y)*l;e.globalAlpha=d,e.beginPath();const m=ne(e,s,{viewElementSize:{x:w,y:g,w:v,h:p},viewScaleInfo:a,opacity:e.globalAlpha});if(e.fillStyle=m,e.circle(i,o,r,h,0,0,2*Math.PI),e.closePath(),e.fill(),e.globalAlpha=l,"number"==typeof u&&u>0){const r=u/2+t,l=u/2+n;if(e.beginPath(),f){const t=f.map((e=>e*a.scale));e.setLineDash(t)}e.strokeStyle=c,e.lineWidth=u,e.circle(i,o,r,l,0,0,2*Math.PI),e.closePath(),e.stroke(),e.setLineDash([])}}}})}))}(e,t,n);break;case"text":!function(e,t,n){const{viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a}=n,{x:r,y:l,w:s,h:c,angle:d}=V(t,{viewScaleInfo:i})||t,h={...t,x:r,y:l,w:s,h:c,angle:d};Q(e,{x:r,y:l,w:s,h:c,angle:d},(()=>{ae(e,h,{originElem:t,calcElemSize:{x:r,y:l,w:s,h:c,angle:d},viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a,renderContent:()=>{const n={...de,...t.detail},o=n.fontSize||de.fontSize,a=o*i.scale;if(a<2)return;const d=(n.lineHeight||o)*i.scale;var h;e.fillStyle=t.detail.color||de.color,e.textBaseline="top",e.$setFont({fontWeight:n.fontWeight,fontSize:a,fontFamily:(h=n.fontFamily,[h,...te].join(", "))});let f=n.text.replace(/\r\n/gi,"\n");"lowercase"===n.textTransform?f=f.toLowerCase():"uppercase"===n.textTransform&&(f=f.toUpperCase());const u=d,w=f.split("\n"),g=[];let v=0;w.forEach(((t,o)=>{if("maxContent"===n.minInlineSize)g.push({text:t,width:e.$undoPixelRatio(e.measureText(t).width)});else{let l="",d="",h=t.split(d);if("normal"===n.wordBreak){const e=" ",n=t.split(e);h=[],n.forEach(((t,i)=>{h.push(t),i<n.length-1&&h.push(e)}))}if(1===h.length&&"visible"===n.overflow)g.push({text:h[0],width:e.$undoPixelRatio(e.measureText(h[0]).width)});else if(h.length>0){for(let t=0;t<h.length&&(a=e.$doPixelRatio(s),r=e.measureText(l+h[t]).width,i.scale<.5&&a<r&&(a-r)/a>-.15||a>=r?l+=h[t]||"":(g.push({text:l,width:e.$undoPixelRatio(e.measureText(l).width)}),l=h[t]||"",v++),!((v+1)*u>c&&"hidden"===n.overflow));t++)if(h.length-1===t&&(v+1)*u<=c){g.push({text:l,width:e.$undoPixelRatio(e.measureText(l).width)}),o<w.length-1&&v++;break}}else g.push({text:"",width:0})}var a,r}));let p=0,y=0;u>a&&(y=(u-a)/2),g.length*u<c&&("top"===t.detail.verticalAlign?p=0:"bottom"===t.detail.verticalAlign?p+=c-g.length*u:p+=(c-g.length*u)/2);{const t=l+p;void 0!==n.textShadowColor&&P(n.textShadowColor)&&(e.shadowColor=n.textShadowColor),void 0!==n.textShadowOffsetX&&N.number(n.textShadowOffsetX)&&(e.shadowOffsetX=n.textShadowOffsetX),void 0!==n.textShadowOffsetY&&N.number(n.textShadowOffsetY)&&(e.shadowOffsetY=n.textShadowOffsetY),void 0!==n.textShadowBlur&&N.number(n.textShadowBlur)&&(e.shadowBlur=n.textShadowBlur),g.forEach(((i,o)=>{let a=r;"center"===n.textAlign?a=r+(s-i.width)/2:"right"===n.textAlign&&(a=r+(s-i.width)),e.fillText(i.text,a,t+u*o+y)}))}}})}))}(e,t,n);break;case"image":!function(e,t,n){const i=n.loader.getContent(t),{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,{x:l,y:s,w:c,h:d,angle:h}=V(t,{viewScaleInfo:o})||t,f={...t,x:l,y:s,w:c,h:d,angle:h};Q(e,{x:l,y:s,w:c,h:d,angle:h},(()=>{se(e,f,{viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{ae(e,f,{originElem:t,calcElemSize:{x:l,y:s,w:c,h:d,angle:h},viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r,renderContent:()=>{if(i||n.loader.isDestroyed()||n.loader.load(t,n.elementAssets||{}),"image"===t.type&&i){e.globalAlpha=oe(t)*r;const{x:n,y:l,w:s,h:c,radiusList:d}=ee(f,{viewScaleInfo:o,viewSizeInfo:a}),{detail:h}=t,{scaleMode:u,originW:w=0,originH:g=0}=h,v=e.$undoPixelRatio(w),p=e.$undoPixelRatio(g);if(e.save(),e.fillStyle="transparent",e.beginPath(),e.moveTo(n+d[0],l),e.arcTo(n+s,l,n+s,l+c,d[1]),e.arcTo(n+s,l+c,n,l+c,d[2]),e.arcTo(n,l+c,n,l,d[3]),e.arcTo(n,l,n+s,l,d[0]),e.closePath(),e.fill(),e.clip(),u&&g&&w){let o=0,a=0,r=v,d=p;const h=n,f=l,w=s,g=c;if(v>t.w||p>t.h)if("fill"===u){const e=Math.max(t.w/v,t.h/p),n=p*e;o=(v*e-t.w)/2/e,a=(n-t.h)/2/e,r=t.w/e,d=t.h/e}else if("tile"===u)o=0,a=0,r=t.w,d=t.h;else if("fit"===u){const e=Math.min(t.w/v,t.h/p);o=(v-t.w/e)/2,a=(p-t.h/e)/2,r=t.w/e,d=t.h/e}e.drawImage(i,o,a,r,d,h,f,w,g)}else e.drawImage(i,n,l,s,c);e.globalAlpha=r,e.restore()}}})}})}))}(e,t,n);break;case"svg":!function(e,t,n){const i=n.loader.getContent(t),{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,{x:l,y:s,w:c,h:d,angle:h}=V(t,{viewScaleInfo:o,viewSizeInfo:a})||t;Q(e,{x:l,y:s,w:c,h:d,angle:h},(()=>{i||n.loader.isDestroyed()||n.loader.load(t,n.elementAssets||{}),"svg"===t.type&&i&&(e.globalAlpha=oe(t)*r,e.drawImage(i,l,s,c,d),e.globalAlpha=r)}))}(e,t,n);break;case"html":!function(e,t,n){const i=n.loader.getContent(t),{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,{x:l,y:s,w:c,h:d,angle:h}=V(t,{viewScaleInfo:o,viewSizeInfo:a})||t;Q(e,{x:l,y:s,w:c,h:d,angle:h},(()=>{i||n.loader.isDestroyed()||n.loader.load(t,n.elementAssets||{}),"html"===t.type&&i&&(e.globalAlpha=oe(t)*r,e.drawImage(i,l,s,c,d),e.globalAlpha=r)}))}(e,t,n);break;case"path":!function(e,t,n){var i,o;const{detail:a}=t,{originX:r,originY:l,originW:s,originH:c,fillRule:d}=a,{viewScaleInfo:h,viewSizeInfo:f,parentOpacity:u}=n,{x:w,y:g,w:v,h:p,angle:y}=V(t,{viewScaleInfo:h})||t,m=v/s,S=p/c,x=w-r*m,b=g-l*S,{clipPath:I,clipPathStrokeColor:z,clipPathStrokeWidth:T,...k}=t.detail,A=h.scale*f.devicePixelRatio,C={...t,x:w,y:g,w:v,h:p,angle:y};let P={...C};P.detail=k;let E={...t};E.detail=k,a.fill&&"string"!==a.fill&&(null==(o=null==(i=a.fill)?void 0:i.type)?void 0:o.includes("gradient"))&&(P={...C,detail:{...C.detail,background:a.fill,clipPath:{commands:a.commands,originX:r,originY:l,originW:s,originH:c}}},E.detail={...P.detail}),Q(e,{x:w,y:g,w:v,h:p,angle:y},(()=>{ae(e,P,{originElem:E,calcElemSize:{x:w,y:g,w:v,h:p,angle:y},viewScaleInfo:h,viewSizeInfo:f,parentOpacity:u,renderContent:()=>{se(e,C,{viewScaleInfo:h,viewSizeInfo:f,renderContent:()=>{e.save(),e.translate(x,b),e.scale(A*m/h.scale,A*S/h.scale);const t=Z(a.commands||[]),n=new Path2D(t);a.fill&&("string"==typeof a.fill?e.fillStyle=a.fill:e.fillStyle="transparent"),a.fill&&e.fill(n,d),a.stroke&&0!==a.strokeWidth&&(e.strokeStyle=a.stroke,e.lineWidth=(a.strokeWidth||1)/f.devicePixelRatio,e.lineCap=a.strokeLineCap||"square",e.stroke(n)),e.translate(-x,-b),e.restore()}})}})}))}(e,t,n);break;case"group":{const i={...n.elementAssets||{},...t.detail.assets||{}};!function(e,t,n){const{viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a}=n,{x:r,y:l,w:s,h:c,angle:d}=V({x:t.x,y:t.y,w:t.w,h:t.h,angle:t.angle},{viewScaleInfo:i})||t,h={...t,x:r,y:l,w:s,h:c,angle:d};Q(e,{x:r,y:l,w:s,h:c,angle:d},(()=>{e.globalAlpha=oe(t)*a,se(e,h,{viewScaleInfo:i,viewSizeInfo:o,renderContent:()=>{ae(e,h,{originElem:t,calcElemSize:{x:r,y:l,w:s,h:c,angle:d},viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a,renderContent:()=>{const{x:r,y:l,w:s,h:c,radiusList:d}=ee(h,{viewScaleInfo:i,viewSizeInfo:o});if("hidden"===t.detail.overflow&&(e.save(),e.fillStyle="transparent",e.beginPath(),e.moveTo(r+d[0],l),e.arcTo(r+s,l,r+s,l+c,d[1]),e.arcTo(r+s,l+c,r,l+c,d[2]),e.arcTo(r,l+c,r,l,d[3]),e.arcTo(r,l,r+s,l,d[0]),e.closePath(),e.fill(),e.clip()),Array.isArray(t.detail.children)){const{parentElementSize:i}=n,o={x:i.x+t.x,y:i.y+t.y,w:t.w||i.w,h:t.h||i.h,angle:t.angle},{calculator:r}=n;for(let i=0;i<t.detail.children.length;i++){let l=t.detail.children[i];if(l={...l,x:o.x+l.x,y:o.y+l.y},!0===n.forceDrawAll||(null==r?void 0:r.needRender(l)))try{fe(e,l,{...n,parentOpacity:a*oe(t)})}catch(e){console.error(e)}}}"hidden"===t.detail.overflow&&e.restore()}})}}),e.globalAlpha=a}))}(e,t,{...n,elementAssets:i});break}}}catch(e){console.error(e)}}const ue={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};function we(e,t,n){var i;const{elements:o=[]}=t,{parentOpacity:a}=n;for(let t=0;t<o.length;t++){const r=o[t],l={...r,detail:{...ue,...null==r?void 0:r.detail}};if(!0===n.forceDrawAll||(null==(i=n.calculator)?void 0:i.needRender(l)))try{fe(e,l,{...n,parentOpacity:a})}catch(e){console.error(e)}}}const ge=["image","svg","html"],ve=e=>{var t,n,i;let o=null;return"image"===e.type?o=(null==(t=null==e?void 0:e.detail)?void 0:t.src)||null:"svg"===e.type?o=(null==(n=null==e?void 0:e.detail)?void 0:n.svg)||null:"html"===e.type&&(o=(null==(i=null==e?void 0:e.detail)?void 0:i.html)||null),"string"==typeof o&&o?/^@assets\/[0-9a-z]{8,8}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{12,12}$/.test(`${o}`)?o:$(o):$(`${W()}-${e.uuid}-${W()}-${W()}`)};class pe extends J{constructor(){super(),k(this,a),k(this,l),k(this,c),k(this,h),k(this,u),k(this,g),k(this,p),k(this,t,{}),k(this,n,{}),k(this,i,{}),k(this,o,!1),C(this,a,r).call(this,"image",(async(e,t)=>{var n;const i=(null==(n=t[e.detail.src])?void 0:n.value)||e.detail.src,o=await B(i);return{uuid:e.uuid,lastModified:Date.now(),content:o}})),C(this,a,r).call(this,"html",(async(e,t)=>{var n;const i=(null==(n=t[e.detail.html])?void 0:n.value)||e.detail.html,o=await Y(i,{width:e.detail.originW||e.w,height:e.detail.originH||e.h});return{uuid:e.uuid,lastModified:Date.now(),content:o}})),C(this,a,r).call(this,"svg",(async(e,t)=>{var n;const i=(null==(n=t[e.detail.svg])?void 0:n.value)||e.detail.svg,o=await X(i);return{uuid:e.uuid,lastModified:Date.now(),content:o}}))}isDestroyed(){return T(this,o)}destroy(){A(this,o,!0),this.clear(),A(this,t,null),A(this,n,null),A(this,i,null)}load(e,t){!0!==T(this,o)&&(C(this,p,y).call(this,e)||ge.includes(e.type)&&C(this,g,v).call(this,e,t))}getContent(e){var t,n;const o=ve(e);return(null==(n=null==(t=T(this,i))?void 0:t[o])?void 0:n.content)||null}getLoadItemMap(){return T(this,i)}setLoadItemMap(e){A(this,i,e)}}t=new WeakMap,n=new WeakMap,i=new WeakMap,o=new WeakMap,a=new WeakSet,r=function(e,n){T(this,t)[e]=n},l=new WeakSet,s=function(e){var t,n,i;let o=null;return"image"===e.type?o=(null==(t=null==e?void 0:e.detail)?void 0:t.src)||null:"svg"===e.type?o=(null==(n=null==e?void 0:e.detail)?void 0:n.svg)||null:"html"===e.type&&(o=(null==(i=null==e?void 0:e.detail)?void 0:i.html)||null),o},c=new WeakSet,d=function(e){return{element:e,status:"null",content:null,error:null,startTime:-1,endTime:-1,source:C(this,l,s).call(this,e)}},h=new WeakSet,f=function(e){const t=ve(e.element),n=T(this,i)[t];T(this,o)||(n?n.startTime<e.startTime&&(T(this,i)[t]=e,this.trigger("load",{...e,countTime:e.endTime-e.startTime})):(T(this,i)[t]=e,this.trigger("load",{...e,countTime:e.endTime-e.startTime})))},u=new WeakSet,w=function(e){var t;const n=ve(e.element),a=null==(t=T(this,i))?void 0:t[n];T(this,o)||(a?a.startTime<e.startTime&&(T(this,i)[n]=e,this.trigger("error",{...e,countTime:e.endTime-e.startTime})):(T(this,i)[n]=e,this.trigger("error",{...e,countTime:e.endTime-e.startTime})))},g=new WeakSet,v=function(e,i){const a=C(this,c,d).call(this,e),r=ve(e);if(T(this,n)[r])return;T(this,n)[r]=a;const l=T(this,t)[e.type];"function"!=typeof l||T(this,o)||(a.startTime=Date.now(),l(e,i).then((e=>{T(this,o)||(a.content=e.content,a.endTime=Date.now(),a.status="load",C(this,h,f).call(this,a))})).catch((t=>{console.warn(`Load element source "${a.source}" fail`,t,e),a.endTime=Date.now(),a.status="error",a.error=t,C(this,u,w).call(this,a)})))},p=new WeakSet,y=function(e){var t;const i=ve(e),o=null==(t=T(this,n))?void 0:t[i];return!(!o||"error"!==o.status||!o.source||o.source!==C(this,l,s).call(this,e))};return m=new WeakMap,S=new WeakMap,x=new WeakMap,b=new WeakSet,I=function(){const e=T(this,S);e.on("load",(e=>{this.trigger("load",e)})),e.on("error",(e=>{console.error(e)}))},e.Renderer=class extends J{constructor(e){super(),k(this,b),k(this,m,void 0),k(this,S,new pe),k(this,x,!1),A(this,m,e),C(this,b,I).call(this)}isDestroyed(){return T(this,x)}destroy(){this.clear(),A(this,m,null),T(this,S).destroy(),A(this,S,null),A(this,x,!0)}updateOptions(e){A(this,m,e)}drawData(e,t){const n=T(this,S),{calculator:i,sharer:o}=T(this,m),a=T(this,m).viewContext;a.clearRect(0,0,a.canvas.width,a.canvas.height);const r={loader:n,calculator:i,parentElementSize:{x:0,y:0,w:t.viewSizeInfo.width,h:t.viewSizeInfo.height},elementAssets:e.assets,parentOpacity:1,overrideElementMap:null==o?void 0:o.getActiveOverrideElemenentMap(),...t};!function(e,t,n){if("string"==typeof(null==t?void 0:t.background)){const{viewSizeInfo:i}=n,{width:o,height:a}=i;e.globalAlpha=1,e.fillStyle=t.background,e.fillRect(0,0,o,a)}}(a,e.global,r),e.layout?function(e,t,n,i){const{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,l={uuid:"layout",type:"group",...t},{x:s,y:c,w:d,h:h}=V(l,{viewScaleInfo:o})||l,f={...l,x:s,y:c,w:d,h:h,angle:0};if(e.globalAlpha=1,se(e,f,{viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{re(e,f,{viewScaleInfo:o,viewSizeInfo:a})}}),"hidden"===t.detail.overflow){const{viewScaleInfo:i,viewSizeInfo:o}=n,a={uuid:"layout",type:"group",...t},r=V(a,{viewScaleInfo:i})||a,l={...a,...r},{x:s,y:c,w:d,h:h,radiusList:f}=ee(l,{viewScaleInfo:i,viewSizeInfo:o});e.save(),e.fillStyle="transparent",e.beginPath(),e.moveTo(s+f[0],c),e.arcTo(s+d,c,s+d,c+h,f[1]),e.arcTo(s+d,c+h,s,c+h,f[2]),e.arcTo(s,c+h,s,c,f[3]),e.arcTo(s,c,s+d,c,f[0]),e.closePath(),e.fill(),e.clip()}i(e),"hidden"===t.detail.overflow&&e.restore(),le(e,f,{viewScaleInfo:o,viewSizeInfo:a}),e.globalAlpha=r}(a,e.layout,r,(()=>{we(a,e,r)})):we(a,e,r)}scale(e){const{sharer:t}=T(this,m);if(!t)return;const{data:n,offsetTop:i,offsetBottom:o,offsetLeft:a,offsetRight:r,width:l,height:s,contextHeight:c,contextWidth:d,devicePixelRatio:h}=t.getActiveStoreSnapshot();n&&this.drawData(n,{viewScaleInfo:{scale:e,offsetTop:i,offsetBottom:o,offsetLeft:a,offsetRight:r},viewSizeInfo:{width:l,height:s,contextHeight:c,contextWidth:d,devicePixelRatio:h}})}setLoadItemMap(e){T(this,S).setLoadItemMap(e)}getLoadItemMap(){return T(this,S).getLoadItemMap()}getLoader(){return T(this,S)}},e.drawRect=ce,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
|
|
1
|
+
var iDrawRenderer=function(e){"use strict";var t,n,i,o,a,r,l,s,c,d,h,f,u,w,g,v,p,y,m,S,x,b,I,z=(e,t,n)=>{if(!t.has(e))throw TypeError("Cannot "+n)},T=(e,t,n)=>(z(e,t,"read from private field"),n?n.call(e):t.get(e)),k=(e,t,n)=>{if(t.has(e))throw TypeError("Cannot add the same private member more than once");t instanceof WeakSet?t.add(e):t.set(e,n)},A=(e,t,n,i)=>(z(e,t,"write to private field"),i?i.call(e,n):t.set(e,n),n),C=(e,t,n)=>(z(e,t,"access private method"),n);function P(e){return"string"==typeof e&&(/^\#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(e)||/^[a-z]{1,}$/i.test(e))}function E(e,t){if(1===t)return e;let n=1;const i=/^\#[0-9a-f]{6,6}$/i;let o=e;if(i.test(e)?n=parseInt(e.substring(5,7).replace(/^\#/,"0x")):/^\#[0-9a-f]{8,8}$/i.test(e)&&(n=parseInt(e.substring(7,9).replace(/^\#/,"0x")),o=e.substring(0,7)),n*=t,i.test(o)&&n>0&&n<1){const e=Math.max(0,Math.min(255,Math.ceil(256*n)));o=`${o.toUpperCase()}${e.toString(16).toUpperCase()}`}return o}function W(){function e(){return(65536*(1+Math.random())|0).toString(16).substring(1)}return`${e()}${e()}-${e()}-${e()}-${e()}-${e()}${e()}${e()}`}function O(e){let t=0;for(let n=0;n<e.length;n++)t+=e.charCodeAt(n)*e.charCodeAt(n)*n*n;return t.toString(16).substring(0,4)}function $(e){const t=e.length,n=Math.floor(t/2),i=e.substring(0,4).padEnd(4,"0"),o=e.substring(0,4).padEnd(4,"0");return`@assets/${O(t.toString(16).padEnd(4,i))}${O(e.substring(n-4,n).padEnd(4,i)).padEnd(4,"f")}-${O(e.substring(n-8,n-4).padEnd(4,i)).padEnd(4,"f")}-${O(e.substring(n-12,n-8).padEnd(4,i)).padEnd(4,"f")}-${O(e.substring(n-16,n-12).padEnd(4,o)).padEnd(4,"f")}-${O(e.substring(n,n+4).padEnd(4,o)).padEnd(4,"f")}${O(e.substring(n+4,n+8).padEnd(4,o)).padEnd(4,"f")}${O(o.padEnd(4,i).padEnd(4,o))}`}function M(e){return(Object.prototype.toString.call(e)||"").replace(/(\[object|\])/gi,"").trim()}const R={type(e,t){const n=M(e);return!0===t?n.toLocaleLowerCase():n},array:e=>"Array"===M(e),json:e=>"Object"===M(e),function:e=>"Function"===M(e),asyncFunction:e=>"AsyncFunction"===M(e),boolean:e=>"Boolean"===M(e),string:e=>"String"===M(e),number:e=>"Number"===M(e),undefined:e=>"Undefined"===M(e),null:e=>"Null"===M(e),promise:e=>"Promise"===M(e)};var D=function(e,t,n,i){return new(n||(n=Promise))((function(o,a){function r(e){try{s(i.next(e))}catch(e){a(e)}}function l(e){try{s(i.throw(e))}catch(e){a(e)}}function s(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(r,l)}s((i=i.apply(e,t||[])).next())}))};const{Image:L}=window;function B(e){return new Promise(((t,n)=>{const i=new L;i.crossOrigin="anonymous",i.onload=function(){t(i)},i.onabort=n,i.onerror=n,i.src=e}))}function X(e){return D(this,void 0,void 0,(function*(){const t=yield function(e){return new Promise(((t,n)=>{const i=new Blob([e],{type:"image/svg+xml;charset=utf-8"}),o=new FileReader;o.readAsDataURL(i),o.onload=function(e){var n;const i=null===(n=null==e?void 0:e.target)||void 0===n?void 0:n.result;t(i)},o.onerror=function(e){n(e)}}))}(e);return yield B(t)}))}function Y(e,t){return D(this,void 0,void 0,(function*(){e=e.replace(/\&/gi,"&");const n=yield function(e,t){const{width:n,height:i}=t;return new Promise(((t,o)=>{const a=new Blob([`\n <svg \n xmlns="http://www.w3.org/2000/svg" \n width="${n||""}" \n height = "${i||""}">\n <foreignObject width="100%" height="100%">\n <div xmlns = "http://www.w3.org/1999/xhtml">\n ${e}\n </div>\n </foreignObject>\n </svg>\n `],{type:"image/svg+xml;charset=utf-8"}),r=new FileReader;r.readAsDataURL(a),r.onload=function(e){var n;const i=null===(n=null==e?void 0:e.target)||void 0===n?void 0:n.result;t(i)},r.onerror=function(e){o(e)}}))}(e,t);return yield B(n)}))}function F(e){return"number"==typeof e&&(e>0||e<=0)}function H(e){return"number"==typeof e&&e>=0}function j(e){return"string"==typeof e&&/^(http:\/\/|https:\/\/|\.\/|\/)/.test(`${e}`)}function U(e){return"string"==typeof e&&/^(data:image\/)/.test(`${e}`)}const N={x:function(e){return F(e)},y:function(e){return F(e)},w:H,h:function(e){return"number"==typeof e&&e>=0},angle:function(e){return"number"==typeof e&&e>=-360&&e<=360},number:F,numberStr:function(e){return/^(-?\d+(?:\.\d+)?)$/.test(`${e}`)},borderWidth:function(e){return H(e)},borderRadius:function(e){return F(e)&&e>=0},color:function(e){return P(e)},imageSrc:function(e){return U(e)||j(e)},imageURL:j,imageBase64:U,svg:function(e){return"string"==typeof e&&/^(<svg[\s]{1,}|<svg>)/i.test(`${e}`.trim())&&/<\/[\s]{0,}svg>$/i.test(`${e}`.trim())},html:function(e){let t=!1;if("string"==typeof e){let n=document.createElement("div");n.innerHTML=e,n.children.length>0&&(t=!0),n=null}return t},text:function(e){return"string"==typeof e},fontSize:function(e){return F(e)&&e>0},lineHeight:function(e){return F(e)&&e>0},textAlign:function(e){return["center","left","right"].includes(e)},fontFamily:function(e){return"string"==typeof e&&e.length>0},fontWeight:function(e){return["bold"].includes(e)},strokeWidth:function(e){return F(e)&&e>0}};var q,G=function(e,t,n,i){if("a"===n&&!i)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?e!==t||!i:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===n?i:"a"===n?i.call(e):i?i.value:t.get(e)};class J{constructor(){q.set(this,void 0),function(e,t,n,i,o){if("m"===i)throw new TypeError("Private method is not writable");if("a"===i&&!o)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?e!==t||!o:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");"a"===i?o.call(e,n):o?o.value=n:t.set(e,n)}(this,q,new Map,"f")}on(e,t){if(G(this,q,"f").has(e)){const n=G(this,q,"f").get(e)||[];null==n||n.push(t),G(this,q,"f").set(e,n)}else G(this,q,"f").set(e,[t])}off(e,t){if(G(this,q,"f").has(e)){const n=G(this,q,"f").get(e);if(Array.isArray(n))for(let e=0;e<(null==n?void 0:n.length);e++)if(n[e]===t){n.splice(e,1);break}G(this,q,"f").set(e,n||[])}}trigger(e,t){const n=G(this,q,"f").get(e);return!!Array.isArray(n)&&(n.forEach((e=>{e(t)})),!0)}has(e){if(G(this,q,"f").has(e)){const t=G(this,q,"f").get(e);if(Array.isArray(t)&&t.length>0)return!0}return!1}destroy(){this.clear()}clear(){G(this,q,"f").clear()}}function K(e,t,n,i){const o=function(e){return e/180*Math.PI}(t||0);n&&(o>0||o<0)&&(e.translate(n.x,n.y),e.rotate(o),e.translate(-n.x,-n.y)),i(e),n&&(o>0||o<0)&&(e.translate(n.x,n.y),e.rotate(-o),e.translate(-n.x,-n.y))}function Q(e,t,n){const i={x:(o=t).x+o.w/2,y:o.y+o.h/2};var o;K(e,t.angle||0,i,(()=>{n(e)}))}function V(e,t){const{viewScaleInfo:n}=t,{x:i,y:o,w:a,h:r,angle:l}=e,{scale:s,offsetTop:c,offsetLeft:d}=n;return{x:i*s+d,y:o*s+c,w:a*s,h:r*s,angle:l}}function Z(e){let t="";return e.forEach((e=>{t+=e.type+e.params.join(" ")})),t}q=new WeakMap;const _={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};function ee(e,t){const{viewScaleInfo:n}=t,{scale:i}=n;let{borderRadius:o,borderDash:a}=e.detail;const r=Array.isArray(a)&&a.length>0,{boxSizing:l=_.boxSizing,borderWidth:s}=e.detail;Array.isArray(s)&&(o=0);let{x:c,y:d,w:h,h:f}=e,u=[0,0,0,0];if("number"==typeof o){const e=o*i;u=[e,e,e,e]}else Array.isArray(o)&&4===(null==o?void 0:o.length)&&(u=[o[0]*i,o[1]*i,o[2]*i,o[3]*i]);let w=0;return"number"==typeof s&&(w=(s||0)*i),"border-box"!==l||r?"content-box"===l?(c=e.x-w/2,d=e.y-w/2,h=e.w+w,f=e.h+w):(c=e.x,d=e.y,h=e.w,f=e.h):(c=e.x+w/2,d=e.y+w/2,h=e.w-w,f=e.h-w),h=Math.max(h,1),f=Math.max(f,1),u=u.map((e=>Math.min(e,h/2,f/2))),{x:c,y:d,w:h,h:f,radiusList:u}}const te=["-apple-system",'"system-ui"',' "Segoe UI"'," Roboto",'"Helvetica Neue"',"Arial",'"Noto Sans"'," sans-serif"];function ne(e,t,n){if("string"==typeof t)return t;const{viewElementSize:i,viewScaleInfo:o,opacity:a=1}=n,{x:r,y:l}=i,{scale:s}=o;if("linear-gradient"===(null==t?void 0:t.type)){const{start:n,end:i,stops:o}=t,c={x:r+n.x*s,y:l+n.y*s},d={x:r+i.x*s,y:l+i.y*s},h=e.createLinearGradient(c.x,c.y,d.x,d.y);return o.forEach((e=>{h.addColorStop(e.offset,E(e.color,a))})),h}if("radial-gradient"===(null==t?void 0:t.type)){const{inner:n,outer:i,stops:o}=t,c={x:r+n.x*s,y:l+n.y*s,radius:n.radius*s},d={x:r+i.x*s,y:l+i.y*s,radius:i.radius*s},h=e.createRadialGradient(c.x,c.y,c.radius,d.x,d.y,d.radius);return o.forEach((e=>{h.addColorStop(e.offset,E(e.color,a))})),h}return"#000000"}const ie={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};function oe(e){var t,n,i,o;let a=1;return void 0!==(null==(t=null==e?void 0:e.detail)?void 0:t.opacity)&&(null==(n=null==e?void 0:e.detail)?void 0:n.opacity)>=0&&(null==(i=null==e?void 0:e.detail)?void 0:i.opacity)<=1&&(a=null==(o=null==e?void 0:e.detail)?void 0:o.opacity),a}function ae(e,t,n){const{pattern:i,renderContent:o,originElem:a,calcElemSize:r,viewScaleInfo:l,viewSizeInfo:s}=n||{},{parentOpacity:c}=n,d=oe(a)*c,{clipPath:h,clipPathStrokeColor:f,clipPathStrokeWidth:u}=a.detail,w=()=>{e.globalAlpha=d,re(e,t,{pattern:i,viewScaleInfo:l,viewSizeInfo:s}),null==o||o(),le(e,t,{viewScaleInfo:l,viewSizeInfo:s}),e.globalAlpha=c};h?(function(e,t,n){const{renderContent:i,originElem:o,calcElemSize:a,viewSizeInfo:r}=n,l=r.devicePixelRatio,{clipPath:s}=(null==o?void 0:o.detail)||{};if(s&&a&&s.commands){const{x:n,y:o,w:r,h:c}=a,{originW:d,originH:h,originX:f,originY:u}=s,w=r/d,g=c/h,v=n-f*w,p=o-u*g;e.save(),e.translate(v,p),e.scale(l*w,l*g);const y=Z(s.commands||[]),m=new Path2D(y);e.clip(m),e.translate(0-v,0-p),e.setTransform(1,0,0,1,0,0),Q(e,{...t},(()=>{null==i||i()})),e.restore()}else null==i||i()}(e,t,{originElem:a,calcElemSize:r,viewScaleInfo:l,viewSizeInfo:s,renderContent:()=>{w()}}),"number"==typeof u&&u>0&&f&&function(e,t,n){const{renderContent:i,originElem:o,calcElemSize:a,viewSizeInfo:r,parentOpacity:l}=n,s=r.devicePixelRatio,{clipPath:c,clipPathStrokeColor:d,clipPathStrokeWidth:h}=(null==o?void 0:o.detail)||{};if(c&&a&&c.commands&&"number"==typeof h&&h>0&&d){const{x:n,y:o,w:r,h:f}=a,{originW:u,originH:w,originX:g,originY:v}=c,p=r/u,y=f/w,m=n-g*p,S=o-v*y;e.save(),e.globalAlpha=l,e.translate(m,S),e.scale(s*p,s*y);const x=Z(c.commands||[]),b=new Path2D(x);e.strokeStyle=d,e.lineWidth=h,e.stroke(b),e.translate(0-m,0-S),e.setTransform(1,0,0,1,0,0),Q(e,{...t},(()=>{null==i||i()})),e.restore()}else null==i||i()}(e,t,{originElem:a,calcElemSize:r,viewScaleInfo:l,viewSizeInfo:s,parentOpacity:c})):w()}function re(e,t,n){var i,o;const{pattern:a,viewScaleInfo:r,viewSizeInfo:l}=n,s=[];if(t.detail.background||a){const{x:n,y:c,w:d,h:h,radiusList:f}=ee(t,{viewScaleInfo:r,viewSizeInfo:l});if(e.beginPath(),e.moveTo(n+f[0],c),e.arcTo(n+d,c,n+d,c+h,f[1]),e.arcTo(n+d,c+h,n,c+h,f[2]),e.arcTo(n,c+h,n,c,f[3]),e.arcTo(n,c,n+d,c,f[0]),e.closePath(),"string"==typeof a)e.fillStyle=a;else if(["CanvasPattern"].includes(R.type(a)))e.fillStyle=a;else if("string"==typeof t.detail.background)e.fillStyle=t.detail.background;else if("linear-gradient"===(null==(i=t.detail.background)?void 0:i.type)){const i=ne(e,t.detail.background,{viewElementSize:{x:n,y:c,w:d,h:h},viewScaleInfo:r,opacity:e.globalAlpha});e.fillStyle=i}else if("radial-gradient"===(null==(o=t.detail.background)?void 0:o.type)){const i=ne(e,t.detail.background,{viewElementSize:{x:n,y:c,w:d,h:h},viewScaleInfo:r,opacity:e.globalAlpha});if(e.fillStyle=i,s&&s.length>0)for(let t=0;t<(null==s?void 0:s.length);t++){const i=s[t];"translate"===i.method?e.translate(i.args[0]+n,i.args[1]+c):"rotate"===i.method?e.rotate(...i.args):"scale"===i.method&&e.scale(...i.args)}}e.fill(),s&&s.length>0&&e.setTransform(1,0,0,1,0,0)}}function le(e,t,n){if(0===t.detail.borderWidth)return;if(!P(t.detail.borderColor))return;const{viewScaleInfo:i}=n,{scale:o}=i;let a=ie.borderColor;!0===P(t.detail.borderColor)&&(a=t.detail.borderColor);const{borderWidth:r,borderRadius:l,borderDash:s,boxSizing:c=ie.boxSizing}=t.detail;let d=0;"number"==typeof r&&(d=r||1),d*=o;let h=[0,0,0,0];if("number"==typeof l){const e=l*o;h=[e,e,e,e]}else Array.isArray(l)&&4===(null==l?void 0:l.length)&&(h=[l[0]*o,l[1]*o,l[2]*o,l[3]*o]);e.strokeStyle=a;let f=[];Array.isArray(s)&&s.length>0&&(f=s.map((e=>Math.ceil(e*o))));let u=0,w=0,g=0,v=0;if(Array.isArray(r)&&(u=(r[0]||0)*o,w=(r[1]||0)*o,g=(r[2]||0)*o,v=(r[3]||0)*o),v||w||u||g){e.lineCap="butt";let{x:n,y:i,w:o,h:a}=t;"border-box"===c?(n+=v/2,i+=u/2,o=o-v/2-w/2,a=a-u/2-g/2):"content-box"===c?(n-=v/2,i-=u/2,o=o+v/2+w/2,a=a+u/2+g/2):(n=t.x,i=t.y,o=t.w,a=t.h),u&&(e.beginPath(),e.lineWidth=u,e.moveTo(n-v/2,i),e.lineTo(n+o+w/2,i),e.closePath(),e.stroke()),w&&(e.beginPath(),e.lineWidth=w,e.moveTo(n+o,i-u/2),e.lineTo(n+o,i+a+g/2),e.closePath(),e.stroke()),g&&(e.beginPath(),e.lineWidth=g,e.moveTo(n-v/2,i+a),e.lineTo(n+o+w/2,i+a),e.closePath(),e.stroke()),v&&(e.beginPath(),e.lineWidth=v,e.moveTo(n,i-u/2),e.lineTo(n,i+a+g/2),e.closePath(),e.stroke())}else{let{x:n,y:i,w:o,h:a}=t;"border-box"===c?(n=t.x+d/2,i=t.y+d/2,o=t.w-d,a=t.h-d):"content-box"===c?(n=t.x-d/2,i=t.y-d/2,o=t.w+d,a=t.h+d):(n=t.x,i=t.y,o=t.w,a=t.h),f.length>0?e.lineCap="butt":e.lineCap="square",o=Math.max(o,1),a=Math.max(a,1),h=h.map((e=>Math.min(e,o/2,a/2))),e.setLineDash(f),e.lineWidth=d,e.beginPath(),e.moveTo(n+h[0],i),e.arcTo(n+o,i,n+o,i+a,h[1]),e.arcTo(n+o,i+a,n,i+a,h[2]),e.arcTo(n,i+a,n,i,h[3]),e.arcTo(n,i,n+o,i,h[0]),e.closePath(),e.stroke()}e.setLineDash([])}function se(e,t,n){const{detail:i}=t,{viewScaleInfo:o,renderContent:a}=n,{shadowColor:r,shadowOffsetX:l,shadowOffsetY:s,shadowBlur:c}=i;N.number(c)?(e.save(),e.shadowColor=r||ie.shadowColor,e.shadowOffsetX=(l||0)*o.scale,e.shadowOffsetY=(s||0)*o.scale,e.shadowBlur=(c||0)*o.scale,a(),e.restore()):(e.save(),e.shadowColor="transparent",e.shadowOffsetX=0,e.shadowOffsetY=0,e.shadowBlur=0,a(),e.restore())}function ce(e,t,n){const{viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a}=n,{x:r,y:l,w:s,h:c,angle:d}=V(t,{viewScaleInfo:i})||t,h={...t,x:r,y:l,w:s,h:c,angle:d};Q(e,{x:r,y:l,w:s,h:c,angle:d},(()=>{se(e,h,{viewScaleInfo:i,viewSizeInfo:o,renderContent:()=>{ae(e,h,{originElem:t,calcElemSize:{x:r,y:l,w:s,h:c,angle:d},viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a,renderContent:()=>{}})}})}))}const de={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};const he=.4;function fe(e,t,n){var i,o,a;if(!0===(null==(i=null==t?void 0:t.operations)?void 0:i.invisible))return;const{w:r,h:l}=t,{scale:s}=n.viewScaleInfo;if(s<1&&(r*s<he||l*s<he)||0===n.parentOpacity)return;const{overrideElementMap:c}=n;if(!(null==(a=null==(o=null==c?void 0:c[t.uuid])?void 0:o.operations)?void 0:a.invisible))try{switch(t.type){case"rect":ce(e,t,n);break;case"circle":!function(e,t,n){const{detail:i,angle:o}=t,{viewScaleInfo:a,viewSizeInfo:r,parentOpacity:l}=n,{background:s="#000000",borderColor:c="#000000",boxSizing:d,borderWidth:h=0,borderDash:f}=i;let u=0;"number"==typeof h&&h>0?u=h:Array.isArray(h)&&"number"==typeof h[0]&&h[0]>0&&(u=h[0]),u*=a.scale;const{x:w,y:g,w:v,h:p}=V({x:t.x,y:t.y,w:t.w,h:t.h},{viewScaleInfo:a})||t,y={...t,x:w,y:g,w:v,h:p,angle:o};Q(e,{x:w,y:g,w:v,h:p,angle:o},(()=>{se(e,y,{viewScaleInfo:a,viewSizeInfo:r,renderContent:()=>{let t=v/2,n=p/2;const i=w+t,o=g+n,r=t,h=n;if(u>0&&("content-box"===d||("center-line"===d?(t-=u/2,n-=u/2):(t-=u,n-=u))),t>=0&&n>=0){const d=oe(y)*l;e.globalAlpha=d,e.beginPath();const m=ne(e,s,{viewElementSize:{x:w,y:g,w:v,h:p},viewScaleInfo:a,opacity:e.globalAlpha});if(e.fillStyle=m,e.circle(i,o,r,h,0,0,2*Math.PI),e.closePath(),e.fill(),e.globalAlpha=l,"number"==typeof u&&u>0){const r=u/2+t,l=u/2+n;if(e.beginPath(),f){const t=f.map((e=>e*a.scale));e.setLineDash(t)}e.strokeStyle=c,e.lineWidth=u,e.circle(i,o,r,l,0,0,2*Math.PI),e.closePath(),e.stroke(),e.setLineDash([])}}}})}))}(e,t,n);break;case"text":!function(e,t,n){const{viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a}=n,{x:r,y:l,w:s,h:c,angle:d}=V(t,{viewScaleInfo:i})||t,h={...t,x:r,y:l,w:s,h:c,angle:d};Q(e,{x:r,y:l,w:s,h:c,angle:d},(()=>{se(e,h,{viewScaleInfo:i,viewSizeInfo:o,renderContent:()=>{ae(e,h,{originElem:t,calcElemSize:{x:r,y:l,w:s,h:c,angle:d},viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a})}});{const o={...de,...t.detail},a=o.fontSize||de.fontSize,d=a*i.scale;if(d<2)return;const h=(o.lineHeight||a)*i.scale;e.fillStyle=t.detail.color||de.color,e.textBaseline="top",e.$setFont({fontWeight:o.fontWeight,fontSize:d,fontFamily:(n=o.fontFamily,[n,...te].join(", "))});let f=o.text.replace(/\r\n/gi,"\n");"lowercase"===o.textTransform?f=f.toLowerCase():"uppercase"===o.textTransform&&(f=f.toUpperCase());const u=h,w=f.split("\n"),g=[];let v=0;w.forEach(((t,n)=>{if("maxContent"===o.minInlineSize)g.push({text:t,width:e.$undoPixelRatio(e.measureText(t).width)});else{let l="",d="",h=t.split(d);if("normal"===o.wordBreak){const e=" ",n=t.split(e);h=[],n.forEach(((t,i)=>{h.push(t),i<n.length-1&&h.push(e)}))}if(1===h.length&&"visible"===o.overflow)g.push({text:h[0],width:e.$undoPixelRatio(e.measureText(h[0]).width)});else if(h.length>0){for(let t=0;t<h.length&&(a=e.$doPixelRatio(s),r=e.measureText(l+h[t]).width,i.scale<.5&&a<r&&(a-r)/a>-.15||a>=r?l+=h[t]||"":(g.push({text:l,width:e.$undoPixelRatio(e.measureText(l).width)}),l=h[t]||"",v++),!((v+1)*u>c&&"hidden"===o.overflow));t++)if(h.length-1===t&&(v+1)*u<=c){g.push({text:l,width:e.$undoPixelRatio(e.measureText(l).width)}),n<w.length-1&&v++;break}}else g.push({text:"",width:0})}var a,r}));let p=0,y=0;u>d&&(y=(u-d)/2),g.length*u<c&&("top"===t.detail.verticalAlign?p=0:"bottom"===t.detail.verticalAlign?p+=c-g.length*u:p+=(c-g.length*u)/2);{const t=l+p;void 0!==o.textShadowColor&&P(o.textShadowColor)&&(e.shadowColor=o.textShadowColor),void 0!==o.textShadowOffsetX&&N.number(o.textShadowOffsetX)&&(e.shadowOffsetX=o.textShadowOffsetX),void 0!==o.textShadowOffsetY&&N.number(o.textShadowOffsetY)&&(e.shadowOffsetY=o.textShadowOffsetY),void 0!==o.textShadowBlur&&N.number(o.textShadowBlur)&&(e.shadowBlur=o.textShadowBlur),g.forEach(((n,i)=>{let a=r;"center"===o.textAlign?a=r+(s-n.width)/2:"right"===o.textAlign&&(a=r+(s-n.width)),e.fillText(n.text,a,t+u*i+y)}))}}var n}))}(e,t,n);break;case"image":!function(e,t,n){const i=n.loader.getContent(t),{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,{x:l,y:s,w:c,h:d,angle:h}=V(t,{viewScaleInfo:o})||t,f={...t,x:l,y:s,w:c,h:d,angle:h};Q(e,{x:l,y:s,w:c,h:d,angle:h},(()=>{se(e,f,{viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{ae(e,f,{originElem:t,calcElemSize:{x:l,y:s,w:c,h:d,angle:h},viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r,renderContent:()=>{if(i||n.loader.isDestroyed()||n.loader.load(t,n.elementAssets||{}),"image"===t.type&&i){e.globalAlpha=oe(t)*r;const{x:n,y:l,w:s,h:c,radiusList:d}=ee(f,{viewScaleInfo:o,viewSizeInfo:a}),{detail:h}=t,{scaleMode:u,originW:w=0,originH:g=0}=h,v=e.$undoPixelRatio(w),p=e.$undoPixelRatio(g);if(e.save(),e.fillStyle="transparent",e.beginPath(),e.moveTo(n+d[0],l),e.arcTo(n+s,l,n+s,l+c,d[1]),e.arcTo(n+s,l+c,n,l+c,d[2]),e.arcTo(n,l+c,n,l,d[3]),e.arcTo(n,l,n+s,l,d[0]),e.closePath(),e.fill(),e.clip(),u&&g&&w){let o=0,a=0,r=v,d=p;const h=n,f=l,w=s,g=c;if(v>t.w||p>t.h)if("fill"===u){const e=Math.max(t.w/v,t.h/p),n=p*e;o=(v*e-t.w)/2/e,a=(n-t.h)/2/e,r=t.w/e,d=t.h/e}else if("tile"===u)o=0,a=0,r=t.w,d=t.h;else if("fit"===u){const e=Math.min(t.w/v,t.h/p);o=(v-t.w/e)/2,a=(p-t.h/e)/2,r=t.w/e,d=t.h/e}e.drawImage(i,o,a,r,d,h,f,w,g)}else e.drawImage(i,n,l,s,c);e.globalAlpha=r,e.restore()}}})}})}))}(e,t,n);break;case"svg":!function(e,t,n){const i=n.loader.getContent(t),{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,{x:l,y:s,w:c,h:d,angle:h}=V(t,{viewScaleInfo:o,viewSizeInfo:a})||t;Q(e,{x:l,y:s,w:c,h:d,angle:h},(()=>{i||n.loader.isDestroyed()||n.loader.load(t,n.elementAssets||{}),"svg"===t.type&&i&&(e.globalAlpha=oe(t)*r,e.drawImage(i,l,s,c,d),e.globalAlpha=r)}))}(e,t,n);break;case"html":!function(e,t,n){const i=n.loader.getContent(t),{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,{x:l,y:s,w:c,h:d,angle:h}=V(t,{viewScaleInfo:o,viewSizeInfo:a})||t;Q(e,{x:l,y:s,w:c,h:d,angle:h},(()=>{i||n.loader.isDestroyed()||n.loader.load(t,n.elementAssets||{}),"html"===t.type&&i&&(e.globalAlpha=oe(t)*r,e.drawImage(i,l,s,c,d),e.globalAlpha=r)}))}(e,t,n);break;case"path":!function(e,t,n){var i,o;const{detail:a}=t,{originX:r,originY:l,originW:s,originH:c,fillRule:d}=a,{viewScaleInfo:h,viewSizeInfo:f,parentOpacity:u}=n,{x:w,y:g,w:v,h:p,angle:y}=V(t,{viewScaleInfo:h})||t,m=v/s,S=p/c,x=w-r*m,b=g-l*S,{clipPath:I,clipPathStrokeColor:z,clipPathStrokeWidth:T,...k}=t.detail,A=h.scale*f.devicePixelRatio,C={...t,x:w,y:g,w:v,h:p,angle:y};let P={...C};P.detail=k;let E={...t};E.detail=k,a.fill&&"string"!==a.fill&&(null==(o=null==(i=a.fill)?void 0:i.type)?void 0:o.includes("gradient"))&&(P={...C,detail:{...C.detail,background:a.fill,clipPath:{commands:a.commands,originX:r,originY:l,originW:s,originH:c}}},E.detail={...P.detail}),Q(e,{x:w,y:g,w:v,h:p,angle:y},(()=>{ae(e,P,{originElem:E,calcElemSize:{x:w,y:g,w:v,h:p,angle:y},viewScaleInfo:h,viewSizeInfo:f,parentOpacity:u,renderContent:()=>{se(e,C,{viewScaleInfo:h,viewSizeInfo:f,renderContent:()=>{e.save(),e.translate(x,b),e.scale(A*m/h.scale,A*S/h.scale);const t=Z(a.commands||[]),n=new Path2D(t);a.fill&&("string"==typeof a.fill?e.fillStyle=a.fill:e.fillStyle="transparent"),a.fill&&e.fill(n,d),a.stroke&&0!==a.strokeWidth&&(e.strokeStyle=a.stroke,e.lineWidth=(a.strokeWidth||1)/f.devicePixelRatio,e.lineCap=a.strokeLineCap||"square",e.stroke(n)),e.translate(-x,-b),e.restore()}})}})}))}(e,t,n);break;case"group":{const i={...n.elementAssets||{},...t.detail.assets||{}};!function(e,t,n){const{viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a}=n,{x:r,y:l,w:s,h:c,angle:d}=V({x:t.x,y:t.y,w:t.w,h:t.h,angle:t.angle},{viewScaleInfo:i})||t,h={...t,x:r,y:l,w:s,h:c,angle:d};Q(e,{x:r,y:l,w:s,h:c,angle:d},(()=>{e.globalAlpha=oe(t)*a,se(e,h,{viewScaleInfo:i,viewSizeInfo:o,renderContent:()=>{ae(e,h,{originElem:t,calcElemSize:{x:r,y:l,w:s,h:c,angle:d},viewScaleInfo:i,viewSizeInfo:o,parentOpacity:a,renderContent:()=>{const{x:r,y:l,w:s,h:c,radiusList:d}=ee(h,{viewScaleInfo:i,viewSizeInfo:o});if("hidden"===t.detail.overflow&&(e.save(),e.fillStyle="transparent",e.beginPath(),e.moveTo(r+d[0],l),e.arcTo(r+s,l,r+s,l+c,d[1]),e.arcTo(r+s,l+c,r,l+c,d[2]),e.arcTo(r,l+c,r,l,d[3]),e.arcTo(r,l,r+s,l,d[0]),e.closePath(),e.fill(),e.clip()),Array.isArray(t.detail.children)){const{parentElementSize:i}=n,o={x:i.x+t.x,y:i.y+t.y,w:t.w||i.w,h:t.h||i.h,angle:t.angle},{calculator:r}=n;for(let i=0;i<t.detail.children.length;i++){let l=t.detail.children[i];if(l={...l,x:o.x+l.x,y:o.y+l.y},!0===n.forceDrawAll||(null==r?void 0:r.needRender(l)))try{fe(e,l,{...n,parentOpacity:a*oe(t)})}catch(e){console.error(e)}}}"hidden"===t.detail.overflow&&e.restore()}})}}),e.globalAlpha=a}))}(e,t,{...n,elementAssets:i});break}}}catch(e){console.error(e)}}const ue={boxSizing:"border-box",borderWidth:0,borderColor:"#000000",shadowColor:"#000000",borderRadius:0,borderDash:[],shadowOffsetX:0,shadowOffsetY:0,shadowBlur:0,opacity:1,color:"#000000",textAlign:"left",verticalAlign:"top",fontSize:16,fontFamily:"sans-serif",fontWeight:400,minInlineSize:"auto",wordBreak:"break-all",overflow:"hidden"};function we(e,t,n){var i;const{elements:o=[]}=t,{parentOpacity:a}=n;for(let t=0;t<o.length;t++){const r=o[t],l={...r,detail:{...ue,...null==r?void 0:r.detail}};if(!0===n.forceDrawAll||(null==(i=n.calculator)?void 0:i.needRender(l)))try{fe(e,l,{...n,parentOpacity:a})}catch(e){console.error(e)}}}const ge=["image","svg","html"],ve=e=>{var t,n,i;let o=null;return"image"===e.type?o=(null==(t=null==e?void 0:e.detail)?void 0:t.src)||null:"svg"===e.type?o=(null==(n=null==e?void 0:e.detail)?void 0:n.svg)||null:"html"===e.type&&(o=(null==(i=null==e?void 0:e.detail)?void 0:i.html)||null),"string"==typeof o&&o?/^@assets\/[0-9a-z]{8,8}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{4,4}\-[0-9a-z]{12,12}$/.test(`${o}`)?o:$(o):$(`${W()}-${e.uuid}-${W()}-${W()}`)};class pe extends J{constructor(){super(),k(this,a),k(this,l),k(this,c),k(this,h),k(this,u),k(this,g),k(this,p),k(this,t,{}),k(this,n,{}),k(this,i,{}),k(this,o,!1),C(this,a,r).call(this,"image",(async(e,t)=>{var n;const i=(null==(n=t[e.detail.src])?void 0:n.value)||e.detail.src,o=await B(i);return{uuid:e.uuid,lastModified:Date.now(),content:o}})),C(this,a,r).call(this,"html",(async(e,t)=>{var n;const i=(null==(n=t[e.detail.html])?void 0:n.value)||e.detail.html,o=await Y(i,{width:e.detail.originW||e.w,height:e.detail.originH||e.h});return{uuid:e.uuid,lastModified:Date.now(),content:o}})),C(this,a,r).call(this,"svg",(async(e,t)=>{var n;const i=(null==(n=t[e.detail.svg])?void 0:n.value)||e.detail.svg,o=await X(i);return{uuid:e.uuid,lastModified:Date.now(),content:o}}))}isDestroyed(){return T(this,o)}destroy(){A(this,o,!0),this.clear(),A(this,t,null),A(this,n,null),A(this,i,null)}load(e,t){!0!==T(this,o)&&(C(this,p,y).call(this,e)||ge.includes(e.type)&&C(this,g,v).call(this,e,t))}getContent(e){var t,n;const o=ve(e);return(null==(n=null==(t=T(this,i))?void 0:t[o])?void 0:n.content)||null}getLoadItemMap(){return T(this,i)}setLoadItemMap(e){A(this,i,e)}}t=new WeakMap,n=new WeakMap,i=new WeakMap,o=new WeakMap,a=new WeakSet,r=function(e,n){T(this,t)[e]=n},l=new WeakSet,s=function(e){var t,n,i;let o=null;return"image"===e.type?o=(null==(t=null==e?void 0:e.detail)?void 0:t.src)||null:"svg"===e.type?o=(null==(n=null==e?void 0:e.detail)?void 0:n.svg)||null:"html"===e.type&&(o=(null==(i=null==e?void 0:e.detail)?void 0:i.html)||null),o},c=new WeakSet,d=function(e){return{element:e,status:"null",content:null,error:null,startTime:-1,endTime:-1,source:C(this,l,s).call(this,e)}},h=new WeakSet,f=function(e){const t=ve(e.element),n=T(this,i)[t];T(this,o)||(n?n.startTime<e.startTime&&(T(this,i)[t]=e,this.trigger("load",{...e,countTime:e.endTime-e.startTime})):(T(this,i)[t]=e,this.trigger("load",{...e,countTime:e.endTime-e.startTime})))},u=new WeakSet,w=function(e){var t;const n=ve(e.element),a=null==(t=T(this,i))?void 0:t[n];T(this,o)||(a?a.startTime<e.startTime&&(T(this,i)[n]=e,this.trigger("error",{...e,countTime:e.endTime-e.startTime})):(T(this,i)[n]=e,this.trigger("error",{...e,countTime:e.endTime-e.startTime})))},g=new WeakSet,v=function(e,i){const a=C(this,c,d).call(this,e),r=ve(e);if(T(this,n)[r])return;T(this,n)[r]=a;const l=T(this,t)[e.type];"function"!=typeof l||T(this,o)||(a.startTime=Date.now(),l(e,i).then((e=>{T(this,o)||(a.content=e.content,a.endTime=Date.now(),a.status="load",C(this,h,f).call(this,a))})).catch((t=>{console.warn(`Load element source "${a.source}" fail`,t,e),a.endTime=Date.now(),a.status="error",a.error=t,C(this,u,w).call(this,a)})))},p=new WeakSet,y=function(e){var t;const i=ve(e),o=null==(t=T(this,n))?void 0:t[i];return!(!o||"error"!==o.status||!o.source||o.source!==C(this,l,s).call(this,e))};return m=new WeakMap,S=new WeakMap,x=new WeakMap,b=new WeakSet,I=function(){const e=T(this,S);e.on("load",(e=>{this.trigger("load",e)})),e.on("error",(e=>{console.error(e)}))},e.Renderer=class extends J{constructor(e){super(),k(this,b),k(this,m,void 0),k(this,S,new pe),k(this,x,!1),A(this,m,e),C(this,b,I).call(this)}isDestroyed(){return T(this,x)}destroy(){this.clear(),A(this,m,null),T(this,S).destroy(),A(this,S,null),A(this,x,!0)}updateOptions(e){A(this,m,e)}drawData(e,t){const n=T(this,S),{calculator:i,sharer:o}=T(this,m),a=T(this,m).viewContext;a.clearRect(0,0,a.canvas.width,a.canvas.height);const r={loader:n,calculator:i,parentElementSize:{x:0,y:0,w:t.viewSizeInfo.width,h:t.viewSizeInfo.height},elementAssets:e.assets,parentOpacity:1,overrideElementMap:null==o?void 0:o.getActiveOverrideElemenentMap(),...t};!function(e,t,n){if("string"==typeof(null==t?void 0:t.background)){const{viewSizeInfo:i}=n,{width:o,height:a}=i;e.globalAlpha=1,e.fillStyle=t.background,e.fillRect(0,0,o,a)}}(a,e.global,r),e.layout?function(e,t,n,i){const{viewScaleInfo:o,viewSizeInfo:a,parentOpacity:r}=n,l={uuid:"layout",type:"group",...t},{x:s,y:c,w:d,h:h}=V(l,{viewScaleInfo:o})||l,f={...l,x:s,y:c,w:d,h:h,angle:0};if(e.globalAlpha=1,se(e,f,{viewScaleInfo:o,viewSizeInfo:a,renderContent:()=>{re(e,f,{viewScaleInfo:o,viewSizeInfo:a})}}),"hidden"===t.detail.overflow){const{viewScaleInfo:i,viewSizeInfo:o}=n,a={uuid:"layout",type:"group",...t},r=V(a,{viewScaleInfo:i})||a,l={...a,...r},{x:s,y:c,w:d,h:h,radiusList:f}=ee(l,{viewScaleInfo:i,viewSizeInfo:o});e.save(),e.fillStyle="transparent",e.beginPath(),e.moveTo(s+f[0],c),e.arcTo(s+d,c,s+d,c+h,f[1]),e.arcTo(s+d,c+h,s,c+h,f[2]),e.arcTo(s,c+h,s,c,f[3]),e.arcTo(s,c,s+d,c,f[0]),e.closePath(),e.fill(),e.clip()}i(e),"hidden"===t.detail.overflow&&e.restore(),le(e,f,{viewScaleInfo:o,viewSizeInfo:a}),e.globalAlpha=r}(a,e.layout,r,(()=>{we(a,e,r)})):we(a,e,r)}scale(e){const{sharer:t}=T(this,m);if(!t)return;const{data:n,offsetTop:i,offsetBottom:o,offsetLeft:a,offsetRight:r,width:l,height:s,contextHeight:c,contextWidth:d,devicePixelRatio:h}=t.getActiveStoreSnapshot();n&&this.drawData(n,{viewScaleInfo:{scale:e,offsetTop:i,offsetBottom:o,offsetLeft:a,offsetRight:r},viewSizeInfo:{width:l,height:s,contextHeight:c,contextWidth:d,devicePixelRatio:h}})}setLoadItemMap(e){T(this,S).setLoadItemMap(e)}getLoadItemMap(){return T(this,S).getLoadItemMap()}getLoader(){return T(this,S)}},e.drawRect=ce,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),e}({});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@idraw/renderer",
|
|
3
|
-
"version": "0.4.0-beta.
|
|
3
|
+
"version": "0.4.0-beta.30",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "dist/esm/index.js",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
@@ -21,11 +21,11 @@
|
|
|
21
21
|
"author": "chenshenhai",
|
|
22
22
|
"license": "MIT",
|
|
23
23
|
"devDependencies": {
|
|
24
|
-
"@idraw/types": "^0.4.0-beta.
|
|
24
|
+
"@idraw/types": "^0.4.0-beta.30"
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {},
|
|
27
27
|
"peerDependencies": {
|
|
28
|
-
"@idraw/util": "^0.4.0-beta.
|
|
28
|
+
"@idraw/util": "^0.4.0-beta.30"
|
|
29
29
|
},
|
|
30
30
|
"publishConfig": {
|
|
31
31
|
"access": "public",
|