Skip to content
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.

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

fix: render maxLines text correctly after render twice #3089

Open
wants to merge 1 commit into
base: next
Choose a base branch
from

Conversation

Alexzjt
Copy link
Contributor

@Alexzjt Alexzjt commented Feb 1, 2025

👀 PR includes

✨ Feature

  • New feature

🎨 Enhance

  • Code style optimization
  • Refactoring
  • Change the UI
  • Improve the performance
  • Type optimization

🐛 Bugfix

🔧 Chore

  • Test case
  • Docs / demos update
  • CI / workflow
  • Release version
  • Other ()

📝 Description

🖼️ Screenshot

Before After
iShot_2025-02-01_21 38 54 iShot_2025-02-01_21 39 18

🔗 Related issue link

#3087

🔍 Self-Check before the merge

  • Add or update relevant docs.
  • Add or update relevant demos.
  • Add or update test case.
  • Add or update relevant TypeScript definitions.

Copy link
Contributor

github-actions bot commented Feb 1, 2025

你好 @Alexzjt,非常感谢你的贡献.
为了让代码更健壮, 请根据 贡献指南 补充相应单元测试 (文档改动或其他特殊场景除外), 如果有 API 改动, 请修改 相应的文档.
同时请检查 linttest 相关 CI 是否通过, 如果失败, 请点击 [Details] 按钮查看, 并根据日志修复.

Hello, @Alexzjt, Thanks for your contribution. In order to make the code more robust, please add the corresponding unit tests, and update the docs if there are API changes.
At the same time, please check whether the CI related to lint and test passes. If the CI fails, please click [Details] button to check and repair according to the log.

@github-actions github-actions bot added the pr(fix) bug fix label Feb 1, 2025
@github-actions github-actions bot added the next 2.0-next 版本的问题 label Feb 1, 2025
Copy link

Walkthrough

This PR addresses a bug related to rendering text with a maximum number of lines (maxLines) correctly after rendering twice. It introduces a test case to ensure the functionality works as expected and modifies the calculation logic for maxLines in the base cell component.

Changes

File(s) Summary
packages/s2-core/__tests__/bugs/issue-3087-spec.ts Added a test case to verify that text with maxLines renders correctly after rendering twice.
packages/s2-core/src/cell/base-cell.ts Changed the calculation of maxLines from using Math.floor to Math.round to improve accuracy.

@@ -856,7 +856,7 @@ export abstract class BaseCell<T extends SimpleBBox> extends Group {

const maxLines = Math.max(
1,
Math.floor((displayHeight - padding) / lineHeight),
Math.round((displayHeight - padding) / lineHeight),

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The change from Math.floor to Math.round in the calculation of maxLines may affect the rendering behavior. Ensure that this change does not introduce any unintended side effects, especially in edge cases where the line height and display height are close to each other.

@@ -856,7 +856,7 @@ export abstract class BaseCell<T extends SimpleBBox> extends Group {

const maxLines = Math.max(
1,
Math.floor((displayHeight - padding) / lineHeight),
Math.round((displayHeight - padding) / lineHeight),
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

问题根因分析

  1. 数值截断逻辑矛盾
    计算逻辑:(displayHeight - padding) / lineHeight = (61 - 16) / 16 = 2.8125
  2. 条件判断逻辑缺陷
    isCustomHeight 触发条件:只有当 isCustomHeight = true 时才会执行计算,但代码中该参数默认值为 false,在二次渲染时外部传入 true,导致逻辑分歧。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
next 2.0-next 版本的问题 pr(fix) bug fix
Projects
None yet
Development

Successfully merging this pull request may close these issues.

🐛react在rerender后maxLines计算错误
1 participant