Canvas 填充规则

当我们用到 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>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容