Skip to content

Fix/text clip #1543

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Nov 13, 2024
Merged

Fix/text clip #1543

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
bf72849
fix: fix issue with text clip
neuqzxy Nov 12, 2024
10e48e5
feat: add exit check
neuqzxy Nov 12, 2024
eb336bd
fix: change console warn
neuqzxy Nov 13, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions common/changes/@visactor/vrender-core/fix-text-clip_2024-11-12-07-27.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
{
"changes": [
{
"packageName": "@visactor/vrender-core",
"comment": "fix: fix issue with text clip",
"type": "none"
}
],
"packageName": "@visactor/vrender-core"
}
16 changes: 12 additions & 4 deletions packages/vrender-core/src/core/contributions/textMeasure/AtextMeasure.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import type { ICanvas, IContext2d, EnvType } from '../../../interface';
import type { TextOptionsType, ITextMeasure } from '../../../interface/text';
import { DefaultTextAttribute, DefaultTextStyle } from '../../../graphic/config';
import { testLetter } from '../../../graphic/richtext/utils';
import { Logger } from '@visactor/vutils';

@injectable()
export class ATextMeasure implements ITextMeasure {
Expand Down Expand Up @@ -231,6 +232,13 @@ export class ATextMeasure implements ITextMeasure {
leftIdx: number,
rightIdx: number
): { str: string; width: number } {
// 添加退出条件，如果leftIdx和rightIdx相等，那么就返回这个字符串（理论上这时出问题了）
if (leftIdx === rightIdx) {
Logger.getInstance().warn(`【_clipTextEnd】不应该走到这里${text}, ${leftIdx}, ${rightIdx}`);
// console.warn(`【_clipTextEnd】不应该走到这里${text}, ${leftIdx}, ${rightIdx}`);
const subText = text.substring(0, rightIdx + 1);
return { str: subText, width: this.measureTextWidth(subText, options) };
}
const middleIdx = Math.floor((leftIdx + rightIdx) / 2);
const subText = text.substring(0, middleIdx + 1);
const strWidth = this.measureTextWidth(subText, options);
Expand Down Expand Up @@ -276,7 +284,7 @@ export class ATextMeasure implements ITextMeasure {
rightIdx: number
): { str: string; width: number } {
const middleIdx = Math.ceil((leftIdx + rightIdx) / 2);
const subText = text.substring(middleIdx - 1, text.length - 1);
const subText = text.substring(middleIdx - 1, text.length);
const strWidth = this.measureTextWidth(subText, options);
let length: number;
if (strWidth > width) {
Expand All @@ -285,21 +293,21 @@ export class ATextMeasure implements ITextMeasure {
return { str: '', width: 0 };
} // 如果子字符串长度小于1，而且大于给定宽的话，返回空字符串
// 先判断是不是左侧的那个字符
const str = text.substring(middleIdx, text.length - 1);
const str = text.substring(middleIdx, text.length);
// 如果到左侧的字符小于或等于width，那么说明就是左侧的字符
length = this.measureTextWidth(str, options);
if (length <= width) {
return { str, width: length };
}
// 返回leftIdx到middleIdx
return this._clipTextStart(text, options, width, middleIdx, text.length - 1);
return this._clipTextStart(text, options, width, middleIdx, text.length);
} else if (strWidth < width) {
// 如果字符串的宽度小于限制宽度
if (middleIdx <= 0) {
return { str: text, width: this.measureTextWidth(text, options) };
} // 如果已经到结尾了，返回text
// 先判断是不是右侧的那个字符
const str = text.substring(middleIdx - 2, text.length - 1);
const str = text.substring(middleIdx - 2, text.length);
// 如果到右侧的字符大于或等于width，那么说明就是这个字符串
length = this.measureTextWidth(str, options);
if (length >= width) {
Expand Down
Loading