Использование SVG-правила Evenodd для заполнения в элементе canvas

Кто-нибудь знает, если этос помощью JavaScript можно как естественным образом, так и математически реализоватьevenodd fill-rule из SVG в элементе HTML5 canvas? Ссылки на проекты, которые делают это, были бы полезны.

Ответы на вопрос(4)

жно, посмотриhttp://gpolo.awardspace.info/fill/main.html, Это скорее демо, чем что-либо другое, но оно решает эту проблему »математически".

Это действительно старый вопрос, поэтому в то время все должно было быть по-другому, но с давних времен вы можете передатьfillrule параметр кfill() метод. этоfillrule может быть"nonzero", по умолчанию, или."evenodd"

var ctx = c.getContext('2d');
drawPath();
ctx.fill();
ctx.translate(70, 0);
drawPath();
ctx.fill('evenodd');
ctx.translate(70, 0);
drawPath();
ctx.stroke();

function drawPath(){
  ctx.beginPath();
  ctx.arc(30,30,20,0,Math.PI*2);
  ctx.lineTo(60,60);
  ctx.lineTo(0,0);
  ctx.closePath();
}
<canvas id="c"></canvas>

globalCompositeOperation, Если я'я не ошибаюсь, по умолчаниюисточник-над» значение должно соответствовать SVG'sдаже странно" (в противном случае попробуйте несколько других и посмотрите, выглядит ли получающееся изображение идентичным).

 jwfearn17 мар. 2011 г., 19:38
составной! = заполнить. Это разные понятия. Глобальный составной параметр операции не должен влиять на правила заполнения
 devongovett09 нояб. 2009 г., 04:10
Это работает, если вы рисуете более одной фигуры. Но если вы рисуете один путь, это не так. Есть еще мысли?

Я задал себе тот же вопрос и наткнулсяэто Мозилла Бугрепорт.

Похоже, что это было предложено WHATWG (спецификации холста) авторами ошибок:

Крис Джонс, 2011-06-10:

Позволять's ждать документов, пока эта спецификация не выглядит солидно на Whatwg (явыложу сегодня).

Ваш ответ на вопрос