UNPKG

3.21 kBJavaScriptView Raw
1"use strict";
2Object.defineProperty(exports, "__esModule", { value: true });
3exports.getEllipsisText = exports.measureTextWidth = void 0;
4var tslib_1 = require("tslib");
5var util_1 = require("@antv/util");
6var context_1 = require("./context");
7/**
8 * 计算文本在画布中的宽度
9 */
10exports.measureTextWidth = util_1.memoize(function (text, font) {
11 if (font === void 0) { font = {}; }
12 var fontSize = font.fontSize, fontFamily = font.fontFamily, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant;
13 var ctx = context_1.getCanvasContext();
14 ctx.font = [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' ');
15 return ctx.measureText(util_1.isString(text) ? text : '').width;
16}, function (text, font) {
17 if (font === void 0) { font = {}; }
18 return tslib_1.__spreadArrays([text], util_1.values(font)).join('');
19});
20/**
21 * 获取文本的 ... 文本。
22 * 算法(减少每次 measureText 的长度,measureText 的性能跟字符串时间相关):
23 * 1. 先通过 STEP 逐步计算,找到最后一个小于 maxWidth 的字符串
24 * 2. 然后对最后这个字符串二分计算
25 * @param text 需要计算的文本, 由于历史原因 除了支持string,还支持空值,number和数组等
26 * @param maxWidth
27 * @param font
28 */
29exports.getEllipsisText = function (text, maxWidth, font) {
30 var STEP = 16; // 每次 16,调参工程师
31 var DOT_WIDTH = exports.measureTextWidth('...', font);
32 var leftText;
33 if (!util_1.isString(text)) {
34 leftText = util_1.toString(text);
35 }
36 else {
37 leftText = text;
38 }
39 var leftWidth = maxWidth;
40 var r = []; // 最终的分段字符串
41 var currentText;
42 var currentWidth;
43 if (exports.measureTextWidth(text, font) <= maxWidth) {
44 return text;
45 }
46 // 首先通过 step 计算,找出最大的未超出长度的
47 while (true) {
48 // 更新字符串
49 currentText = leftText.substr(0, STEP);
50 // 计算宽度
51 currentWidth = exports.measureTextWidth(currentText, font);
52 // 超出剩余宽度,则停止
53 if (currentWidth + DOT_WIDTH > leftWidth) {
54 if (currentWidth > leftWidth) {
55 break;
56 }
57 }
58 r.push(currentText);
59 // 没有超出,则计算剩余宽度
60 leftWidth -= currentWidth;
61 leftText = leftText.substr(STEP);
62 // 字符串整体没有超出
63 if (!leftText) {
64 return r.join('');
65 }
66 }
67 // 最下的最后一个 STEP,使用 1 递增(用二分效果更高)
68 while (true) {
69 // 更新字符串
70 currentText = leftText.substr(0, 1);
71 // 计算宽度
72 currentWidth = exports.measureTextWidth(currentText, font);
73 // 超出剩余宽度,则停止
74 if (currentWidth + DOT_WIDTH > leftWidth) {
75 break;
76 }
77 r.push(currentText);
78 // 没有超出,则计算剩余宽度
79 leftWidth -= currentWidth;
80 leftText = leftText.substr(1);
81 if (!leftText) {
82 return r.join('');
83 }
84 }
85 return r.join('') + "...";
86};
87//# sourceMappingURL=text.js.map
\No newline at end of file