jgraph / jgraph/drawio

Allow the user to specify "length" property for selected edge(s) and spacing between nodes.

Open
#5,693 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

enhancement
Dominant language
JavaScript
Stars
8.2k
Forks
1.2k
PR merge metrics
No merged PRs in 30d

Description

  • I agree to follow the Code of Conduct that this project adheres to.
  • I have searched the issue tracker for a feature request that matches the one I want to file, without success.

Is your feature request related to a problem? Please describe.

I often use AI engines to generate network diagrams of various types: flow diagrams, organization chart, concept maps, mind maps, network diagrams, tree diagrams, graph diagrams, value stream maps, argument maps, etc.

The problem with such AI-generated diagrams is that they are spaced out too much.
Draw.io can only distribute the nodes, but cannot compact them, as shown below:

Image

The diagram shows the original diagram, and the desired compact version of it.
The middle figure shows that draw.io can only re-distribute the nodes, but cannot compact them.

This is a useful feature, and should be introduced.
It can be done in two different ways:

  1. Let the user define the length of the selected edge(s).
    The shapes that are connected to these edges should get dragged to accommodate the shorter length.
  2. Let the user specify the distance between selected nodes.

Both options will allow the user to expand or shrink the diagram.

Describe the solution you'd like
As described above.

Describe alternatives you've considered
As described above.

Additional context
NA.

Contributor guide

No contributing guide indexed for this repository

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 reviewing the existing node-distribution and layout functionality in the draw.io editor to understand how selected nodes and edges are handled. Define the interaction and acceptance criteria for setting edge lengths or spacing between nodes, including how connected shapes should move, then validate the behavior against the compact diagram described in the issue.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.