Issue metadata
Sign in to add a comment
|
Artifacts when draw polygon with small hole
Reported by
horis.is...@gmail.com,
Jan 15
|
||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36 Steps to reproduce the problem: Draw polygon with very small hole. What is the expected behavior? Polygon with hole that is almost invisible. What went wrong? Unexpected gradient going from the hole to the polygon's edge. Did this work before? N/A Chrome version: 71.0.3578.98 Channel: stable OS Version: Flash Version: https://jsfiddle.net/7qah3j04/1/ This sample shows that the issue is somehow tied to a canvas size. Everthing works as expected on canvas with size 250, but fails on canvas with size 300.
,
Jan 15
,
Jan 15
Bisected to r568155 = df18b96b443774d232e39ead6cbd81c848b8563c = crrev.com/c/1099564 by senorblanco@chromium.org "Adjust the edge-AA tessellator maximum verb count." Landed in 69.0.3465.0 Similar: bug 908646, bug 882584.
,
Jan 16
,
Jan 17
(5 days ago)
horis.iseleznev@ Thanks for the issue. As per comment #3, this issue is similar to issue 908646. Hence merging this issue to issue 908646. Please feel free to undupe if it is not similar. Thanks..
,
Jan 17
(5 days ago)
This issue is not similar at all. Please undupe (I have no rights to do it by myself).
,
Jan 17
(5 days ago)
It's not totally unlikely that it is a dupe (it was introduced by the same commit), but we can leave that for deeper analysis to figure out.
,
Jan 17
(5 days ago)
Thanks |
|||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||
Comment 1 by horis.is...@gmail.com
, Jan 15Code: function draw(ctx) { const dx = 50; const dy = 100; ctx.fillStyle = 'red'; ctx.beginPath(); ctx.moveTo(5 + dx, 2 + dy); ctx.lineTo(7 + dx, 0 + dy); ctx.lineTo(3 + dx, 0 + dy); ctx.lineTo(0 + dx, 1 + dy); ctx.lineTo(6 + dx, 0.3 + dy); ctx.lineTo(5 + dx, 2 + dy); ctx.closePath(); ctx.moveTo(0, 0); ctx.lineTo(200, 0); ctx.lineTo(200, 200); ctx.lineTo(0, 200); ctx.lineTo(0, 0); ctx.closePath(); ctx.fill(); } function createCanvas(id, size) { const canvas = document.getElementById(id); canvas.width = size; canvas.height = size; const ctx = canvas.getContext("2d"); draw(ctx); } createCanvas('demo300', 300); createCanvas('demo200', 250); <canvas id="demo300"></canvas> <canvas id="demo200"></canvas>