SVG: How to click & drag ?

[Martin]

I have an application that generates a page with an embedded SVG image
in it. The image (the viewport) is intentionally larger than the
screen (the browser's window size). I would like to provide the
ability for the user to click on the image and drag it around so that
he can see the parts that are off-screen - much like he would use the
scroll bars to move it left/right and up/down.

Note that I am NOT talking about dragging a specific element around -
I want to be able to move the entire image without changing the image
in any way. Also, I'm NOT talking about drag-and-drop.

Can anyone tell me how this might be done? Or, perhaps point me to
some on-line examples?

Thanks.

 

[Martin Honnen]

I have an application that generates a page with an embedded SVG image
in it. The image (the viewport) is intentionally larger than the
screen (the browser's window size). I would like to provide the
ability for the user to click on the image and drag it around so that
he can see the parts that are off-screen - much like he would use the
scroll bars to move it left/right and up/down.

Note that I am NOT talking about dragging a specific element around -
I want to be able to move the entire image without changing the image
in any way. Also, I'm NOT talking about drag-and-drop.

It's called panning, I think the Adobe SVG viewer supports with
Control-Click.

 

[Martin]

It's called panning, I think the Adobe SVG viewer supports with
Control-Click.

Thanks, Martin.

Wow, that was easy - I don't have to program or script anything!

BTW, it's Alt-Click rather than Control-Click. Control-Click seems to
provide a zoom functionality.

The problem now is - this seems to work only in IE (with the Adobe
viewer); Alt-Click (or Control-Click) doesn't do anything in FF. Do
you know if there's any way to get similar behavior in FF?

 

[Martin Honnen]

The problem now is - this seems to work only in IE (with the Adobe
viewer); Alt-Click (or Control-Click) doesn't do anything in FF. Do
you know if there's any way to get similar behavior in FF?

The bug is https://bugzilla.mozilla.org/show_bug.cgi?id=163068, it looks
like they are still debating on how to expose that functionality.