antvis/G6

Do you want to work on this issue?

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

Triangle大小、位置和其他图形有偏差 #5637

zzxming posted onGitHub

问题描述

根据文档上三角形的size是边长,复现链接里能看到等边三角形和正方形、圆形的宽度无法完全重合上,但相同size的正方形和圆形是可以正常重合的。 还有三角形和圆设置相同的x、y但实际显示中心好像对不齐,复现链接的例子放大能看到圆的中心要比三角形的中心更靠上。

是我对文档的理解有偏差吗

重现链接

https://stackblitz.com/edit/stackblitz-starters-x4xmmy?file=script.js

重现步骤

进入页面

预期行为

三角形与圆形的中心对齐、三角形的size

平台

  • 操作系统: [Windows]
  • 网页浏览器: [Google Chrome]
  • G6 版本: [4.3.11]

屏幕截图或视频(可选)

1712893155404

补充说明(可选)

No response


<!-- Answer -->

The issue you're encountering with the alignment and size discrepancies between triangles and other shapes like circles and squares in G6 seems to stem from how G6 calculates the center point and dimensions of these shapes. Each shape's center and size are determined by its SVG path and the specific commands used to draw it. For example, a circle's center is at its starting point, defined by the 'M' (move to) command, while a triangle's center can be inferred as the centroid of the points used to draw it.

It's important to note that the size attribute behaves differently based on the input provided (single number or an array of numbers), affecting the rendered size of the shapes. However, there doesn't appear to be a known issue or change in G6's handling of shape sizes and alignment from version 4.3.11 to the latest versions that would directly cause the discrepancies you're seeing.

If updating to the latest version of G6 does not resolve the issue, it might be indicative of a bug or an undocumented feature. In such cases, reporting this to the G6 repository could help address the problem more directly.

Understanding how G6 interprets the size attribute and calculates the center points based on the SVG path commands might offer some insight into the behavior you're observing and assist in adjusting your shapes for better alignment.

Sources

<!-- Dosu Comment Footer -->

<details> <summary>

About Dosu

</summary>

This response is meant to be useful and save you time. It is not meant to be a precise solution, but rather a starting point for your own research.

Help me be more useful! Please leave a 👍 if this is helpful and 👎 if it is irrelevant.

If you want to continue the conversation, start your reply with @dosu-bot.

</details>

posted by dosubot[bot] about 1 year ago

这个应该是 4.x 版本的缺陷,不同图形对 size 的解析不一致造成的,5.x 已经修正了该问题

posted by Aarebecca about 1 year ago

这个应该是 4.x 版本的缺陷,不同图形对 size 的解析不一致造成的,5.x 已经修正了该问题

下面是我在 5.x 官网的示例里改的,size 问题是正常了,但是中心好像还是不对 image

另外,5.x 文档的 快速开始->在原生 HTML 中使用 里的 script 标签 404 了

posted by zzxming about 1 year ago

Fund this Issue

$0.00
Funded
Only logged in users can fund an issue

Pull requests