Comments (3)
It looks like the issue you're encountering with the drag-element
and its effect on the associated edge (polyline
) endpoint calculations in G6 might be due to how the framework calculates the endpoints based on the style.targetPort
and style.sourcePort
properties. These properties should reference the ports' placement
information in the nodes' ports
array, which determines the exact position of the port on the node's boundary.
To address the unexpected behavior when the target node moves below the source node, consider the following steps:
- Verify the
placement
values for the ports to ensure they are correctly set and interpreted. Incorrectplacement
values can lead to unexpected endpoint calculations. - Ensure that the graph updates the edge paths correctly when nodes or their ports move. If the edge paths are not updated or are updated incorrectly, it could cause the endpoints to be calculated incorrectly.
- Simplify your graph to include only the source and target nodes involved in the issue for easier debugging.
- Add logging or breakpoints in the code that handles node movement and edge drawing to help identify if and when the edge paths are recalculated.
For more detailed guidance on handling edge calculation with ports, you might find the element-edge-port.ts demo file in the G6 repository helpful.
If you need further assistance or have more details to share, feel free to reach out.
Sources
- packages/g6/tests/unit/elements/port.spec.ts
- packages/g6/src/behaviors/drag-element.ts
- packages/g6/tests/demos/element-edge-port.ts
About Dosu
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.
from g6.
看截图是自动吸附到距离更近的连接桩了,建议先检查一下连接桩设置是否正确。如果还是存在问题,请提供一个在线示例链接,方便排查定位问题~
from g6.
看截图是自动吸附到距离更近的连接桩了,建议先检查一下连接桩设置是否正确。如果还是存在问题,请提供一个在线示例链接,方便排查定位问题~
不好意思,在线没问题,没复现出来;我的估计问题出在我自定义node时,复写的getPortXY方法有问题,先关闭吧
from g6.
Related Issues (20)
- 隐藏显示Node和预期不一致 HOT 2
- combo聚合后样式的问题
- 紧凑树,节点展开收缩时移动鼠标,动画卡顿 HOT 9
- [V5] When brush-select clearing the state, the original state of the element is not retained HOT 2
- 【V5】 G6V5.x 版本里,state 更新后,自定义节点无法接收到回调,没有 demo 和说明。非常难实现预期效果。 HOT 7
- 【v5】求Graph数据转换(transforms option)的案例
- graph.save的数据怎么加载啊,我在使用了分组和自动布局后,g6无法使用坐标中心点缩放等其他信息
- It is recommended that the history plugin add records of specified operation types, and if not specified, all records will be defaulted
- graph.getPluginInstance('fullscreen') return undefined ,the graph is a instance of Graph HOT 5
- optimize-viewport-transform 配置后箭头问题
- V5性能问题 HOT 1
- upsert添加Image失败,请教如何添加
- 边设置箭头样式问题
- 触摸板手势交互问题(mac电脑) HOT 1
- 【V5.0.13~5.0.16】树布局,新增或删除某个节点时,整棵树都会重新展开。希望恢复到 5.13 版本前的显示方式
- edge 为 cubic-horizontal时,节点的anchorPoints不生效,导致节点拖拽时箭头显示有问题
- 【v5】自定义节点,如何在drawKeyShape时,获取原始节点数据 HOT 1
- 刚开始接触G6,发现一个小问题 HOT 2
- 【v5】自定义节点,会在未完全完成自定义节点的构造时调用drawKeyShape,导致异常
- [V5] Edge arrow offset behaves inconsistently
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from g6.