Is this possible: Zoomable SVG Image Map
Asked Answered
R

2

14

I would like to make a very big svg that is both a CLICKABLE image map and is ZOOMABLE. If I understand the html5 specs both of these seem possible, but no one mentions using both of these together. Are there any examples out there?

I don't want to use jquery and a jpg/png because I would like to stick to SVG. Any leads at all would be greatly appreciated.

Thank you!

Recor answered 13/6, 2011 at 1:53 Comment(1)
Nowadays people might want to check out: svg-pan-zoom Supports zooming by mouse scroll as well as mobile device touch gestures. It has its own tag here on SO.Lieselotteliestal
G
16

As user785194 says, you don't need to use HTML5, you can do it natively in SVG - you can do it all with EMCAScript inside the SVG itself. I've written a detailed description of how to do it here: http://www.petercollingridge.co.uk/interactive-svg-components/pan-and-zoom-control

Gatto answered 29/6, 2011 at 20:30 Comment(0)
S
9

The HTML5 specs aren't relevant - you want the svg specs. Start with the tutorial at

http://www.petercollingridge.co.uk/data-visualisation/introduction-svg-scripting-interactive-map

For zooming, lookup up the transform attribute. I haven't seen any example code with a zoom widget on it. You can always zoom in the browser, of course.

Socinus answered 16/6, 2011 at 11:56 Comment(1)
+1 for mentioning my tutorial :). Also for saying that HTML5 is irrelevant.Gatto

© 2022 - 2024 — McMap. All rights reserved.