Canvas 填充规则

2019-07-19  本文已影响0人  如果俞天阳会飞

当我们用到 fill(或者 clipisPointinPath )你可以选择一个填充规则,该填充规则根据某处在路径的外面或者里面来决定该处是否被填充,这对于自己与自己路径相交或者路径被嵌套的时候是有用的。

两个可能的值:
"nonzero" : non-zero winding rule, 默认值

"evenodd" : even-odd winding rule.

这个例子,我们用填充规则 evenodd

<canvas id="stash"></canvas>
<script>
  var stash = document.querySelector('#stash').getContext('2d');
  stash.beginPath();
  stash.arc(50,50,50,0,Math.PI*2);
  stash.arc(50,50,20,0,Math.PI*2);
  stash.fill("evenodd");
</script>
上一篇 下一篇

猜你喜欢

热点阅读