[whatwg] Opera SVG Re: How to use SVG in HTML5?

Charles McCathieNevile chaals at opera.com
Sun Jan 27 23:41:57 PST 2008

Hi Vlad,

as I read these, Opera is doing the right thing. Since the SVG you use  
doesn't have a viewBox attribte to say how the thing should fit, it  
creates an "initial viewport" where the size in px that the image element  
gets corresponds to a view in SVG user units. So a 300x100 img shows a  
portion of the SVG that goes from 0,0 (the top left) to 300,100 at the  
bottom right - in other words, only a part of the tiger.

If you add a viewBox then the preserveAspectRatio attribute can be used,  
and has the default value of none, which squeezes the SVG to fit the space  
you give it. Without viewBox the preserveAspectRatio has no effect, since  
there is nothing that says how what size the contents of the SVG should be.

So I don't think there is a bug at all. If you use something like inscape  
that doesn't add a viewBox, your SVG will do what your demos do. We can in  
fact change that in Opera for example by adding a default viewBox of some  
kind, but technically that is in violation of the current specs for SVG up  
to and including 1.2.

I've cc'ed Erik, our SVG lead and the hair of the SVG WG, in case he wants  
to offer anything more, or correct anything I have misunderstood.



On Sat, 26 Jan 2008 00:10:08 +1100, Vlad Alexander (xhtml.com)  
<vlad.alexander at xhtml.com> wrote:

> Hi Charles,
> Thanks for looking into this. Here you go:
> http://xhtml.com/misc/svg-img1.htm
> http://xhtml.com/misc/svg-img2.htm
> http://xhtml.com/misc/svg-img3.htm
> Regards,
> -Vlad
> http://xhtml.com
> -------- Original Message --------
> From: Charles McCathieNevile
> Date: 2008-01-24 10:47 PM
>> Hi Vlad,
>> On Fri, 25 Jan 2008 00:50:45 +1100, Vlad Alexander (xhtml.com)
>> <vlad.alexander at xhtml.com> wrote:
>> ...
>>> I tested Opera's support for SVG through the img element and it
>>> incorrectly clips the SVG image. The width and height attributes of
>>> the img element need to set the viewport for the SVG image and scale
>>> the SVG non-uniformly to fit the viewport.
>> What was your test case? Can you share it so we can check whether this
>> is a known problem or issue?
>> cheers
>> Chaals

Charles McCathieNevile  Opera Software, Standards Group
     je parle français -- hablo español -- jeg lærer norsk
http://my.opera.com/chaals   Try Opera 9.5: http://snapshot.opera.com

More information about the whatwg mailing list