How can I fix SVG rendering of ellipses?
I'm currently encountering issues with ellipse rendering (SVG) in Firefox 17.0.1 under Windows.
As a specific example, I am using the sample HTML representing the two ellipses here:
I have noticed that the right-hand ellipse appears collapsed, as a single dot in this environment. However, when rendering in Chrome under Windows, or in Firefox 15.0.1 under Ubuntu, the right-hand ellipse appears as expected, as a blue outline.
Additional System Details
- User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:15.0) Gecko/20100101 Firefox/15.0.1
Attaching image of correct render (Ubuntu).
Attaching image of incorrect render (Windows 7).
I'm not seeing this with a Windows Firefox version that runs under Wine.
Does this still happen in Firefox 18 that has been released today?
Start Firefox in Safe Mode to check if one of the extensions (Firefox/Tools > Add-ons > Extensions) or if hardware acceleration is causing the problem (switch to the DEFAULT theme: Firefox/Tools > Add-ons > Appearance).
- Do not click the Reset button on the Safe mode start window or otherwise make changes.
Thanks for the feedback.
I checked my version in the "About" window, and it reports as being up to date (18.0 on the "release" channel).
It looks like this problem does not happen in safe mode. However, in normal mode, I have disabled all extensions and plugins, and it still happens. The theme is set to "Default 18.0", with no other themes installed. I'm wondering if there are any other changes I should make, i.e. uninstalling any plugins, etc.
In Firefox Safe mode these changes are effective:
- all extensions are disabled
- the default theme is used (no persona)
- userChrome.css and userContent.css are ignored
- the default toolbar layout is used
- hardware acceleration is disabled
- plugins are not affected
Based on your last set of feedback, I have been able to determine that the issue is related to hardware acceleration.
Specifically, disabling "Use hardware acceleration when available" causes the page to reload, and the eliipse is then rendered correctly.
Is there anything else I could do about this problem? Specifically, I would like to provide any further information that would be hlepful in addressing this problem more globally, in the case that others are affected.
If it is caused by hardware acceleration then usually the only cure is to disable this feature.
You can try to toggle some Boolean layers and gfx prefs to see if that has effect (open about:config, search for /gfx|layers/ with a regular expression).
Can you file a bug in bugzilla and attach your testcase so that we can look into this further please? http://bugzilla.mozilla.org
Thanks again. It looks like this issue is being caused by the default value for the "gfx.content.azure.enabled" setting. This setting defaults to "true", and in this state, the rendering problems is happening.
Toggling it to "false" immediately fixes the rendering issue. However, as it stands, I'm under the impression that there is not an easy way to fix this on the server-side.
I will follow up on Mozilla's bugzilla tracker. Thanks again.
I've created the bugzilla issue here: https://bugzilla.mozilla.org/show_bug.cgi?id=830427
See also bug 814952: RESOLVED FIXED - Target Milestone: mozilla20
- bug 814952 - [Azure] Svg ellipse with stroke but no fill is not displayed.
(please do not comment in bug reports: https://bugzilla.mozilla.org/page.cgi?id=etiquette.html)
Verified that this is fixed in the 1.9 beta, as stated in the bugzilla ticket.