Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Stroke overlap results in transparency #262

Closed
selipso opened this issue Nov 3, 2014 · 4 comments
Closed

Stroke overlap results in transparency #262

selipso opened this issue Nov 3, 2014 · 4 comments
Labels

Comments

@selipso
Copy link

selipso commented Nov 3, 2014

This is related to (or a byproduct of) #253 where two paths overlapping with each other results in their union becoming a transparent stroke, as shown below. Notice the monitor and the left ear of the alarm clock (the right ear is fine).

screen shot 2014-11-03 at 4 41 25 pm

This is more noticeable with the image below, where the strokes' intersection is rendered the same color as their background, rather than being stacked on top of each other.

screen shot 2014-11-03 at 5 30 03 pm

@GreLI GreLI added the bug label Nov 4, 2014
@GreLI
Copy link
Member

GreLI commented Feb 8, 2015

Could you provide some sample images? (Github converts loaded images to PNG.)

@paperboyo
Copy link

Hello,

This - and things disappearing completely - is the single most dangerous thing about SVGO that makes it impossible to be used without human supervision, IMHO. Here is a graphic that exhibits the problem with default SVGO config (I am really sorry for the lengthy piece of code):

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<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="118.2px" height="90.3px" viewBox="0 0 118.2 90.3" enable-background="new 0 0 118.2 90.3" xml:space="preserve">
<g>
    <g>
        <g>
            <path fill="#EE4036" d="M61.1,37.5h-12c-2.1,0-4.1,0.6-5.8,1.6V67c1.7,1,3.7,1.6,5.8,1.6h12c2.1,0,4.1-0.6,5.8-1.6V43.7H71
                C69.2,40,65.4,37.5,61.1,37.5z"/>
            <path fill="#840B17" d="M66.4,22.9l-5-6.3c-1.5-1.9-3.9-3.1-6.3-3.1c-2.5,0-4.8,1.1-6.3,3.1l-5,6.3c-2.5,3.2-2.2,7.8,0.6,10.6
                l5,5c1.6,1.6,3.6,2.4,5.7,2.4c2.1,0,4.1-0.8,5.7-2.4l5-5C68.6,30.7,68.9,26.1,66.4,22.9z"/>
            <path fill="#231F20" d="M57.8,37.5"/>
            <rect x="43.3" y="52.8" fill="#1B75BB" width="23.6" height="15.9"/>
            <path fill="#D0AD97" d="M63.3,28c0-1-0.5-1.8-1.3-2.2c-0.5-3.4-3.4-6.1-6.9-6.1c-3.6,0-6.5,2.6-6.9,6.1c-0.8,0.4-1.3,1.3-1.3,2.2
                c0,0.9,0.5,1.8,1.3,2.2c0,3.9,3.1,7,7,7c3.9,0,7-3.1,7-7C62.8,29.8,63.3,29,63.3,28z"/>
            <path fill="#754C28" d="M62.8,25.5c-0.5,0.2-1.1,0.4-1.8,0.4c0.4,0.7,0.7,1.6,0.7,2.4c0.1,0,0.2,0,0.3,0c0.3,0,0.6,0,0.8,0.1
                v-2.6C62.8,25.6,62.8,25.5,62.8,25.5z"/>
            <path fill="#754C28" d="M47.4,25.5c0.5,0.2,1.1,0.4,1.8,0.4c-0.4,0.7-0.7,1.6-0.7,2.4c-0.1,0-0.2,0-0.3,0c-0.3,0-0.6,0-0.8,0.1
                v-2.6C47.3,25.6,47.3,25.5,47.4,25.5z"/>
            <path fill="#D0AD97" d="M63.3,28c0-1-0.5-1.8-1.3-2.2c-0.5-3.4-3.4-6.1-6.9-6.1c-3.6,0-6.5,2.6-6.9,6.1c-0.8,0.4-1.3,1.3-1.3,2.2
                c0,0.9,0.5,1.8,1.3,2.2c0,3.9,3.1,7,7,7c3.9,0,7-3.1,7-7C62.8,29.8,63.3,29,63.3,28z"/>
            <path fill="#836F61" d="M57.5,35c-0.6-0.7-1.4-1.1-2.4-1.1c-1,0-1.8,0.4-2.4,1.1H57.5z"/>
            <path fill="#754C28" d="M59.3,22.9c0,1.7,1.4,3.1,3.1,3.1c0.1,0,0.2,0,0.3,0c0-0.1,0-0.2,0-0.3c0-2.1-0.8-3.9-2.1-5.3
                C59.9,20.9,59.3,21.8,59.3,22.9z"/>
            <path fill="#754C28" d="M50.8,22.9c0,1.7-1.4,3.1-3.1,3.1c-0.1,0-0.2,0-0.3,0c0-0.1,0-0.2,0-0.3c0-2.1,0.8-3.9,2.1-5.3
                C50.3,20.9,50.8,21.8,50.8,22.9z"/>
            <path fill="#754C28" d="M47.5,24.5c1.5,0.7,3.2,1.1,4.9,1.1c3.6,0,6.9-1.6,9.1-4.2c-1.4-2.1-3.7-3.5-6.4-3.5
                C51.2,18,48,20.8,47.5,24.5z"/>
            <path fill="#EE4036" d="M66.4,22.9l-5-6.3c-1.5-1.9-3.9-3.1-6.3-3.1c-2.5,0-4.8,1.1-6.3,3.1l-5,6.3c-2.5,3.2-2.2,7.8,0.6,10.6
                l5,5c1.6,1.6,3.6,2.4,5.7,2.4c2.1,0,4.1-0.8,5.7-2.4l5-5C68.6,30.7,68.9,26.1,66.4,22.9z M55.1,38.3c-5.3,0-9.6-4.3-9.6-9.6
                c0-5.3,4.3-9.6,9.6-9.6c5.3,0,9.6,4.3,9.6,9.6C64.7,34,60.4,38.3,55.1,38.3z"/>
            <path fill="#840B17" d="M55.1,37.2c-2.1,0-4.1-1-5.4-2.5h-2.2l7.6,7.6l7.6-7.6h-2.2C59.1,36.2,57.2,37.2,55.1,37.2z"/>
            <path fill="#754C28" d="M49.6,21.3c1.7,0,3.3-0.4,4.7-1h0c0,2.6-2.1,4.7-4.7,4.7c-2.6,0-4.7-2.1-4.7-4.7h0
                C46.3,20.9,47.9,21.3,49.6,21.3z"/>
            <path fill="#754C28" d="M52.9,19.8c1.7,0,2.6,3.7,0,3.7c-2.6,0-4.7-2.1-4.7-4.7h0C49.6,19.5,51.2,19.8,52.9,19.8z"/>
            <path fill="none" stroke="#840B17" stroke-width="2.0364" stroke-linecap="round" stroke-miterlimit="10" d="M53.6,44.1l0,9.5
                c0,1.2-0.9,2.2-2,2.2"/>
            <path fill="none" stroke="#840B17" stroke-width="2.0364" stroke-linecap="round" stroke-miterlimit="10" d="M56.6,44.1l0,9.5
                c0,1.2,0.9,2.2,2,2.2"/>
            <path fill="#EE4036" d="M46.8,56.3V37.8c-5,1-8.7,5.5-8.7,10.8v4.6c0,5.3,3.7,9.7,8.7,10.7v0h8.3v-7.6H46.8z"/>
            <rect x="46.6" y="55.2" fill="#EE4036" width="8.6" height="8.7"/>
            <path fill="#EE4036" d="M63.4,37.8v17.4h-8.3v8.7h8.6v-0.1c4.9-1.1,8.5-5.5,8.5-10.7v-4.6C72.1,43.2,68.4,38.8,63.4,37.8z"/>
            <path fill="#D0AD97" d="M55.1,63.9h1.8h4.7c0-3.8-2.8-7-6.5-7.6V63.9z"/>
        </g>
        <g>
            <path fill="#2E3191" d="M108.3,12.6l-5-6.3c-1.5-1.9-3.9-3.1-6.3-3.1c-2.5,0-4.8,1.1-6.3,3.1l-5,6.3c-2.5,3.2-2.2,7.8,0.6,10.6
                l5,5c1.6,1.6,3.6,2.4,5.7,2.4c2.1,0,4.1-0.8,5.7-2.4l5-5C110.5,20.3,110.8,15.8,108.3,12.6z"/>
            <path fill="#D0AD97" d="M103.5,16.4c0-3.9-3.1-7-7-7c-3.9,0-7,3.1-7,7c0,0.6,0,2.9,0,3.5c0,3.9,3.1,7,7,7c3.9,0,7-3.1,7-7
                C103.5,19.2,103.5,17,103.5,16.4z"/>
            <path fill="#754C28" d="M90.4,10.9c-1.7,0-3.3-0.4-4.7-1h0c0,2.6,2.1,4.7,4.7,4.7c2.6,0,4.7-2.1,4.7-4.7h0
                C93.7,10.5,92.1,10.9,90.4,10.9z"/>
            <path fill="#754C28" d="M95.9,10.5c-1,0-1.9-0.3-2.5-0.8c-1.7,0-3.3-0.4-4.7-1h0c0,2.6,2.1,4.7,4.7,4.7c1.5,0,2.7-0.7,3.6-1.7
                c-0.2-0.4-0.4-0.8-0.5-1.3C96.3,10.5,96.1,10.5,95.9,10.5z"/>
            <path fill="#754C28" d="M95,12c1.3,0.2,2.5,0.1,3.7,0.3c1.6,0.3,3.1,1.1,4.5,2c-0.9-2.9-3.5-5-6.7-5c-2.1,0-4,0.9-5.2,2.4
                C92.5,11.7,93.7,11.9,95,12z"/>
            <path fill="#754C28" d="M100,11c-1.1,0-2-0.4-2.7-0.9c-0.7,1-1.8,1.6-3.3,1.6c-0.3,0-0.6,0-0.9-0.1c-0.5,0.3-1.2,0.4-1.9,0.4
                c-1,0-1.8-0.3-2.4-0.7c-0.3,0.2-0.6,0.3-1,0.4c0.7,0.8,1.4,1.4,2.3,1.9l0.2,1h3.8c2.9,0,5.4-1.5,6.9-3.7
                C100.7,10.9,100.3,11,100,11z"/>
            <path fill="#754C28" d="M102.5,12.9c0,1.7,0.4,3.3,1,4.7v0c-2.6,0-4.7-2.1-4.7-4.7c0-2.6,2.1-4.7,4.7-4.7v0
                C102.9,9.7,102.5,11.3,102.5,12.9z"/>
            <path fill="#D0AD97" d="M105.4,17.7c0,1.4-1.2,2.6-2.6,2.6c-1.4,0-2.6-1.1-2.6-2.6c0-1.4,1.2-2.6,2.6-2.6
                C104.3,15.1,105.4,16.3,105.4,17.7z"/>
            <path fill="#231F20" d="M99.2,27.2"/>
            <circle fill="#836F61" cx="95.3" cy="23.7" r="0.9"/>
            <path fill="#754C28" d="M94.5,9.6c-0.4,0-0.8,0.1-1.2,0.1c-1.7,0-3.3-0.4-4.7-1h0c0,0.7,0.2,1.4,0.5,2.1
                c-1.2-0.1-2.4-0.4-3.5-0.9h0c0,2.6,2.1,4.7,4.7,4.7c1.2,0,2.3-0.4,3.1-1.2c1.5,0,2.8-0.7,3.7-1.8c0,0,0,0-0.1-0.1
                C95.8,11.3,95,10.6,94.5,9.6z"/>
        </g>
    </g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>

Thanks for looking into this!

Regards
Mateusz

@GreLI
Copy link
Member

GreLI commented Mar 15, 2015

Issue with strokes was fixed in the recent commits, other than that it's a duplicat.

@GreLI GreLI closed this as completed Mar 15, 2015
@GreLI
Copy link
Member

GreLI commented Mar 30, 2015

v0.5.1 with the fix has been just published.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants