html5 - 怎么解决canvas lineWidth 沿线 居中的问题?
PHPz
PHPz 2017-04-17 11:11:40
0
1
546

globalCompositeOperation = "xor" 的情况下
画了个圆 并且给 设置了 lineWidth 结果发现 内外边距各占一半
然后问题就来了,内边距和圆本来重叠的部分触发了 xor 透明了。。。
我设置 xor 是因为有个背景色 想让整个圆透明 漏出 canvas下面的图片

PHPz
PHPz

学习是最好的投资!

reply all(1)
小葫芦

描边(stroke)的时候本来就是会将线骑在边框上画,于是会跟填充(fill)有重叠的部分,这是正常的。

你如果要用 xor 清除内容,那么就先清除,之后恢复 globalCompositeOperation 为默认值 "source-over",最后再画一个新的圆形路径用来描边。描边的时候还需要考虑 lineWidth 对实际描的区域的影响,适当的画大一点。

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!