5

Why is this SVG image not displaying properly in Chrome or Firefox? It displays as expected in IE 9. I tested this in Firefox 5 and 6 and Chrome 13, 14, and 15--all on Windows. I'll test Linux and ChromeOS when I get home.

http://upload.wikimedia.org/wikipedia/commons/1/14/Map_of_Rhode_Island_highlighting_Bristol_County.svg

The image is supposed to look like:

enter image description here

I am only seeing the red county, and nothing else. It may have something to do with the viewport:

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     version="1.1"
     width="6416.0" height="9720.0"
     viewBox="-1856,-3363 6416,9720">...

As a note, I get this behavior for all county map SVG images on Wikipedia, but not necessarily other SVG images on Wikipedia.

2
  • Works for me on Firefox 3.6.18, Linux. Commented Aug 18, 2011 at 19:40
  • 1
    It doesn't work in later versions of Firefox, though.
    – kzh
    Commented Aug 20, 2011 at 21:19

2 Answers 2

3

Not sure what changed, but Chromium 14 & Opera 11.50 agree with current Firefox rendering (giant canvas, showing just the red country), so I'm guessing the new behavior is "correct" given the markup.

edit: Ok, I've traced this back to the nightly changeset-range on Firefox development trunk. The behavior-change was due to the top change there, for bug 547062, and the new behavior appears to be correct & as intended. See the first comment on that bug -- <clipPath> is restricted to only contain certain elements, and <g> is not included in that list. So the testcase has invalid markup.

Mechanical snail's linked validator agrees with the above -- it says: document type does not allow element "g" here.

1
  • 1
    I successfully rendered and validated it by removing the clippath element surrounding the g elements and also by changing id attributes that began with numbers. view-source:kaleb.hornsby.ws/+/img/RI.svg Thanks.
    – kzh
    Commented Aug 21, 2011 at 12:00
1

As dholbert states, other recent web browsers agree with the new Firefox rendering.

The W3C's markup validator shows the svg file as invalid, which is probably why.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .