canvas arcs: mitered and beveled joins not rendered correctly
Reported by
tkloec...@googlemail.com,
Dec 7 2016
|
||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.75 Safari/537.36 Steps to reproduce the problem: open attached html file in chrome and in a different browser (firefox or ie). A canvas image with some arcs will be shown. What is the expected behavior? What went wrong? It renders differently in chrome vs other browsers, and looks as intended in the _other_ browsers. screen shots also attached. It seems to have to do with the lineJoin property when it comes to arcs. "round" looks OK, but "miter" and "bevel" do not. Code has default, i.e. "miter". Did this work before? N/A Chrome version: 55.0.2883.75 Channel: stable OS Version: 6.1 (Windows 7, Windows Server 2008 R2) Flash Version: Shockwave Flash 23.0 r0
,
Dec 7 2016
,
Dec 7 2016
,
Dec 8 2016
,
Dec 8 2016
Tested this issue on Ubuntu 14.04, Windows-10 and Mac OS 10.12 using chrome latest stable #55.0.2883.75. By opening the file chromeCanvasBug.html observed the arc has different behavior while comparing with firefox. Note: This is a non-regression issue seen from past M35-35.0.1849.0, Hence marking it as untriaged. Thanks!
,
Jan 17 2017
Bug is in skia path rendering.
,
Jan 18 2017
Looks like a problem constructing the join between arcs. Here's a smaller test case.
,
Jan 18 2017
Here's an isolation of the bug in Skia: https://fiddle.skia.org/c/@crbug672222 The bug is created by a narrow angle formed by computing where the first arc stops and a slightly offset point where the second arc starts, though the two points are intended to be the same. The greatest amount of error is probably introduced internally where the angles are converted from radians to degrees.
,
Jan 19 2017
Safari also shows unexpected output. The bug is as described in #8. The computed end of one arc does not precisely line up with the beginning of the next, and when the line joining the two angles sharply away from either end, a mitered join is drawn. Different platforms and different browsers compute slightly different numbers. This example shouldn't be expected to draw identically everywhere. There are several workarounds for the user: simpler math, using arcTo() instead, setting the join to bevel, setting the miter limit to a smaller value.
,
Jan 20 2017
this is the last bug I reported. |
||||||
►
Sign in to add a comment |
||||||
Comment 1 by tkloec...@googlemail.com
, Dec 7 2016