SVGnest mangles the SVG paths

mm3509 commented 6 years ago

I created an SVG with Inkscape and Illustrator. This screenshot shows the SVG in Illustrator to the right and in SVGnest to the left:

SVGnest does this for about half my paths, which are all letters expanded from the fonts Arial MT Rounded, Chalkboard SE, and Cursivestandard. I chose the "g" letter above because it is striking and I can copy-paste the SVG content:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 15.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="394.117px" height="136.135px" viewBox="0 0 394.117 136.135" enable-background="new 0 0 394.117 136.135"
     xml:space="preserve">
<path fill="#010101" d="M246.555,59.594c2.682-1.75,4.538-3.846,5.507-6.209c0.912-2.167,1.375-4.774,1.375-7.75V14.236
    c0-0.238-0.034-0.476-0.102-0.704c-0.382-1.3-1.036-2.346-1.947-3.108c-0.854-0.755-1.869-1.211-2.942-1.323
    c-1.156-0.165-2.265,0.074-3.276,0.698c-0.189,0.107-0.37,0.226-0.542,0.355c-0.788-0.449-1.604-0.878-2.448-1.285
    c-2.197-1.01-4.496-1.431-6.837-1.253c-2.253,0.173-4.393,0.79-6.306,1.804c-1.944,0.971-3.706,2.327-5.236,4.027
    c-1.523,1.691-2.699,3.586-3.503,5.653c-0.938,2.482-1.414,5.161-1.414,8.008c0.055,2.779,0.555,5.44,1.505,7.955
    c1.017,2.542,2.535,4.775,4.513,6.64c2.075,1.956,4.666,3.214,7.618,3.724c1.395,0.289,2.806,0.38,4.202,0.269
    c1.294-0.057,2.604-0.222,3.893-0.491c0.065-0.014,0.13-0.03,0.193-0.048c0.538-0.158,1.067-0.317,1.587-0.475v1.172
    c0,0.64-0.023,1.359-0.07,2.139c-0.025,0.435-0.109,0.778-0.279,1.069c-0.281,0.506-0.667,0.904-1.237,1.253
    c-0.599,0.388-1.26,0.665-2.047,0.852c-1.582,0.396-3.379,0.363-4.728,0.063c-0.58-0.134-1.093-0.267-1.467-0.378
    c-0.296-0.099-0.599-0.234-0.903-0.403c-0.064-0.036-0.131-0.069-0.199-0.1c-0.312-0.139-0.634-0.318-0.955-0.532
    c-0.056-0.037-0.113-0.072-0.171-0.104c-0.451-0.251-1.001-0.551-1.652-0.901c-0.138-0.074-0.282-0.136-0.432-0.183
    c-1.457-0.46-2.825-0.474-4.027-0.043c-0.048,0.017-0.097,0.036-0.144,0.057c-1.157,0.496-2.057,1.24-2.673,2.209
    c-0.029,0.047-0.058,0.094-0.084,0.143c-0.553,1.012-0.747,2.17-0.579,3.442c0.008,0.054,0.017,0.108,0.027,0.162
    c0.245,1.226,0.872,2.35,1.863,3.341c0.166,0.166,0.354,0.308,0.56,0.421c1.441,0.795,2.735,1.48,3.77,1.996
    c1.284,0.701,2.847,1.255,4.623,1.644c1.525,0.347,3.115,0.522,4.724,0.522c0.955,0,1.938-0.062,2.839-0.176
    c1.322-0.121,2.655-0.453,3.96-0.987C244.318,60.868,245.466,60.281,246.555,59.594z M242.394,21.9v10.685
    c-1.91,1.428-3.795,2.124-5.748,2.124c-1.32,0-2.709-0.33-4.134-0.981c-0.187-0.207-0.383-0.414-0.591-0.622
    c-0.156-0.157-0.305-0.313-0.445-0.47c-1.142-2.617-1.641-4.996-1.486-7.036c0.18-1.912,1.212-3.88,3.068-5.856l0.744-0.372
    c0.297-0.133,0.584-0.266,0.86-0.398l2.588-0.216c0.968,0.321,1.903,0.786,2.812,1.404C240.91,20.717,241.691,21.299,242.394,21.9z"
    />
</svg>

mm3509 commented 6 years ago

Following the conversation on StackOverflow I realized that this happens because of using Safari.

Jack000 commented 6 years ago

ah I see. I'm aware of the issues with Safari, will look into it when I get some time

mm3509 commented 6 years ago

Thanks. SVGnest works well in Chrome and Firefox. I discovered it last week and I got an improvement around 50% in a project for the laser cutter. Thank you very much for this, and please keep up the good work!

stuikomma commented 5 years ago

@Jack000 Maybe I can give you a pointer. I just had an issue, where Safari would drop some paths.

Look at https://github.com/Jack000/SVGnest/blob/285ae61afc33f4826bce9a356408c82d7c515bef/svgparser.js#L494

In Chrome SVGPointList works like an array, but in Safari you have to use getItem to access it. Documentation is very sparse on this, though, so I don't even know, which one is right. The spec looks like Chrome adopted the new requirement, that lists should behave more like arrays, but apparently Safari doesn't implement it that way, yet.

Using length to iterate over the list, would result in an empty array of points.

Jack000 / SVGnest

SVGnest mangles the SVG paths #71