@visactor/vrender-core 0.16.12-alpha.2 → 0.16.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/cjs/animate/custom-animate.d.ts +1 -0
- package/cjs/animate/custom-animate.js +5 -8
- package/cjs/animate/custom-animate.js.map +1 -1
- package/cjs/core/stage.d.ts +1 -0
- package/cjs/core/stage.js +7 -3
- package/cjs/core/stage.js.map +1 -1
- package/cjs/graphic/config.js +4 -1
- package/cjs/graphic/config.js.map +1 -1
- package/cjs/graphic/text.d.ts +1 -0
- package/cjs/graphic/text.js +84 -3
- package/cjs/graphic/text.js.map +1 -1
- package/cjs/interface/graphic/text.d.ts +3 -0
- package/cjs/interface/graphic/text.js.map +1 -1
- package/dist/index.js +143 -11
- package/dist/index.min.js +1 -1
- package/es/animate/custom-animate.d.ts +1 -0
- package/es/animate/custom-animate.js +5 -9
- package/es/animate/custom-animate.js.map +1 -1
- package/es/core/stage.d.ts +1 -0
- package/es/core/stage.js +7 -3
- package/es/core/stage.js.map +1 -1
- package/es/graphic/config.js +4 -1
- package/es/graphic/config.js.map +1 -1
- package/es/graphic/text.d.ts +1 -0
- package/es/graphic/text.js +85 -4
- package/es/graphic/text.js.map +1 -1
- package/es/interface/graphic/text.d.ts +3 -0
- package/es/interface/graphic/text.js.map +1 -1
- package/package.json +3 -3
package/dist/index.js
CHANGED
|
@@ -4294,7 +4294,10 @@
|
|
|
4294
4294
|
direction: 'horizontal',
|
|
4295
4295
|
wordBreak: 'break-all',
|
|
4296
4296
|
ignoreBuf: false,
|
|
4297
|
-
verticalMode: 0
|
|
4297
|
+
verticalMode: 0,
|
|
4298
|
+
whiteSpace: 'no-wrap',
|
|
4299
|
+
heightLimit: Infinity,
|
|
4300
|
+
lineClamp: Infinity
|
|
4298
4301
|
};
|
|
4299
4302
|
const DefaultStyle = Object.assign(Object.assign(Object.assign({ opacity: 1, background: null, texture: null, textureColor: 'black', textureSize: 10, texturePadding: 2, backgroundMode: 0, blur: 0, cursor: null, html: null }, DefaultFillStyle), DefaultStrokeStyle), DefaultLayout);
|
|
4300
4303
|
const DefaultConnectAttribute = {
|
|
@@ -9027,7 +9030,7 @@
|
|
|
9027
9030
|
};
|
|
9028
9031
|
}
|
|
9029
9032
|
onBind() {
|
|
9030
|
-
var _a, _b, _c, _d, _e, _f;
|
|
9033
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
9031
9034
|
this.fromNumber = vutils.isNumber((_a = this.from) === null || _a === void 0 ? void 0 : _a.text) ? (_b = this.from) === null || _b === void 0 ? void 0 : _b.text : Number.parseFloat((_c = this.from) === null || _c === void 0 ? void 0 : _c.text);
|
|
9032
9035
|
this.toNumber = vutils.isNumber((_d = this.to) === null || _d === void 0 ? void 0 : _d.text) ? (_e = this.to) === null || _e === void 0 ? void 0 : _e.text : Number.parseFloat((_f = this.to) === null || _f === void 0 ? void 0 : _f.text);
|
|
9033
9036
|
if (!Number.isFinite(this.toNumber)) {
|
|
@@ -9036,12 +9039,15 @@
|
|
|
9036
9039
|
if (!Number.isFinite(this.toNumber)) {
|
|
9037
9040
|
this.valid = false;
|
|
9038
9041
|
}
|
|
9042
|
+
if (this.valid !== false) {
|
|
9043
|
+
this.decimalLength =
|
|
9044
|
+
(_h = (_g = this.params) === null || _g === void 0 ? void 0 : _g.fixed) !== null && _h !== void 0 ? _h : Math.max(vutils.getDecimalPlaces(this.fromNumber), vutils.getDecimalPlaces(this.toNumber));
|
|
9045
|
+
}
|
|
9039
9046
|
}
|
|
9040
9047
|
onEnd() {
|
|
9041
9048
|
return;
|
|
9042
9049
|
}
|
|
9043
9050
|
onUpdate(end, ratio, out) {
|
|
9044
|
-
var _a;
|
|
9045
9051
|
if (this.valid === false) {
|
|
9046
9052
|
return;
|
|
9047
9053
|
}
|
|
@@ -9049,11 +9055,7 @@
|
|
|
9049
9055
|
out.text = this.toNumber;
|
|
9050
9056
|
}
|
|
9051
9057
|
else {
|
|
9052
|
-
|
|
9053
|
-
if (((_a = this.params) === null || _a === void 0 ? void 0 : _a.fixed) >= 0) {
|
|
9054
|
-
outText = outText.toFixed(this.params.fixed);
|
|
9055
|
-
}
|
|
9056
|
-
out.text = outText;
|
|
9058
|
+
out.text = (this.fromNumber + (this.toNumber - this.fromNumber) * ratio).toFixed(this.decimalLength);
|
|
9057
9059
|
}
|
|
9058
9060
|
}
|
|
9059
9061
|
}
|
|
@@ -14315,6 +14317,8 @@
|
|
|
14315
14317
|
const TEXT_UPDATE_TAG_KEY = [
|
|
14316
14318
|
'text',
|
|
14317
14319
|
'maxLineWidth',
|
|
14320
|
+
'heightLimit',
|
|
14321
|
+
'lineClamp',
|
|
14318
14322
|
'fontSize',
|
|
14319
14323
|
'fontFamily',
|
|
14320
14324
|
'fontWeight',
|
|
@@ -14399,6 +14403,112 @@
|
|
|
14399
14403
|
this.clearUpdateBoundTag();
|
|
14400
14404
|
return bounds;
|
|
14401
14405
|
}
|
|
14406
|
+
updateWrapAABBBounds(text) {
|
|
14407
|
+
var _a, _b, _c;
|
|
14408
|
+
const textTheme = getTheme(this).text;
|
|
14409
|
+
const { fontFamily = textTheme.fontFamily, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, lineHeight = this.attribute.lineHeight || this.attribute.fontSize || textTheme.fontSize, ellipsis = textTheme.ellipsis, maxLineWidth, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak, fontWeight = textTheme.fontWeight, ignoreBuf = textTheme.ignoreBuf, heightLimit = 0, lineClamp } = this.attribute;
|
|
14410
|
+
const buf = ignoreBuf ? 0 : 2;
|
|
14411
|
+
if (!this.shouldUpdateShape() && ((_a = this.cache) === null || _a === void 0 ? void 0 : _a.layoutData)) {
|
|
14412
|
+
const bbox = this.cache.layoutData.bbox;
|
|
14413
|
+
this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height);
|
|
14414
|
+
if (stroke) {
|
|
14415
|
+
this._AABBBounds.expand(lineWidth / 2);
|
|
14416
|
+
}
|
|
14417
|
+
return this._AABBBounds;
|
|
14418
|
+
}
|
|
14419
|
+
const textMeasure = application.graphicUtil.textMeasure;
|
|
14420
|
+
const layoutObj = new CanvasTextLayout(fontFamily, { fontSize, fontWeight, fontFamily }, textMeasure);
|
|
14421
|
+
const lines = vutils.isArray(text) ? text.map(l => l.toString()) : [text.toString()];
|
|
14422
|
+
const linesLayout = [];
|
|
14423
|
+
const bboxWH = [0, 0];
|
|
14424
|
+
let lineCountLimit = Infinity;
|
|
14425
|
+
if (heightLimit > 0) {
|
|
14426
|
+
lineCountLimit = Math.max(Math.floor(heightLimit / lineHeight), 1);
|
|
14427
|
+
}
|
|
14428
|
+
if (lineClamp) {
|
|
14429
|
+
lineCountLimit = Math.min(lineCountLimit, lineClamp);
|
|
14430
|
+
}
|
|
14431
|
+
if (typeof maxLineWidth === 'number' && maxLineWidth !== Infinity) {
|
|
14432
|
+
if (maxLineWidth > 0) {
|
|
14433
|
+
for (let i = 0; i < lines.length; i++) {
|
|
14434
|
+
const str = lines[i];
|
|
14435
|
+
let needCut = true;
|
|
14436
|
+
if (i === lineCountLimit - 1) {
|
|
14437
|
+
const clip = layoutObj.textMeasure.clipTextWithSuffix(str, layoutObj.textOptions, maxLineWidth, ellipsis, false);
|
|
14438
|
+
linesLayout.push({
|
|
14439
|
+
str: clip.str,
|
|
14440
|
+
width: clip.width
|
|
14441
|
+
});
|
|
14442
|
+
break;
|
|
14443
|
+
}
|
|
14444
|
+
const clip = layoutObj.textMeasure.clipText(str, layoutObj.textOptions, maxLineWidth, wordBreak === 'break-word');
|
|
14445
|
+
if (str !== '' && clip.str === '') {
|
|
14446
|
+
if (ellipsis) {
|
|
14447
|
+
const clipEllipsis = layoutObj.textMeasure.clipTextWithSuffix(str, layoutObj.textOptions, maxLineWidth, ellipsis, false);
|
|
14448
|
+
clip.str = (_b = clipEllipsis.str) !== null && _b !== void 0 ? _b : '';
|
|
14449
|
+
clip.width = (_c = clipEllipsis.width) !== null && _c !== void 0 ? _c : 0;
|
|
14450
|
+
}
|
|
14451
|
+
else {
|
|
14452
|
+
clip.str = '';
|
|
14453
|
+
clip.width = 0;
|
|
14454
|
+
}
|
|
14455
|
+
needCut = false;
|
|
14456
|
+
}
|
|
14457
|
+
linesLayout.push({
|
|
14458
|
+
str: clip.str,
|
|
14459
|
+
width: clip.width
|
|
14460
|
+
});
|
|
14461
|
+
if (clip.str.length === str.length) ;
|
|
14462
|
+
else if (needCut) {
|
|
14463
|
+
const newStr = str.substring(clip.str.length);
|
|
14464
|
+
lines.splice(i + 1, 0, newStr);
|
|
14465
|
+
}
|
|
14466
|
+
}
|
|
14467
|
+
}
|
|
14468
|
+
let maxWidth = 0;
|
|
14469
|
+
linesLayout.forEach(layout => {
|
|
14470
|
+
maxWidth = Math.max(maxWidth, layout.width);
|
|
14471
|
+
});
|
|
14472
|
+
bboxWH[0] = maxWidth;
|
|
14473
|
+
}
|
|
14474
|
+
else {
|
|
14475
|
+
let lineWidth = 0;
|
|
14476
|
+
let width;
|
|
14477
|
+
let text;
|
|
14478
|
+
for (let i = 0, len = lines.length; i < len; i++) {
|
|
14479
|
+
if (i === lineCountLimit - 1) {
|
|
14480
|
+
const clip = layoutObj.textMeasure.clipTextWithSuffix(lines[i], layoutObj.textOptions, maxLineWidth, ellipsis, false);
|
|
14481
|
+
linesLayout.push({
|
|
14482
|
+
str: clip.str,
|
|
14483
|
+
width: clip.width
|
|
14484
|
+
});
|
|
14485
|
+
lineWidth = Math.max(lineWidth, clip.width);
|
|
14486
|
+
break;
|
|
14487
|
+
}
|
|
14488
|
+
text = lines[i];
|
|
14489
|
+
width = layoutObj.textMeasure.measureTextWidth(text, layoutObj.textOptions, wordBreak === 'break-word');
|
|
14490
|
+
lineWidth = Math.max(lineWidth, width);
|
|
14491
|
+
linesLayout.push({ str: text, width });
|
|
14492
|
+
}
|
|
14493
|
+
bboxWH[0] = lineWidth;
|
|
14494
|
+
}
|
|
14495
|
+
bboxWH[1] = linesLayout.length * (lineHeight + buf);
|
|
14496
|
+
const bbox = {
|
|
14497
|
+
xOffset: 0,
|
|
14498
|
+
yOffset: 0,
|
|
14499
|
+
width: bboxWH[0],
|
|
14500
|
+
height: bboxWH[1]
|
|
14501
|
+
};
|
|
14502
|
+
layoutObj.LayoutBBox(bbox, textAlign, textBaseline);
|
|
14503
|
+
const layoutData = layoutObj.layoutWithBBox(bbox, linesLayout, textAlign, textBaseline, lineHeight);
|
|
14504
|
+
this.cache.layoutData = layoutData;
|
|
14505
|
+
this.clearUpdateShapeTag();
|
|
14506
|
+
this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height);
|
|
14507
|
+
if (stroke) {
|
|
14508
|
+
this._AABBBounds.expand(lineWidth / 2);
|
|
14509
|
+
}
|
|
14510
|
+
return this._AABBBounds;
|
|
14511
|
+
}
|
|
14402
14512
|
updateSingallineAABBBounds(text) {
|
|
14403
14513
|
const textTheme = getTheme(this).text;
|
|
14404
14514
|
const { direction = textTheme.direction } = this.attribute;
|
|
@@ -14420,7 +14530,10 @@
|
|
|
14420
14530
|
let width;
|
|
14421
14531
|
let str;
|
|
14422
14532
|
const attribute = this.attribute;
|
|
14423
|
-
const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontFamily = textTheme.fontFamily, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak, ignoreBuf = textTheme.ignoreBuf } = attribute;
|
|
14533
|
+
const { maxLineWidth = textTheme.maxLineWidth, ellipsis = textTheme.ellipsis, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontFamily = textTheme.fontFamily, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth, wordBreak = textTheme.wordBreak, ignoreBuf = textTheme.ignoreBuf, whiteSpace = textTheme.whiteSpace } = attribute;
|
|
14534
|
+
if (whiteSpace === 'normal') {
|
|
14535
|
+
return this.updateWrapAABBBounds(text);
|
|
14536
|
+
}
|
|
14424
14537
|
const buf = ignoreBuf ? 0 : Math.max(2, fontSize * 0.075);
|
|
14425
14538
|
const { lineHeight = (_a = attribute.lineHeight) !== null && _a !== void 0 ? _a : (attribute.fontSize || textTheme.fontSize) + buf } = attribute;
|
|
14426
14539
|
if (!this.shouldUpdateShape() && this.cache) {
|
|
@@ -14540,7 +14653,10 @@
|
|
|
14540
14653
|
var _a;
|
|
14541
14654
|
const textTheme = getTheme(this).text;
|
|
14542
14655
|
const attribute = this.attribute;
|
|
14543
|
-
const { fontFamily = textTheme.fontFamily, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, lineHeight = attribute.lineHeight || attribute.fontSize || textTheme.fontSize, ellipsis = textTheme.ellipsis, maxLineWidth, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth,
|
|
14656
|
+
const { fontFamily = textTheme.fontFamily, textAlign = textTheme.textAlign, textBaseline = textTheme.textBaseline, fontSize = textTheme.fontSize, fontWeight = textTheme.fontWeight, lineHeight = attribute.lineHeight || attribute.fontSize || textTheme.fontSize, ellipsis = textTheme.ellipsis, maxLineWidth, stroke = textTheme.stroke, lineWidth = textTheme.lineWidth, whiteSpace = textTheme.whiteSpace } = attribute;
|
|
14657
|
+
if (whiteSpace === 'normal') {
|
|
14658
|
+
return this.updateWrapAABBBounds(text);
|
|
14659
|
+
}
|
|
14544
14660
|
if (!this.shouldUpdateShape() && ((_a = this.cache) === null || _a === void 0 ? void 0 : _a.layoutData)) {
|
|
14545
14661
|
const bbox = this.cache.layoutData.bbox;
|
|
14546
14662
|
this._AABBBounds.set(bbox.xOffset, bbox.yOffset, bbox.xOffset + bbox.width, bbox.yOffset + bbox.height);
|
|
@@ -26125,6 +26241,19 @@
|
|
|
26125
26241
|
this.setAttributes({ background: this._background });
|
|
26126
26242
|
}
|
|
26127
26243
|
}
|
|
26244
|
+
preventRender(prevent) {
|
|
26245
|
+
if (prevent) {
|
|
26246
|
+
this._skipRender = -Infinity;
|
|
26247
|
+
}
|
|
26248
|
+
else {
|
|
26249
|
+
if (this.params && this.params.optimize && this.params.optimize.skipRenderWithOutRange !== false) {
|
|
26250
|
+
this._skipRender = this.window.isVisible() ? 0 : 1;
|
|
26251
|
+
}
|
|
26252
|
+
else {
|
|
26253
|
+
this._skipRender = 0;
|
|
26254
|
+
}
|
|
26255
|
+
}
|
|
26256
|
+
}
|
|
26128
26257
|
optmize(params) {
|
|
26129
26258
|
this.optmizeRender(params === null || params === void 0 ? void 0 : params.skipRenderWithOutRange);
|
|
26130
26259
|
}
|
|
@@ -26132,8 +26261,11 @@
|
|
|
26132
26261
|
if (!skipRenderWithOutRange) {
|
|
26133
26262
|
return;
|
|
26134
26263
|
}
|
|
26135
|
-
this._skipRender = this.window.isVisible() ? 0 : 1;
|
|
26264
|
+
this._skipRender = this._skipRender < 0 ? this._skipRender : this.window.isVisible() ? 0 : 1;
|
|
26136
26265
|
this.window.onVisibleChange(visible => {
|
|
26266
|
+
if (this._skipRender < 0) {
|
|
26267
|
+
return;
|
|
26268
|
+
}
|
|
26137
26269
|
if (visible) {
|
|
26138
26270
|
if (this.dirtyBounds) {
|
|
26139
26271
|
this.dirtyBounds.setValue(0, 0, this._viewBox.width(), this._viewBox.height());
|