How does one extend arrows in SVG?

I would like to be able to lengthen arrows between cells in this

without changing their

  • direction
  • colour
  • width
  • dimensions of their heads

(Just adding to the length of the arrows)

enter image description here


How would I achieve this in Inkscape?


Edit strokes in path edit mode

It is easy in Inkscape to change the length of a stroke in edit path mode (enter image description here) which will leave stroke properties including markers untouched:

enter image description here

This will only work on single strokes with predefined markers. This is not the case in the example SVG we have in the question.

Move marker objects with stroke

After ungrouping the objects we can see that strokes in the diagram are represented as multi-line objects. End markers are separate objects (triangles):

enter image description here

If we now change the stroke length by dragging the node of the stroke we can see that the end marker triangle will remain in place:

enter image description here

We will, after changing a stroke length, have to move the triangle to the appropriate position too. To change the triangle geometry we can move its path handles.

Convert objects to single strokes

Alternatively we can of course convert the line object to single strokes by selecting the start and end node of a line to then break apart the path (Shift + Ctrl + K).

Then we are able to adjust the stroke length, and add a stroke end marker property (here I chose TriangleOutM, choose any other marker to alter its shape):

enter image description here

For changing stroke and marker color see: Inkscape: Caps on lines are always black

Source : Link , Question Author : Josh Pinto , Answer Author : Community

Leave a Comment