Neil Kandalgaonkar (2011-07-14 01:40):
That's interesting. Your SVG file seems to be hand-edited, using xlink and entities so the repetitive elements, like the court, are only defined once. It's clever.
Using xlink alone shouldn't be a problem. You can see this works fine from quite some time here (all balls are defined and then used): http://commons.wikimedia.org/wiki/File:Snooker_table_drawing.svg
http://commons.wikimedia.org/wiki/File:Badminton_court_legal_bounds.svg
When rendering this at any width of 160px or above, the renderer renders it correctly, e.g.:
http://goo.gl/Onhww (160px thumbnail, upload.wikimedia.org)
However, for sizes below 160px, most of the picture is missing in the rendering:
http://goo.gl/U6RPs (159px thumbnail)
Can this be fixed?
Have you tried moving some stuff from defs to an actual image? You could at least move <g id="main"> outside (below) defs.
You could also try removing all text tags and see if it works. Some SVG renderers act funny when you scale fonts - if you set font to a very small size renders might ignore it and make characters ridiculously large or make them disappear. In this situation if you multiply (by hand or script) all text elements sizes and then scale them down with a transformation then everything will be fine. It's a total mystery to me. Fonts just seems to be badly implemented in most renderers (or was haven't tested this for a while).
Also I've just noticed that you've set width and height to "100%". Maybe setting this to some static numbers would help. It seems to prevent e.g. Opera to scale the image with CTRL +/-.
Regards, Nux.