为什么复杂的 HTML Canvas 剪切路径在 Android 浏览器中不起作用？
我有一个用于给蝴蝶着色的儿童网络应用程序，它使用剪切路径来设置绘画区域的边界。
该应用程序在桌面浏览器、Opera Mobile 和 iOS 设备上运行良好，但 Android 默认浏览器似乎将剪切区域视为空，从而阻止任何后续画布操作生效。
您可以在这里找到源代码：
http://svn.apache。 org/viewvc/incubator/wookie/trunk/widgets/butterfly/
然而，主要操作是：
context.beginPath();
(lots of context.bezierCurveTo statements to draw a butterfly shape)
context.closePath();
context.stroke();
context.fillStyle = "rgb(255,255,255)";
context.fill();
context.clip();
我尝试改变顺序，例如在尝试描边或填充之前进行剪辑形状，但在这种情况下，在 Android 上它实际上不会绘制任何东西 - 再次将剪切路径视为空。
有什么想法吗？是我的问题，还是 Android webview 对剪切路径有未记录的限制？
I have a kids web application for colouring butterflies, which uses a clipping path to set the boundary of the painting area.
The application works fine on desktop browsers, Opera Mobile and iOS devices, but the Android default browser seems to treat the clipping area as empty, preventing any subsequent canvas actions from taking effect.
You can find the source code here:
http://svn.apache.org/viewvc/incubator/wookie/trunk/widgets/butterfly/
However the main actions are:
context.beginPath();
(lots of context.bezierCurveTo statements to draw a butterfly shape)
context.closePath();
context.stroke();
context.fillStyle = "rgb(255,255,255)";
context.fill();
context.clip();
I've tried changing the order around, e.g. clipping before trying to stroke or fill the shape, but in that case on Android it doesn't actually draw anything - again its treating the clipping path as empty.
Any ideas? Is it me, or is there an undocumented limitation in the Android webview on clipping paths?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
这仍然不适用于 Android 浏览器，但可以适用于 Android 版 Google Chrome。
这是一个测试页面，您可以用来查看： http://jsfiddle.net/LEpA5/
我怀疑常规的 Android 浏览器将在不久的将来被弃用，取而代之的是 Google Chrome。因此，我不会屏息以待这个问题得到解决。
This still does not work on the android browser but does work on Google Chrome for Android.
Here is a test page you can use to see: http://jsfiddle.net/LEpA5/
I suspect that the regular android browser will be deprecated in the near future in favor of Google Chrome. I wouldn't hold my breath on this getting fixed because of that.