Я рисую полигоны с маленьким отверстием и самопересечением и в некоторых случаях получаю артефакт .
Что я пытался решить проблему (и это сработало):
- Увеличение размера отверстия ( ссылка ).
- Уменьшение размера холста ( ссылка ).
- Удаление самопересечения ( ссылка ).
- В Mozilla все отлично работает.
Все эти исправления не подходят для моего случая.
Полный код
const selfCanvas = document.getElementById('selfIntersect');
selfCanvas.width = 300;
selfCanvas.height = 300;
const dx = 50;
const dy = 100;
const selfCtx = selfCanvas.getContext("2d");
selfCtx.fillStyle = 'red';
selfCtx.strokeStyle = 'rgba(0,0,0,0)';
selfCtx.beginPath();
selfCtx.moveTo(5 + dx, 2 + dy);
selfCtx.lineTo(7 + dx, 0 + dy);
selfCtx.lineTo(3 + dx, 0 + dy);
selfCtx.lineTo(0 + dx, 1 + dy);
selfCtx.lineTo(6 + dx, 0 + dy);
selfCtx.lineTo(5 + dx, 2 + dy);
selfCtx.closePath();
selfCtx.moveTo(0, 0);
selfCtx.lineTo(200, 0);
selfCtx.lineTo(200, 200);
selfCtx.lineTo(0, 200);
selfCtx.lineTo(0, 0);
selfCtx.closePath();
selfCtx.fill();
selfCtx.stroke();
<canvas id="selfIntersect"></canvas>
Есть ли обходной путь?