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

Re: [svg-developers] Re: Zoom In Out wih SVG

Expand Messages
  • yannick.bochatay@free.fr
    no API, countless global variables, browser sniffing, etc, to my mind SVGPan is not a good choice. But it s short and standalone so it can help to understand
    Message 1 of 12 , Jun 7, 2012
    • 0 Attachment
      no API, countless global variables, browser sniffing, etc, to my mind SVGPan is not a good choice.
      But it's short and standalone so it can help to understand how a zoom can work.
      Yannick


      ----- Mail original -----
      De: "jamesd" <jcdeering1@...>
      À: svg-developers@yahoogroups.com
      Envoyé: Mercredi 6 Juin 2012 22:33:37
      Objet: [svg-developers] Re: Zoom In Out wih SVG







      SVGpan works extremely well. The only thing is that your map should be in an iframe to avoid cross SVG confusion.

      http://code.google.com/p/svgpan/

      James

      --- In svg-developers@yahoogroups.com , "barkha" <barkha_crazzyworld@...> wrote:
      >
      > Dear All,
      >
      > I want to Implement zoom-in and out of the static map background and all sub entities(that are placed on static map background on another layer) by point-and-click on the map. Point clicked is centered as part of the zoom operation
      >
      > Regards,
      > Barkha
      >
    • Erik Dahlstrom
      ... The SVGPan library has some bugs that needs to be patched in to make it actually work well, see e.g http://code.google.com/p/svgpan/issues/detail?id=6 for
      Message 2 of 12 , Jun 7, 2012
      • 0 Attachment
        On Wed, 06 Jun 2012 22:33:37 +0200, jamesd <jcdeering1@...> wrote:

        >
        > SVGpan works extremely well. The only thing is that your map should be
        > in an iframe to avoid cross SVG confusion.
        >
        > http://code.google.com/p/svgpan/
        >
        > James

        The SVGPan library has some bugs that needs to be patched in to make it
        actually work well, see e.g
        http://code.google.com/p/svgpan/issues/detail?id=6 for how badly it's
        broken.

        Also most people probably expect to be able to zoom and pan without having
        a mouse (or a scrollwheel mouse even). There's no support for touch events
        in this library.

        --
        Erik Dahlstrom, Core Technology Developer, Opera Software
        Co-Chair, W3C SVG Working Group
        Personal blog: http://my.opera.com/macdev_ed
      • jamesd
        All I can say is that SVGpan is working extremely well for me. It allows the user to scroll the image on the trackpad without a mouse, I assume on a tablet
        Message 3 of 12 , Jun 7, 2012
        • 0 Attachment
          All I can say is that SVGpan is working extremely well for me. It allows the user to scroll the image on the trackpad without a mouse, I assume on a tablet you're finger swipe will do the same thing (Is that what you mean by touch events?).

          --- In svg-developers@yahoogroups.com, "Erik Dahlstrom" <ed@...> wrote:

          > The SVGPan library has some bugs that needs to be patched in to make it
          > actually work well, see e.g
          > http://code.google.com/p/svgpan/issues/detail?id=6 for how badly it's
          > broken.
          >
          > Also most people probably expect to be able to zoom and pan without having
          > a mouse (or a scrollwheel mouse even). There's no support for touch events
          > in this library.
          >
          > --
          > Erik Dahlstrom, Core Technology Developer, Opera Software
          > Co-Chair, W3C SVG Working Group
          > Personal blog: http://my.opera.com/macdev_ed
          >
        • jamesd
          All I can say is that SVGpan is working extremely well for me. It allows the user to scroll the image on the trackpad without a mouse, I assume on a tablet
          Message 4 of 12 , Jun 7, 2012
          • 0 Attachment
            All I can say is that SVGpan is working extremely well for me. It allows the user to scroll the image on the trackpad without a mouse, I assume on a tablet you're finger swipe will do the same thing (Is that what you mean by touch events?).

            --- In svg-developers@yahoogroups.com, "Erik Dahlstrom" <ed@...> wrote:

            > The SVGPan library has some bugs that needs to be patched in to make it
            > actually work well, see e.g
            > http://code.google.com/p/svgpan/issues/detail?id=6 for how badly it's
            > broken.
            >
            > Also most people probably expect to be able to zoom and pan without having
            > a mouse (or a scrollwheel mouse even). There's no support for touch events
            > in this library.
            >
            > --
            > Erik Dahlstrom, Core Technology Developer, Opera Software
            > Co-Chair, W3C SVG Working Group
            > Personal blog: http://my.opera.com/macdev_ed
            >
          • Erik Dahlstrom
            Panning with the SVGPan library seems to works in all the desktop browsers sure, but zooming doesn t work at all in Opera or IE because the library is doing
            Message 5 of 12 , Jun 8, 2012
            • 0 Attachment
              Panning with the SVGPan library seems to works in all the desktop browsers
              sure, but zooming doesn't work at all in Opera or IE because the library
              is doing browser sniffing and assuming the wrong things. And it's likely
              that the rate of zooming is different in the different browsers too, if
              that matters (see e.g
              http://stackoverflow.com/questions/5527601/normalizing-mousewheel-speed-across-browsers).

              There are no listeners registered for touch events, so I'd be surprised if
              the panning worked as intended on tablets or mobile phones, and I'd be
              even more surprised if there was something like scrollwheel emulation on
              such devices, so probably you won't have the ability to zoom with SVGPan
              unless you hack the library yourself.

              To conclude, the SVGPan library works to its full extent only if:
              1) the user has a mouse
              2) the user is using a webkit- or mozilla-based browser

              These shortcomings can of course be fixed.

              If you want something that abstracts away the ways you trigger zooming and
              panning, D3.js has some behaviour helper methods to help you with that,
              see https://github.com/mbostock/d3/blob/master/src/behavior/drag.js and
              https://github.com/mbostock/d3/blob/master/src/behavior/zoom.js. An
              example of it being used: http://bl.ocks.org/1182434 - works fine on
              tablets as well as normal desktop systems. Or for a simpler example,
              https://github.com/mbostock/d3/blob/master/examples/zoom-pan/zoom-pan-transform.html.


              On Thu, 07 Jun 2012 20:14:50 +0200, jamesd <jcdeering1@...> wrote:

              > All I can say is that SVGpan is working extremely well for me. It allows
              > the user to scroll the image on the trackpad without a mouse, I assume
              > on a tablet you're finger swipe will do the same thing (Is that what you
              > mean by touch events?).
              >
              > --- In svg-developers@yahoogroups.com, "Erik Dahlstrom" <ed@...> wrote:
              >
              >> The SVGPan library has some bugs that needs to be patched in to make it
              >> actually work well, see e.g
              >> http://code.google.com/p/svgpan/issues/detail?id=6 for how badly it's
              >> broken.
              >>
              >> Also most people probably expect to be able to zoom and pan without
              >> having
              >> a mouse (or a scrollwheel mouse even). There's no support for touch
              >> events
              >> in this library.
              >>
              >> --
              >> Erik Dahlstrom, Core Technology Developer, Opera Software
              >> Co-Chair, W3C SVG Working Group
              >> Personal blog: http://my.opera.com/macdev_ed
              >>
              >
              >


              --
              Erik Dahlstrom, Core Technology Developer, Opera Software
              Co-Chair, W3C SVG Working Group
              Personal blog: http://my.opera.com/macdev_ed
            • Jason Barnabas
              ... I don t know if you found the answer you were looking for, but I found: http://www.carto.net/svg/samples/viewbox.shtml I like this site and have found
              Message 6 of 12 , Jun 9, 2012
              • 0 Attachment
                > Dear All,
                >
                > I want to Implement zoom-in and out of the static map background and all sub
                >entities(that are placed on static map background on another layer) by
                >point-and-click on the map. Point clicked is centered as part of the zoom
                >operation
                >
                > Regards,
                > Barkha

                I don't know if you found the answer you were looking for, but I found:
                http://www.carto.net/svg/samples/viewbox.shtml

                I like this site and have found other useful tutorials there.
                ____________________________________________________________


                I must be travelling,
                Jason


                tc+ ?23 ?mgt mt tne ?t20 t4++ ?t5 ?tp tg+ ?th ?to
                ru- ge++ 3i c++ jt- au+ ls pi+ ta+ he+

                kk++ hi+ as+ va+ dr ?ith vr ne so+ zh vi da sy
              • yannick.bochatay@free.fr
                I ve worked on a library with zoom and pan features : http://ybochatay.fr/CariSVG/ It works fine but I won t maintain it : I m completely rewriting it with a
                Message 7 of 12 , Jun 9, 2012
                • 0 Attachment
                  I've worked on a library with zoom and pan features : http://ybochatay.fr/CariSVG/
                  It works fine but I won't maintain it : I'm completely rewriting it with a wrapper (instead of working with prototypes), a better API and in a way to get autocompletion in Eclipse.
                  Here's a first draft for mousewheel zoom, marquee zoom, magnifying glass and more : http://ybochatay/radar
                  It works on all major browsers. The only problem is... it's not ready yet !
                  Yannick



                  ----- Mail original -----

                  De: "Jason Barnabas" <jtbarnabas@...>
                  À: svg-developers@yahoogroups.com
                  Envoyé: Samedi 9 Juin 2012 14:40:03
                  Objet: Re: [svg-developers] Zoom In Out wih SVG








                  Dear All,

                  I want to Implement zoom-in and out of the static map background and all sub
                  entities(that are placed on static map background on another layer) by
                  point-and-click on the map. Point clicked is centered as part of the zoom
                  operation

                  Regards,
                  Barkha

                  I don't know if you found the answer you were looking for, but I found:


                  http://www.carto.net/svg/samples/viewbox.shtml

                  I like this site and have found other useful tutorials there.
                  __________________________________________________________

                  I must be travelling,
                  Jason

                  tc+ ?23 ?mgt mt tne ?t20 t4++ ?t5 ?tp tg+ ?th ?to
                  ru- ge++ 3i c++ jt- au+ ls pi+ ta+ he+

                  kk++ hi+ as+ va+ dr ?ith vr ne so+ zh vi da sy
                • barkha
                  Thanks all for replying, Now i m stuck with the below mentioned scenario, Zoom in out functionality without panning is done by playing with Viewbox coordinates
                  Message 8 of 12 , Jul 23 4:16 AM
                  • 0 Attachment
                    Thanks all for replying,

                    Now i'm stuck with the below mentioned scenario,

                    Zoom in out functionality without panning is done by playing with Viewbox coordinates of root element of SVG,

                    Drag and Drop of elements(From HTML Div to SVG Map and also from SVG Map to SVG Map) is implemented without zoom in.

                    Now i want to zoom my svg map (where i'm placing elements by drag and drop) along with drag and drop of elements with the above mentioned possibilities of drag drop.so my question is,Is it possible/feasible to drag and drop elements while map is zoomed in?and if it is correct approach then how to get correct position of cursor in map while drop event of element?

                    Regards,
                    Barkha
                  • yannick.bochatay@free.fr
                    Hi Barkha, the getScreenCTM method will help you (http://www.w3.org/TR/SVG/types.html#__svg__SVGLocatable__getScreenCTM). I wrote a little example :
                    Message 9 of 12 , Jul 23 4:59 AM
                    • 0 Attachment
                      Hi Barkha,
                      the getScreenCTM method will help you (http://www.w3.org/TR/SVG/types.html#__svg__SVGLocatable__getScreenCTM).
                      I wrote a little example : http://jsfiddle.net/ybochatay/aUYay/
                      by clicking in the svg area you'll get the coordinates of your mouse relatively to the specified viewbox.
                      Regards,
                      Yannick

                      ----- Mail original -----
                      De: "barkha" <barkha_crazzyworld@...>
                      À: svg-developers@yahoogroups.com
                      Envoyé: Lundi 23 Juillet 2012 13:16:26
                      Objet: [svg-developers] Re: Zoom In Out wih SVG






                      Thanks all for replying,

                      Now i'm stuck with the below mentioned scenario,

                      Zoom in out functionality without panning is done by playing with Viewbox coordinates of root element of SVG,

                      Drag and Drop of elements(From HTML Div to SVG Map and also from SVG Map to SVG Map) is implemented without zoom in.

                      Now i want to zoom my svg map (where i'm placing elements by drag and drop) along with drag and drop of elements with the above mentioned possibilities of drag drop.so my question is,Is it possible/feasible to drag and drop elements while map is zoomed in?and if it is correct approach then how to get correct position of cursor in map while drop event of element?

                      Regards,
                      Barkha
                    Your message has been successfully submitted and would be delivered to recipients shortly.