美文网首页
Canvas 填充规则

Canvas 填充规则

作者: 如果俞天阳会飞 | 来源:发表于2019-07-19 09:17 被阅读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>
    

    相关文章

      网友评论

          本文标题:Canvas 填充规则

          本文链接:https://www.haomeiwen.com/subject/pngdlctx.html