Hey guys,

if i visit http://svg-edit.googlecode.com/svn/branches/stable/editor/svg-editor.html i can see that there is a new "move" svg button, futhermore a hyperlink button appears, if you click on a svg. Just have a look at the attachment.

I spend like 2 hours to figure out, which version provides this features? Where can i download the newest version?

Thanks in advance!

Hello,

With current master branch, In IE11 when trying to select multiple elements the error "NoModificationAllowedError" occur.

To reproduce :

Draw 2 circles. Then select "Select Tool" and try to select the 2 circles.

I don't know why but works with compiled version 2.8.1 and don't works with non-compiled version

Regards,

=

Markers, say an arrowhead and star for a line, are referenced by some soft of function. Here is a sample code:

<line marker-end="url(#se_marker_end_svg_1)" 
marker-start="url(#se_marker_start_svg_1)" 
id="svg_1" y2="66.08334" x2="181.08334" 
y1="48.08334" x1="43.08334"
 stroke-width="5" stroke="#000000" fill="none"/>

I've found that I can take the SVG I created in SVG-Edit and copy it to a wiki page in fossil (http://fossil-scm.org/index.html/doc/trunk/www/index.wiki) and the SVG will display, for the most part. What happens is that the convention of identifying the marker with the attribute marker-end or
marker-start having a value of url(#se_marker_end_svg_1) does not resolve correctly.

This occurs in version 2.5.1. (I cannot get trunk to fully display when imported into fossil and therefore cannot say with certainty if the url() function within an attribute value is still used; I'm presuming it is.)

I have not been able to determine where "url()" is defined to see if there might be an option to place a fully qualified path rather than using a resolve-at-runtime function.

Is it possible to have an alternative which does not utilize the url() function in attribute values?

Started refactoring several years ago, but it never completed - most code still sits in svgcanvas.js. Dependencies and order are still maintained via comments in each file :-/

My thoughts are to use ES6 modules and traceur for this. I'll try to get a simple module ported over and using it (and update the release instructions).

I've noticed that the output always has a border.

Here's an example of what I got :

<svg width="476" height="476" xmlns="http://www.w3.org/2000/svg">
 <!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
 <g>
  <title>Layer 1</title>
  <ellipse ry="198.5" rx="198.5" id="svg_3" cy="238" cx="238" stroke-linecap="null" stroke-linejoin="null" stroke-width="0" stroke="#000000" fill="#f3f3f3"/>
 </g>
</svg>

When converting it to Android-file (using this tool: http://inloop.github.io/svg2android/ ) , I can see the border clearly

Hi,

steps to reproduce (using 2.8.1 demo):

1. select Panning tool
2. press left mouse button and move your drawing
3. while mouse button still pressed leave drawing area (e.g. move mouse to any toolbar area)
4. unpress mouse button
5. select any other tool e.g. Select tool
6. try to select any object -> won't select, instead you can still pan even though Select tool is active in toolbar
7. same for any other tool
8. press Space key -> panning ends, tool functions restored

Under IE,after running the "embedapi.html" file,click the "Load example" button and draw something.
After completion ,click the "Save data" button ,at this time this browser just crashed.

I don't know what to do,do you know?

1. Make a polygon using the path tool
2. Double-click the path so the individual points are selected on the path
3. Try to move a node in the path.

Observed: The path node tries to move but jitters back to its starting point. If you double-click the point to turn the segment into a curve, then the path node is movable. This is a horrible workaround.

Some files have old-style windows line endings such as ext-imagelib.js. We should clean these up.

Should I be concerned about compatibility going forwards of SVG Edit?

browser.js:59 SVGPathSeg is deprecated and will be removed in Chrome 48. See https://www.chromestatus.com/feature/5708851034718208.ww.chromestatus.com/feature/5708851034718208.

jquery.js:3 SVG's SMIL animations (, , etc.) are deprecated and will be removed. Please use CSS animations or Web animations instead.

The SVGPathSeg interface was removed from the SVG specification, and as a result, Chrome no longer supports it, starting with version 48:

https://www.chromestatus.com/feature/5708851034718208

This change renders SVG-Edit completely unusable.

We have been using this nice workaround by @progers at our company:

https://github.com/progers/pathseg

Just add pathseg.js to your list of includes.

(The better fix is probably to update to the new Paths API he points out in the README there.)

In the 2.8 release, all icons are broken in Safari due to a re-definition of xmlns. I bisected this bug down to b1f88d2.

Open SVG-edit with the SVG file pasted below and then drag-select a bunch of the paths. You can see that Chrome has a hard time rendering the select boxes and keeping up with the mouse. No similar problem exists in Firefox which keeps up just fine.

SVG-Edit currently uses jQuery 1.7

version 1.8 or better 1.9 would be start towards jQuery 2.x, which is current.

E.g. jQuery.andSelf could be replaced with jQuery.addBack

The majority of SVG Edit works when I try to run it locally. Some few requests though fail due to cross origin requests when trying to make use of jQuery.

XMLHttpRequest cannot load file:///C:/Dev/svg-edit-2.8.1/images/svg_edit_icons.svg. Cross origin requests are only supportedf or protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.send @ jquery.js:4

Is there a way to run this without the overhead of a webserver?

I didn't like the way SVG Edit looked so I made a new theme for it. It is largely based on Photoshop CC (2015) in. Any interest in this becoming the new face of SVG Edit? If so, I'll get a pull request together sometime soon.

Hi,
first, thank you for this project, I would really like to use it as a basis and extend it.
At first, I thought this is snap-to-grid related, but it is not.

Tested in Firefox(43.0) and Chromium(47.0.2526.106) (Linux Mint)
SVG-Edit Version: 2.8.1(release)

This is the same issue as this:
https://code.google.com/p/svg-edit/issues/detail?id=1268&q=label%3APriority-Medium&colspec=ID%20Type%20Status%20Priority%20NeededFor%20Browser%20Owner%20Summary

and

#5

When a .png file is imported, this problem does not occur. It only happens with .svg.
It also may be zoom/sanitize related, because the SelectorGroup moves in the same direction, but farther:
http://i.imgur.com/hNsGklk.gifv

Alert box is overflow and not selectable OK or Cancel on Mobile Chrome. Please switch these 2 to mobile friendly version. Other than that, the software is great.

Hi, $.browser is used by jquery.bbq.min.js.

This seems to a very old dependency ... is this still needed at all ?

jQuery 2.x (jquery-migrate) complains about this...

Can't set font-size in SVG-EDIT 2.8
The font-size label has been set to display:none.

Issue: The rubberband box is not placed properly for imported SVG images in the editor
How to reproduce: Import an SVG image. click on the image. The rubber band box around the image is not properly coming. its left and top is not coming properly.

It is not obvious that you have to drag the mouse to open context menus on the left vertical control panel. For the first time when you click on Shapes for example, a menu opens up. Next time you have to drag for the same menu to open. There should be a popup that explains this behaviour because it is not a usual GUI behaviour.

Even a few lines would be a start.
From a casual test, it appears (?) that one can simply clone the repo and then open svgedit/editor/svg-editor.html
Must one "make" before the editor is fully usable?

Hello,

With current master branch, selecting multiples element in firefox with zoom don't work.

Step to reproduce :

1. Draw 2 circles. Then select "Select Tool" and try to select the 2 circles.

Works fine :

2. Change zoom. Then select "Select Tool" and try to select the 2 circles.

it doesn't work :

I don't know why but works with compiled version 2.8.1 and don't works with non-compiled version

Regards,

When drag-selecting ("multiselect" mode), the intersection checking should use the SVGElement.getIntersectionList() API method [1]. Blink/Webkit now support it.

[1] http://www.w3.org/TR/SVG/struct.html#__svg__SVGSVGElement__getIntersectionList
[2] https://bugs.webkit.org/show_bug.cgi?id=11274

i want make the element in canvas had been selected which i only use the element id ,could i do this?

Is there a way to include filters (other than shadow and editing the svg), if not, should we add one ?

Launching https://github.com/SVG-Edit/svgedit "Try SVG-edit here" works fine. When I select from the menu to "SVG-edit Home Page", I get redirected to https://code.google.com/p/svg-edit/ which has directions to go to https://github.com/SVG-Edit/svgedit.

Should that pointer to Google Code be removed?

Draw a squiggle with the pencil tool.
Rotate it.
Hit reorient path.

SVG Edit is now locked up.

Using the demo version still hosted from the Google Code site it works.

Issue: The keypresses "Z" and "Y" trigger undo/redo respectively BUT Z is also tied to Zoom, so while pressing Z you get both actions (undo & zoom) triggered. So, when you go to hit the zoom key, your last action is undone!

I fixed this issue by changing this:

{sel:'#tool_undo', fn: clickUndo, evt: 'click', key: ['Z', true]},
{sel:'#tool_redo', fn: clickRedo, evt: 'click', key: ['Y', true]},

To

{sel:'#tool_undo', fn: clickUndo, evt: 'click'},
{sel:'#tool_redo', fn: clickRedo, evt: 'click'},

Found in svg-editor.js around line 4020 (when not using compiled assets).

Undo / Redo can still be triggered by pressing [modKey] + Z or [modKey] + Y respectively so you're not losing anything with this change.

Ellipses require the rx/ry attribute and the "0" value has a specific meaning (do not display). Removing these attributes in cleanupElement results in invalid svg.
[https://www.w3.org/TR/SVG/svgdtd.html](svg DTD)
[https://www.w3.org/TR/SVG/shapes.html#EllipseElement](svg doc)

If I select import image, and select an SVG, the dragger looks the wrong size, and you rotate drag it properly, as though the transform or size or something is wrong on it.

The main content area is clipped along compositing borders (see screenshot). I think this may be a bug in Safari.

On Chrome 42.0.2311.135 (64-bit), if I select 'open svg' it seems to load in the svg, but continues to say 'loading image, please wait'. It doesn't seem to do this in Opera

jquery.contextMenu.js is version 1.01 - 4 years old
while https://github.com/swisnl/jQuery-contextMenu
shows now version 2.0.1
It appears to have been continuously maintained...

does the new version work as a drop-in replacement ?

can anyone estimate how hard it would be to get it to work (if not) ?

whenever I try and zoom using the scroll gesture on the apple magic mouse, SVG-edit exaggerates the amount that I want to scroll and i have to keep re-finding my image.

can you add a scroll-sensitivity adjustment?

A modular system to build extensions so others could contribute more easily.

Would it be possible to add an option for path simplification with the freehand pencil tool to reduce the number of segments in the drawn path? When using the pencil tool it currently produces a large amount of data which makes the file size much larger. Simplifying the path makes for a smoother line and still follows closely to what was drawn while also reducing the amount of data for the path. Inkscape has a feature similar to this in the “Path > Simplify” option from the menu bar. If a feature like this could be added, perhaps a selection for the amount of simplification could be chosen down in the bottom toolbar along with the stroke width and opacity options.

I found a demo of some JavaScript code for path simplification which shows what I am referring to:

http://paperjs.org/examples/path-simplification/

Hi the Author,

It's seem svgedit is not support text editor as paragraph so pls support it if you can.

Thank you!

Here's an example svg

<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:se="http://svg-edit.googlecode.com">
 <!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->
 <g>
  <title>Layer 1</title>
  <polyline se:connector="svg_6 svg_8" fill="none" stroke-width="5" stroke="#000000" points="182.6628875732422,166.5 180.1041259765625,203 177.5453643798828,239.5" id="svg_10"/>
  <polyline se:connector="svg_4 svg_5" fill="none" stroke-width="5" stroke="#000000" points="458.5787048339844,79.5 473.9290466308594,160 489.2793884277344,240.5" id="svg_9"/>
  <ellipse id="svg_1" ry="85.5" rx="95" cy="196.5" cx="327" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <ellipse id="svg_2" ry="65" rx="66.5" cy="330" cx="180.5" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <ellipse id="svg_3" ry="62" rx="53" cy="139" cx="107" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <ellipse id="svg_4" ry="32" rx="37" cy="45" cx="452" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <ellipse id="svg_5" ry="27.5" rx="33" cy="270.5" cx="495" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <rect id="svg_6" height="133" width="211" y="31" x="82" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <rect id="svg_7" height="76" width="180" y="302" x="308" stroke-width="5" stroke="#000000" fill="#FF0000"/>
  <rect id="svg_8" height="196" width="289" y="242" x="26" stroke-width="5" stroke="#000000" fill="#FF0000"/>
 </g>
</svg>

The poly line connectors work a treat until you navigate away and back, When you do the line is broken and treated as a normal line but moving the attached objects stops updating it.

If however you take the raw svg as above and paste it into the source in svg edit it will start working again.

The currently svg-edit release is served off http:
http://svg-edit.github.io/svgedit/releases/svg-edit-2.8/svg-editor.html

We should switch this to https but two image library urls need to be switched to https in editor/extensions/ext-imagelib.js. I verified both of these urls can be served over https.

Once this is fixed, README.md can be updated to point to the https version of svg-edit.

If you change the icon size to small for the controls then the left hand panel has a gap before the ruler is drawn.

SVG Edit could use a fullscreen button. I have this working in my development copy of the app, complete with icons as needed. I copied the existing code formatting where possible and put the icon right after the Undo button in the top toolbar.

My question is this: is it ok to include screenfull in SVG Edit? It's covered under an MIT license.

If this is ok, I can submit a pull request later.

I'm running SVG-Edit locally. Previously the Save function did nothing, so I added ext-server_opensave.js to the extensions list. Now the app crashes on a bad memory access when Save is pressed. I'm running IE10 on Windows 7.

Local file save/load is clunky. We should allow loading/saving to Google Drive and Microsoft OneDrive directly.

Chromium recently removed the PathSeg interface[1] which breaks svg-edit. This was recently removed from the spec as well [2]. I took a quick look at the svg-edit code and think we can patch it up nicely to work without path segs. Would you accept pull requests for this?

[1] https://groups.google.com/a/chromium.org/d/msg/blink-dev/EDC3cBg9mCU/OvElJgOWCgAJ
[2] https://lists.w3.org/Archives/Public/www-svg/2015Jun/0044.html

https://rawgit.com is a free service by Ryan Grove for serving https requests directly from tip-of-tree. There's no SLA for this service and Ryan could always replace svg-edit with malware, but I think these concerns are pretty minimal for a project like svg-edit.

Here's a demo:
https://rawgit.com/SVG-Edit/svgedit/master/editor/svg-editor.html

Rawgit isn't behind a CDN (but there is a CDNified link with cache:forever set at https://cdn.rawgit.com/SVG-Edit/svgedit/master/editor/svg-editor.html) so we should keep that in mind.

I think it makes sense to add a tip-of-tree link in somewhat smaller text below the latest release. Wdyt?

Right now there is Openclipart Import in the Library extension which is default. Next, how about adding an Openclipart Export function.

The simplest way to do this is to send an email to [email protected] with the SVG as an attachment, and the file will be imported to Openclipart automatically.

Is anyone interested in this?

Oh, here is one way to do this:

https://github.com/daleharvey/svg-edit/tree/master/extras/server-save

Since Google code is closing. Can this be considered the new home of svg-edit?