Loading ...
Sorry, an error occurred while loading the content.

Scaling and Centering a SVG document

Expand Messages
  • vanjurs
    Hello, I have an SVG window on my screen that allows 800 x 600 viewing area. However, I may have SVG documents that are 1000 x 800, 1200 x 1000 and so on. How
    Message 1 of 3 , Jun 5, 2007
    • 0 Attachment
      Hello,

      I have an SVG window on my screen that allows 800 x 600 viewing area.

      However, I may have SVG documents that are 1000 x 800, 1200 x 1000 and
      so on.

      How do I scale the SVG through javascript to fit in the 800 x 600 area
      regardless of the size?

      Also, how do I center an SVG image in the viewing window?

      I am looking where to get started as I am new to SVG.

      Cheers,

      Chris
    • Bjoern Hoehrmann
      ... Could you clarify what you consider an SVG window ? You can set various attributes on the element, like viewBox, preserveAspectRatio, and width, to
      Message 2 of 3 , Jun 5, 2007
      • 0 Attachment
        * vanjurs wrote:
        >I have an SVG window on my screen that allows 800 x 600 viewing area.

        Could you clarify what you consider an "SVG window"? You can set various
        attributes on the <svg> element, like viewBox, preserveAspectRatio, and
        width, to control the sizing of the image; you can set them so that the
        image will be scaled to fit the viewing area, for example, see

        http://www.w3.org/TR/SVG11/struct.html#SVGElement

        for the details. There is no need to use scripting for this purpose, un-
        less for some restrictions imposed by your "SVG window".

        >Also, how do I center an SVG image in the viewing window?

        http://www.w3.org/TR/SVG11/coords.html#PreserveAspectRatioAttribute is
        perhaps what you are looking for, though I am not sure what it means to
        center the image in the viewing window, in this context.
        --
        Björn Höhrmann · mailto:bjoern@... · http://bjoern.hoehrmann.de
        Weinh. Str. 22 · Telefon: +49(0)621/4309674 · http://www.bjoernsworld.de
        68309 Mannheim · PGP Pub. KeyID: 0xA4357E78 · http://www.websitedev.de/
      • "~:'' ありがとうございました
        accessibility guidelines advise against using javascript. it s not needed for your use case.... http://www.peepo.co.uk should go someway to developing your
        Message 3 of 3 , Jun 10, 2007
        • 0 Attachment
          accessibility guidelines advise against using javascript.

          it's not needed for your use case....

          http://www.peepo.co.uk should go someway to developing your
          understanding.
          it scales to the window size.

          also

          http://tinyurl.com/24ht5p is well laid out
          http://en.wikipedia.org/wiki/Scalable_Vector_Graphics#Tutorials
          http://www.kevlindev.com

          ~:"

          Jonathan Chetwynd



          On 5 Jun 2007, at 23:41, vanjurs wrote:

          Hello,

          I have an SVG window on my screen that allows 800 x 600 viewing area.

          However, I may have SVG documents that are 1000 x 800, 1200 x 1000 and
          so on.

          How do I scale the SVG through javascript to fit in the 800 x 600 area
          regardless of the size?

          Also, how do I center an SVG image in the viewing window?

          I am looking where to get started as I am new to SVG.

          Cheers,

          Chris
        Your message has been successfully submitted and would be delivered to recipients shortly.