DRAWSVG user's manual
PreviousNextContentsPDF

4.12. Editors

Editors available for the current selection are displayed in the floating menu.

All changes can be canceled and replayed with undo and redo action.

Each editor is characterized by:

This list is not exhaustive, see also showcase tool for interactive demonstrations.

Table 4.2. Editors

EditorSelectionCardinalityDescription

Edit size

Image, rectangle, svgone

Edit position and size of the element by two control points.

See also draw rectangle showcase for an interactive demonstration of how to draw a rectangle.

Edit circle

CircleoneEdit center and radius of the circle by two control points.

Edit ellipse

EllipseoneEdit center and radius of the ellipse by two control points.

Edit map

Google map imageone

Edit the map location. Display the Google map dialog panel for searching a place and browsing the map.

See also draw map showcase for an interactive demonstration of how to insert and edit a Google Map in your SVG drawing..

Edit line

Lineone

Move each point of the line.

See also draw line showcase for an interactive demonstration of how to draw a line.

Insert points

Polyline, polygonone

Insert point.

A blue dot is drawn in the middle of each segment. Move the points to be inserted.

Delete points

Polyline, polygonone

Delete point.

A red dot is drawn on each point. Click the points to be deleted.

Move points

Polyline, polygonone

Move each point of the selected element.

Edit circle arc

Circle arcone

Edit the geometry of a circle arc by three control points.

A circle arc is a path with an elliptical arc curve commands

Edit path

Pathone

Move each point and tangent point of the path.

Filter path

Pathone

Simplifies a straight line by applying a geometric filter. Smooth the geometry by turning it into bicubic.

Display the svg filter path panel near the curve.

Close path

Pathone

Close a path. Add a closepath command to the path.

Edit text

Textone

Edit text.

This function interacts directly with the drawn text. Click on the text to insert characters by typing on the keyboard. Use the icons to move cursor or delete characters.

See also draw simple text, multiline text, text editor showcases for an interactive demonstration of how to draw and edit a text.

Edit textPath offset

TextPathone

Edit the offset attribute of a textPath.

Display the svg textPath offset panel near the text.

See also drawing text on a path showcase for an interactive demonstration.

Translate xy

Circle, ellipse, polyline, polygon, rectangle, path, image, svg, text, tspan, usemany

Translate xy coordinates of elements.

This editor does not set the transform attribute.

Transform

all except tspan and textPathmany

Apply a transform matrix to elements.

The transformation matrix is defined using eight control points and four half moons rotation.

Copy

Circle, ellipse, polyline, polygon, rectangle, path, image, svg, text, tspan, usemany

Duplicate elements.

Load image file

Imageone

Load an image file, then encode it's content as a dataURI to set the href attribute of the image with the image file load dialog panel.

Load image URL

Imageone

Load the HTTP URL referenced by the image, then encode it's content as a dataURI to set the href attribute of the image with the image url load dialog panel.

Load svg

svgone

Set the content of the included svg by loading a svg document from a file, a HTTP URL or from the FreeSVG gallery.

The editor uses the same dialog than open document.

Add textPath

Pathone

Add a textPath on the selected path.

See also drawing text on a path showcase for an interactive demonstration.

Edit properties

alloneEdit properties of the selected element with the properties dialog panel.

Select group

allmanySelect parent group.

Group elements

allmany

Create a group and move selected items inside the group.

You can assign style properties to the group. Rendering a member of the group is made with the values of style properties set on the element or its group. To force the rendering with the group's style, we must unset the properties on group elements.

Ungroup elements

gone

Delete the selected group and move all its children to the group's parent item.

Transform gradient

allone

Customize the gradient of the selected shape by copying or extension and transformation of it.

see transform gradient svg panel

See also creating, using gradients showcases for interactive demonstrations.

Transform pattern

allone

Customize the pattern of the selected shape by copying or extension and transformation of it.

see transform pattern svg panel

See also creating, using patterns showcases for interactive demonstrations.

Delete

allmanyDelete selection.