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

Re: ViewBox position

Expand Messages
  • pilatfr
    ... Give values for width and height for your main svg
    Message 1 of 3 , Apr 30, 2004
    • 0 Attachment
      --- In svg-developers@yahoogroups.com, "couloir007" <smontague@o...>
      wrote:
      > I have possted a few questions recently, and this one is related.
      > I've gutted the code as much as I can to keep it simple:

      Give values for width and height for your main svg
      <svg width="1152" height="808" .............. by example

      or use 100% for width and height with preserveAspectRatio
      <svg width="100%" height="100%" preserveAspectRatio="xMinYMin
      meet" ....>

      In this case you need window's dimensions to calculate mouse
      position .. or use getScreenCTM ...

      Michel

      > <?xml version="1.0" encoding="iso-8859-1"?>
      > <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG
      > 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-
      > 20010904/DTD/svg10.dtd" [
      > <!ENTITY styleBG "fill:rgb(66,117,181)">
      > ]>
      > <svg id="main" viewBox="0 0 1152 808" >
      > <rect x="0" y="0" width="100%" height="100%"
      > style="&styleBG;" />
      > <svg id="map" x="25" y="107" width="850" height="674"
      > viewBox="-18019901 -14291645 36039801 28583291" >
      > <desc>World</desc>
      > <g id="Background" style="&styleBackground;">
      > <path d="M -33591996 25148489 L -33591996 -
      > 21670827 L 33934102 -21670827 L 33934102 25148489 L -33591996
      > 25148489 z"/>
      > </g>
      > <g id="Globe">
      > </g>
      > <rect id="zoomRect" x="-18019901" y="-14291645"
      > width="36039801" height="28583291" style="visibility:hidden; fill:
      > none; fill-opacity:0; stroke: red; stroke-width: 75000; stroke-
      > opacity: 1;"/>
      > </svg>
      > <rect id="mapBorder" x="25" y="107" width="850" height="674"
      > style="fill:none;stroke:black;stroke-width:1"/>
      > </svg>
      >
      >
      > My main problem at this point is where the svg locates itself in
      the
      > browser after resizing. If the browser is too wide, it stays on
      the
      > right side, leaving dead space on the left. If it is too narrow,
      it
      > stays to the bottom, leaving dead space at the top. This creates
      a
      > problem when I try to locate a onClick event in map units. If I
      can
      > keep the SVG to the left and to the top, it may elimintae this
      > problem. The bigger problem here is more complicated to explain,
      and
      > I plan on doing so later, but I am hoping for an alternative
      should
      > there be no fix for my other issue.
    Your message has been successfully submitted and would be delivered to recipients shortly.