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

Re: [svg-developers] Re: viewbox question

Expand Messages
  • Andres Gonzalez
    Francis, Thanks for your response. I will try this out. -Andres
    Message 1 of 3 , Aug 5, 2009
    • 0 Attachment
      Francis,

      Thanks for your response. I will try this out.

      -Andres


      Francis Hemsher wrote:
      >
      >
      > Hi Andres,
      > Below are a facimile of two functions I use for various drag/drop
      > needs at differing svg image sizes, scales, and viewboxes. The
      > computVb() is called to set the public vars when scale and/or
      > translate changes or the values need init.
      > The second, dragMe(evt) is associated with translating the dragged
      > element.
      >
      > This may help in your application.
      > Regards,
      > Francis
      >
      > function computeVB()
      > {
      > var viewBox=mySVG.getAttribute("viewBox")
      > var vbSplit=viewBox.split(" ")
      > VbOffsetX=parseFloat(vbSplit[0])
      > VbOffsetY=parseFloat(vbSplit[1])
      > var vbWidth=parseFloat(vbSplit[2])
      > var vbHeight=parseFloat(vbSplit[3])
      > var rePx=/px/
      > var svgPixWidth=svgSpan.style.width
      > var svgPixHeight=svgSpan.style.height
      > svgPixWidth=svgPixWidth.replace(rePx,"")
      > svgPixHeight=svgPixHeight.replace(rePx,"")
      > VbRatioX=vbWidth/svgPixWidth;
      > VbRatioY=vbHeight/svgPixHeight;
      > SCALE= mySVG.currentScale;
      > TX= mySVG.currentTranslate.x;
      > TY= mySVG.currentTranslate.y;
      >
      > }
      >
      > function dragMe(evt)
      > {
      > var myX=((evt.getClientX()-TX)/SCALE)*VbRatioX+VbOffsetX
      > var myY=((evt.getClientY()-TY)/SCALE)*VbRatioY+VbOffsetY
      > }
      >
      > --- In svg-developers@yahoogroups.com
      > <mailto:svg-developers%40yahoogroups.com>, "gonzo4819" <andres@...> wrote:
      > >
      > > I have an svg map that displays a particular background. It, of
      > course, has its own particular viewbox setting. I also have some other
      > smaller objects that are tagged in separate <svg></svg> pairs which
      > have their own viewbox settings. This way I am able to scale both the
      > background (which scales both the background and all of the smaller
      > object on it) and the smaller graphic objects independently. That is,
      > I can adjust the viewbox of a smaller object and it will change size
      > wrt to the background, and I can change the overall scale of the
      > background which adjusts everything.
      > >
      > > I also can drag the graphic objects all around the background. All
      > of this seems to be working fine.
      > >
      > > However, when I am at the normal 1:1 settings for my viewboxes of
      > both the background and the draggable objects, the dragging works
      > fine. But when I adjust the background viewbox setting to reduce the
      > whole page (background and draggable objects), the mouse does not
      > track the object correctly when I drag it. That is, I can drag the
      > smaller object across the page, but the mouse advances faster than the
      > object until the mouse is no longer on the object. By the time I have
      > dragged the mouse across the whole page, the mouse is inches away from
      > the draggable object. Even when the mouse is no longer on the object,
      > it still moves with the mouse (provided of course I keep the mouse
      > button down and am actually dragging).
      > >
      > > So my question is do I have to adjust the mouse is some way when I
      > zoom in and out of my svg image? How do I adjust the mouse coordinates
      > when I have change the scaling or zooming by adjusting the viewbox
      > settings?
      > >
      > > Does my question make sense???
      > >
      > > -Andres
      > >
      >
      >
    Your message has been successfully submitted and would be delivered to recipients shortly.