[Webkit-unassigned] [Bug 177746] New: Stacked SVG circle with dash array rendering problem

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=177746

            Bug ID: 177746
           Summary: Stacked SVG circle with dash array rendering problem
           Product: WebKit
           Version: Safari 11
          Hardware: Macintosh
                OS: macOS 10.12
            Status: NEW
          Severity: Major
          Priority: P2
         Component: SVG
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: abdi.saeed2009 at gmail.com
                CC: zimmermann at kde.org

Created attachment 322379

  --> https://bugs.webkit.org/attachment.cgi?id=322379&action=review

Rendering problem

Really hard to describe but given the following SVG

<svg xmlns="http://www.w3.org/2000/svg" width="54" height="54" viewBox="0 0 54 54">
 <circle cx="27" cy="27" r="25" fill="#293741" fill-opacity=".75" stroke-width="4"></circle>
 <circle cx="27" cy="27" r="25" fill="transparent" stroke-width="4" stroke-dasharray="156.067915 0" stroke-dashoffset="39.0169787" class="one"></circle>
 <circle cx="27" cy="27" r="25" fill="transparent" stroke-width="4" stroke-dasharray="0 156.067915" stroke-dashoffset="0" class="two"></circle>
 <circle cx="27" cy="27" r="25" fill="transparent" fill-opacity=".75" stroke-width="4" stroke-dasharray="0 156.067915" stroke-dashoffset="0" class="three"></circle>
</svg>

With the following CSS

svg {
    width: 700px;
    height: 700px;
}
svg .one {
    stroke: green;
}
svg .two {
    stroke: yellow;
}
svg .three {
    stroke: blue;
}

I am getting the rendering issue, shown in the attachement

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20171002/2a8f3920/attachment.html>