SVG: Nested Groups - snap.svg needs flattened groups
cojarbi opened this issue · 15 comments
I get this when loading an svg or inkscake svg
Same file in LW1 works ok.
LW2 copy.svg.txt
LW2P copy.svg.txt
TypeError: Cannot read property 'position' of undefined
(http://openhardwarecoza.github.io/LaserWeb2/js/fileprep.js on line 72)
Only paths. Convert everything to paths, and remove non path objects.
Thats becoming a faq (;
This is a cnc after all (;
On 19 Apr 2016 06:20, "Ariel Yahni" notifications@github.com wrote:
I get this when loading an svg or inkscake svg
Same file in LW1 works ok.LW2 copy.svg.txt
https://github.com/openhardwarecoza/LaserWeb2/files/225226/LW2.copy.svg.txt
LW2P copy.svg.txt
https://github.com/openhardwarecoza/LaserWeb2/files/225227/LW2P.copy.svg.txtTypeError: Cannot read property 'position' of undefined
(http://openhardwarecoza.github.io/LaserWeb2/js/fileprep.js on line 72)—
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub
#29
I'm going to hit the computer with a hammer. Inkscape says they all are paths with N amount of nodes
File is fine, contains only paths.
The paths are wrapped by two <g> <g>...paths </g> </g> removed one and then it works.
@Cinezaster good to know that I'm not mad. How can we prevent that from becoming a problem or why is Inkscape doing that?
It looks like a known issue: http://wiki.inkscape.org/wiki/index.php/Save_Cleaned_SVG
I only know how you can prevent this in illustrator.
We should find a fix for this in the code, i'm already looking at it.
Problem is that different groups can have different translations which causes problems (in laserweb).
Save_Cleaned_SVG is the best option for now.
How do you prevent it with illustrator? It's great if you can fix it on the code, that way you prevent futures cases like mine or and thus giving a great experience to the user
In inkscape - you can save as a plain SVG (second item on the drop list when saving as). See if that helps. I've done a couple tests, but couldn't get the double g's.
From what I understand, we can run the svg through flatten.js (https://gist.github.com/timo22345/9413158) to fix the transform groups... Tricky one
In illustrator select a group and then degroup. Do this for all groups!
Ok i tried out flatten.js but still have a <g> inside a <g>
We now get this...
Further digging: Paths that work have G as a parent. Paths that dont, have a M as a parent
... causes path = path.transform(path.parent().transform().global); on line 124 of svg-renderer.js to freak out
I'm seriously considering moving back to the SVGReader library we used in LaserWeb1 - snap.svg has some funnies :(
Right, svgreader.js in place - closing this issue for now.
I'll be adding some enhancements for SVG soon again (per color power/speed etc) but for now what I have in is a direct replacement for what we had with snap.svg