antvis/G6

Do you want to work on this issue?

You can request for a bounty in order to promote it!

[Bug]: Edge Label Rotation Issue #6856

dtg2018 posted onGitHub

Describe the bug / 问题描述

Description When setting autoRotate: false for edge labels, the labels should remain horizontal instead of following the edge path. However, the labels still follow the edge direction instead of staying upright.

Expected Behavior

The label should always remain horizontal, regardless of the edge's angle. Current Behavior

Even when autoRotate: false, the label follows the edge path's orientation.

No response

Steps to Reproduce the Bug or Issue / 重现步骤

edge: { type: 'line', style: { badgeText: (edge: any) => edge.edgeBadgeText, lineWidth: (edge: any) => edge.edgeWidth, badgeWordWrap: true, autoRotate: false, stroke: '#7c7c7c', border: '1px solid #bdbdbd', badgeTextBaseline: 'middle', badgeFontSize: 10, badgeFill: '#727272', badgeBackground: true, badgeBackgroundFill: '#fdfdfd', badgeBackgroundFillOpacity: 1, badgeBackgroundRadius: 5, }, }, Observe that the label still follows the edge's direction instead of staying horizontal.

Version / 版本

🆕 5.x

OS / 操作系统

  • macOS
  • Windows
  • Linux
  • Others / 其他

Browser / 浏览器

  • Chrome
  • Edge
  • Firefox
  • Safari (Limited support / 有限支持)
  • IE (Nonsupport / 不支持)
  • Others / 其他

It seems that you are experiencing an issue with the autoRotate property for edge labels in antvis/G6 version 5.x. When autoRotate is set to false, the labels are expected to remain horizontal, but they are still following the edge's direction.

Here's a quick checklist to ensure everything is set up correctly:

  1. Configuration Check: Ensure that the labelCfg is correctly applied to the edge configuration. Double-check the syntax and ensure there are no typos.

  2. Version Compatibility: Make sure you are using the latest version of G6, as there might be updates or bug fixes related to this issue.

  3. Custom Rendering: If the default behavior is not as expected, consider implementing a custom label rendering function to control the label's orientation manually.

If you've verified these and the issue persists, it might be a bug. Unfortunately, I can't create an issue directly, but you can report this on the antvis/G6 GitHub repository if it's not already reported.

If you need further assistance or have additional questions, feel free to ask!

<details> <summary>🪧 Tips</summary> For further assistance, please describe your question in the comments and @petercat-assistant to start a conversation with me. </details>

posted by petercat-assistant[bot] about 2 months ago

Thank you for reporting this. Have you tried "labelAutoRotate"? It may fix the issue of the label not staying horizontal when autoRotate: false. If it doesn't work, let us know.

posted by yvonneyx about 2 months ago

⚠️ This issue has been automatically closed due to inactivity.

  • If the issue is still relevant and important to you, feel free to:
    1. Reopen with additional information
    2. Create a new issue with updated context
    3. Reference any related issues or discussions

We close inactive issues to keep our backlog manageable and focused on active issues.

Your contribution makes our project better! 🌟


⚠️ 由于长期无活动,此 issue 已被自动关闭。

  • 如果这个问题对您来说仍然重要,您可以:
    1. 重新打开并提供补充信息
    2. 创建一个新的 issue 并更新相关背景
    3. 关联相关的 issue 或讨论

为了更好地维护项目,我们需要定期清理不活跃的问题。

感谢您为开源添砖加瓦!🌟

posted by github-actions[bot] about 1 month ago

i tried labelAutoRotate and different tricks . I still not able to control edge rotate label angle any update about this issue i use g6@5.0.25 edge: { type: 'line', style: { badgeText: (edge: any) => edge.edgeBadgeText, lineWidth: (edge: any) => edge.edgeWidth, badgeWordWrap: true, autoRotate: false, labelAutoRotate: false, stroke: '#e5e5e5', badgeTextBaseline: 'middle', badgeFontSize: 10, badgeFill: '#000', badgeBackground: true, badgeBackgroundFill: '#fff', badgeBackgroundFillOpacity: 1, badgeBackgroundRadius: 5, }, },

posted by dtg2018 25 days ago

Fund this Issue

$0.00
Funded
Only logged in users can fund an issue

Pull requests