灰色图像在基于 cordova 的应用程序中呈现扭曲

Gray images are being rendered distorted in cordova-based app

将 iPad 更新为 iOS 11 后,一位客户注意到某些 SVG 文件有时会被渲染变形。似乎只有在执行另一个渲染操作并且此元素覆盖 SVG 文件时才会发生这种情况。

还有其他人遇到过这个问题并且有解决方案吗?保留 SVG 文件会很棒。 iOS 11 之前和 Android 我从来没有遇到过这个问题。

经过一些测试,我确定这只会发生在灰色图像上。无论是 SVG 还是 PNG。

似乎有时甚至会渲染错误的图像。

它应该是什么样子:

创建对话框后:

销毁对话框后:

我的问题已经解决了。已经造成了这个 CSS class:

.desaturate {
    opacity: 0.5;
    filter: gray;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
}