Which browsers support svg, and how?

Discussion in 'HTML' started by JohnF, Apr 10, 2009.

  1. JohnF

    JohnF Guest

    Not sure which ng to post this question to: I'm trying
    to google info about svg (scalable vector graphics)
    image support in different browsers, and what html tag(s)
    are used to embed svg images. Seems to me like a straightforward
    question, but hard (for me) to google any straightforward info.
    Are there any reasonably easy-to-understand and reasonably
    authoritative pages that discuss this? (Or a more appropriate
    ng to post the question in?)

    Best I could glean was to use one of the following constructs.
    Suppose you have a file image.svg containing an svg rendering
    of the identical image that's in gif format in file image.gif .
    Then <img src="image.gif"> would display the gif file.
    Now, the corresponding construct for svg should (afaict) be either
    <mediaobject id="label">
    <imageobject>
    <imagedata format="SVG" fileref="image.svg"/>
    </imageobject>
    </mediaobject>
    or alternatively, maybe
    <object data="image.svg" type="image/svg+xml">
    <embed src="image.svg" type="image/svg+xml"/>
    </object>

    Lots of typing ... and it doesn't work (for me).
    Firefox (version 1.5 and later) is supposed to have some kind
    of native svg support, but doesn't seem to handle the above.
    And there's an adobe svg plugin that everybody seems to say
    is garbage, and that adobe says it no longer supports.
    Can anyone point me to a page with reliable info? Thanks,
    --
    John Forkosh ( mailto: where j=john and f=forkosh )
     
    JohnF, Apr 10, 2009
    #1
    1. Advertising

  2. JohnF

    rf Guest

    JohnF wrote:

    a question in the subject line :)

    SVG is supported by every browser I have to hand, safari, chrome, firefox,
    seamonkey, opera, *except* any version of IE. For IE you have to use VML
    which is quite similar but with a totally different syntax.

    So, basically, SVG is not viable in the wild unless you back it up with VML.

    > Not sure which ng to post this question to: I'm trying
    > to google info about svg (scalable vector graphics)
    > image support in different browsers, and what html tag(s)
    > are used to embed svg images.


    > Seems to me like a straightforward
    > question, but hard (for me) to google any straightforward info.
    > Are there any reasonably easy-to-understand and reasonably
    > authoritative pages that discuss this? (Or a more appropriate
    > ng to post the question in?)



    There is very little out there about how it's done. You have to search for
    SVG and wade through the millions of hits. Some are very worthwhile. Some
    are rubbish. But this is always the case :)

    Some of the stuff at mozilla is OK. W3schools has a tutorial that is sort of
    OK. There are a few examples.

    http://www.svgbasics.com has lots of examples.

    Beware if those things that use javascript to translate SVG to VML. They do
    sort of work but don't do everything and sometimes run like a dog. They are
    however useful for exploring the similarities between SVG and VML. excanvas
    is one. raphael is another.

    I have written my own at a higher level, up in PHP. Single calls to the
    members of a PHP class produce both SVG and VML.

    It's at proof of concept stage but does produce reasonable output. Here is
    an example of the HTML it produces, complete with all the rough edges that
    you expect from a proof of concept page. The namespace stuff and the
    stylesheet if to turn on VML in IE.

    http://barefile.com.au/test/graph.html

    You can see the SVG and VML produced. Conditional comments are used to feed
    VML to IE and SVG to the others.

    The major concept that needed proving is how to embed SVG directly into an
    HTML page. SVG is an XML application and the page it lives in is <svg> as
    you have found, not <html>. I stuff the whole lot into an object embedded
    into the HTML page, like you are trying to do. This was stolen from some
    post on some forum somewhere that I found after several hours of googling
    and have long since lost.

    Neither SVG nor VML do text very well and they do it very differently. In
    fact for Firefox you need the 3.1 beta to do it at all.

    I overlay HTML text over the top of the SVG or VML graphics. Simple and it
    works. Of course everything is absolutely positioned but that's OK as this
    page is destined for print.

    > And there's an adobe svg plugin that everybody seems to say
    > is garbage, and that adobe says it no longer supports.


    Don't. You don't want your viewers to have to download a plugin.

    > Can anyone point me to a page with reliable info? Thanks,


    No, not really.

    --
    Richard.
     
    rf, Apr 11, 2009
    #2
    1. Advertising

  3. JohnF

    JohnF Guest

    rf <> wrote:
    > JohnF wrote:
    >
    > SVG is supported by every browser I have to hand, safari, chrome,
    > firefox, seamonkey, opera, *except* any version of IE. For IE you
    > have to use VML which is quite similar but with a totally different
    > syntax. So, basically, SVG is not viable in the wild unless you
    > back it up with VML.
    >
    >> Are there any reasonably easy-to-understand and reasonably
    >> authoritative pages that discuss this?

    >
    > There is very little out there about how it's done.
    > You have to search for SVG and wade through the millions of hits.
    > Some are very worthwhile. Some are rubbish.
    > Some of the stuff at mozilla is OK. W3schools has a tutorial
    > that is sort of OK. There are a few examples.
    > http://www.svgbasics.com
    > has lots of examples.
    >
    > Beware if those things that use javascript to translate
    > SVG to VML. They do sort of work but don't do everything
    > and sometimes run like a dog. They are however useful for
    > exploring the similarities between SVG and VML. excanvas
    > is one. raphael is another.
    >
    > I have written my own at a higher level, up in PHP. Single
    > calls to the members of a PHP class produce both SVG and VML.
    > It's at proof of concept stage but does produce reasonable
    > output. Here is an example of the HTML it produces, complete with
    > all the rough edges that you expect from a proof of concept page.
    > The namespace stuff and the stylesheet if to turn on VML in IE.
    > http://barefile.com.au/test/graph.html
    > You can see the SVG and VML produced. Conditional comments are
    > used to feed VML to IE and SVG to the others.
    > The major concept that needed proving is how to embed SVG
    > directly into an HTML page. SVG is an XML application and the
    > page it lives in is <svg> as you have found, not <html>. I stuff
    > the whole lot into an object embedded into the HTML page, like
    > you are trying to do. This was stolen from some post on some
    > forum somewhere that I found after several hours of googling
    > and have long since lost.
    >
    > Neither SVG nor VML do text very well and they do it very
    > differently. In fact for Firefox you need the 3.1 beta
    > to do it at all. I overlay HTML text over the top of the
    > SVG or VML graphics. Simple and it works. Of course everything
    > is absolutely positioned but that's OK as this page is destined
    > for print.
    >
    >> Can anyone point me to a page with reliable info? Thanks,

    > No, not really.


    Thanks so much for all the very useful information, Richard.
    "Destined for print" (your words just above) was actually
    my reason for asking. I generate pages with images rendered
    as gif or png that (obviously) don't print very well, see
    http://www.forkosh.com/mathtex.html
    for examples. And I was hoping to offer
    http://dvisvgm.sourceforge.net/
    as another conversion option for better print quality.
    It's easy enough for me to program, but my simple tests
    and now your more elaborate remarks don't make it seem
    very practical for users to use (at least not at this
    point in time). Thanks again,
    --
    John Forkosh ( mailto: where j=john and f=forkosh )
     
    JohnF, Apr 12, 2009
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. David D.
    Replies:
    9
    Views:
    40,938
  2. Arne Nordmann
    Replies:
    0
    Views:
    532
    Arne Nordmann
    Jun 28, 2004
  3. Mardagg
    Replies:
    0
    Views:
    810
    Mardagg
    May 12, 2006
  4. Mardagg
    Replies:
    0
    Views:
    669
    Mardagg
    May 12, 2006
  5. milof83

    svg to svg saving problem

    milof83, Aug 18, 2006, in forum: Java
    Replies:
    1
    Views:
    833
    Roland de Ruiter
    Aug 18, 2006
Loading...

Share This Page