代码之家 › 专栏 › 技术社区 › Laust Deleuran

Canvas createRadialGradient()在Chrome v65中未按预期工作

radial-gradients webkit canvas javascript

Laust Deleuran · 技术社区 · 6 年前

使用时 context.createRadialGradient() 在2d上 context ,渐变未按中的预期渲染 Chrome v65 .

Screen shot

这个 example above is from MDN ,但它也发生在 some of my own code .

渐变效果很好 Firefox v59 ,Safari v11。它在Opera v52中失败了,所以可能是webkit中的一个新bug?我已经在两台不同的计算机上测试过这个问题,所以本地设置中不应该有任何原因导致它。

有没有其他人遇到过这个bug,或者更了解如何修复它?

编辑:找到 an open issue on Chromium here . 显然,这不是一个一致的bug,如果我正确阅读注释,应该在v66中修复。

1 回复 | 直到 6 年前

Laust Deleuran 6 年前

正如上面的帖子所提到的,有一个 issue in Chromium v65 . 它应该全部固定在v66中。

如果您现在确实需要修复它,最常用的方法是确保渐变不会收到相同的 x 和 y 第一个和第二个圆的参数:

var gradient = ctx.createRadialGradient(100,100,100,100,100,0); // Doesn't work
var gradient = ctx.createRadialGradient(100,100,100,100.001,100,0); // Works

您可以看到 fix in effect here . 快乐的黑客!

推荐文章

Bob · 检查UIWebView是否已在Swift中加载完毕

6 年前

Laust Deleuran · Canvas createRadialGradient()在Chrome v65中未按预期工作

6 年前

CodeGeekBot · Xcode 9.2-WebView不工作

7 年前

Mario Burga · 如何在webkit视图中显示url

7 年前

Stefan Orzu · 在Chrome中按字体大小和字体样式重置OpenType设置

7 年前

ch1maera · 在Swift、WKWebView中遍历JavaScript元素

7 年前

Pasha Skender Bergi · JFX Webview post JAVA 1.8.0_121变得更糟

7 年前

Herel Adrastel · 不推荐使用的方法是否由最新的API执行?

8 年前

Sergey · Google Chrome开发工具启动非常缓慢

9 年前

André Hikaru · 悬停时模糊/取消模糊2种不同背景

9 年前