Firefox 12 doesn't seem to support radial gradients on canvas
Even the demo on MDN (https://developer.mozilla.org/samples/canvas-tutorial/4_10_canvas_radialgradient.html) doesn't work in my browser - I'm wondering if there is a bug or it's something particular with my set up?
See my fiddle here: http://jsfiddle.net/zJZ4x/1/
The example works in chrome but not in firefox. The only way I can get this to render any radial gradient in FireFox is to make the inner radius (3rd parameter to createRadialGradient) 0.
Is this a known issue?
All Replies (3)
No problems here in Firefox 12 and other Firefox versions.
Start Firefox in Diagnose Firefox issues using Troubleshoot Mode to check if one of the extensions or if hardware acceleration is causing the problem (switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance/Themes).
- Don't make any changes on the Safe mode start window.
- https://support.mozilla.org/kb/Safe+Mode
Create a new profile as a test to check if your current profile is causing the problems.
See "Basic Troubleshooting: Make a new profile":
There may be extensions and plugins installed by default in a new profile, so check that in "Tools > Add-ons > Extensions & Plugins" in case there are still problems.
If the new profile works then you can transfer some files from the old profile to that new profile, but be careful not to copy corrupted files.
See:
Thanks, I've just tried on another PC running FireFox 12, and it also works, so it must be something local to my setup at home.
I'll try the steps you mentioned - thanks!
I also had this problem in Firefox 12 & 13 but this worked OK in 'safe mode'.
Disabling Hardware Acceleration in Options > Advanced > General got this working again.
So it looked like a problem with the Hardware Acceleration and my graphics driver (NVIDIA GeForce GTX 550 Ti)
Updating the driver version from 8.17.12.9573 (dated 09/02/2012) to 8.17.13.142 (dated 15/05/2012) fixed this.
Modified