antvis / antvis/X6

能不能从edge某一位置拖出一条新的edge,又或者对边连接边支持友好一些

Open
#3,430 10 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

type: feature 新功能
Dominant language
TypeScript
Stars
6.7k
Forks
1.9k
PR merge metrics
No merged PRs in 30d

Description

### 问题描述

目前 x6 的 edge 视图是这样的,是一个矩形框,如果是折线的话包括了很多不需要的区域

![image](https://user-images.githubusercontent.com/88022434/227684961-21268b5c-9601-4b73-b412-4eee1db83409.png)

我需要的是下图这种,只有绿色区域是 edge 视图

![image](https://user-images.githubusercontent.com/88022434/227684586-ccf4aabb-408f-4938-8c9e-006ff703d595.png)

目前这个原因会导致一些问题,比如对边连接边支持不够友好,比如我开启 allowEdge 和自动吸附,鼠标在红色
区域才能识别到高亮。还有我通过 findEdgeViewsInArea 获取到的视图也是存在问题

![image](https://user-images.githubusercontent.com/88022434/227686529-9216d903-76e4-4a37-b29a-ef0adea3a43b.png)

这是一个mxGraph的官方示例,应该也有一些人需要这些的功能
- 拖出的 edge 可以连接在另一条边的任何位置
- 可以从 edge 的中间拖出一条线

![20230325_110054](https://user-images.githubusercontent.com/88022434/227687414-54ed203b-e69a-487d-92e0-fb0048bf4a12.gif)

### 重现链接

https://jgraph.github.io/mxgraph/javascript/examples/wires.html

### 重现步骤

![image](https://user-images.githubusercontent.com/88022434/227686529-9216d903-76e4-4a37-b29a-ef0adea3a43b.png)

### 预期行为

![20230325_110054](https://user-images.githubusercontent.com/88022434/227687414-54ed203b-e69a-487d-92e0-fb0048bf4a12.gif)

### 平台

- 操作系统: [Windows]
- 网页浏览器: [Google Chrome]
- X6 版本: [2.5.7]

### 屏幕截图或视频(可选)

_No response_

### 补充说明(可选)

_No response_

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by comparing X6 edge views with the linked mxGraph wires example, then trace the allowEdge, auto-snap, and findEdgeViewsInArea behavior described in the issue. The work is done when edge hit areas match the visible edge geometry and dragging from an edge can connect to another edge or create a new edge as specified.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.