Zoom y paneo de imágenes svg usando raphael.js o alguna otra biblioteca js

Necesito un pequeño script que muestre un SVG (imagen vectorial) dentro de un cuadro que tiene 2 funciones;Zoom y paneo de imágenes svg usando raphael.js o alguna otra biblioteca js

La imagen puede ser desplazada (movido para mirar a diferentes partes de la imagen SVG con el cursor) del mismo tipo que los mapas de Google.
La imagen SVG se pueden acercar y alejar también simmilar Google mapas, excepto que no habrá necesidad de cargar nuevas imágenes como la imagen es un vector.

Para un script simmilar que he visto que funciona con formatos de imagen normal ver http://jibbering.com/routeplanner/

Fuente

2010-02-26 Chandan Jog

También esta funcionalidad debería funcionar en todos los broswers incluyendo ie (no es decir 6) sin la necesidad de descargar e instalar un plugin svg viewer. –

Ninguna versión de IE admite SVG (sin un complemento), por lo que esta "pequeña secuencia de comandos" al menos necesitará convertir SVG a VML. Ese es un gran trabajo allí: ¡la especificación de SVG tiene 719 páginas de largo! – Ken

@ Chanhan Has tenido algunas respuestas útiles, te sugiero que aceptes una de ellas –

Si alguien sigue interesado: Acabo de encontrar esta implementación de panorámica y zoom para Raphael. Siendo un proyecto muy joven, pero lo suficientemente interesante que pienso:

https://github.com/escobar5/raphael-pan-zoom

demostración en línea aquí: http://htmlpreview.github.com/?https://raw.github.com/escobar5/raphael-pan-zoom/master/examples/complete-map/index.html

Fuente

2012-12-18 23:09:50

¿este plugin tiene una documentación o una página de inicio rápido? –

Me temo que no.Hay 2 ejemplos en la carpeta de ejemplos. Para más, creo que tienes que contactar al autor –

En primer lugar usted necesita aprender cómo instalar una función que se extiende a Rafael compatible con el zoom ... http://www.irunmywebsite.com/raphael/additionalhelp.html?q=addownmethodstocanvas

desea implementar plug-in zoom de Wout ... http://github.com/wout/raphael-zoom

Fuente

2010-03-01 02:37:00 Chasbeen

Ambos enlaces están muertos. –

puede probar los scripts desde la página de prueba IE9 http://ie.microsoft.com/testdrive/Graphics/42OrganizationChart/Default.xhtml Requiere un pequeño ajuste con ids, pero funcionó bien para mí.

Fuente

2010-03-27 17:53:41

Raphael es bueno, pero no lo suficientemente bueno.

Echa un vistazo a esta página: http://code.google.com/p/svgpan/. Hace exactamente lo que pediste.

Fuente

2010-09-28 20:13:08

¿Esta biblioteca tiene alguna documentación? Sería genial si hubiera alguna forma de ampliarlo cuando se llamaba a una función específica en una página web. –

que ha derivado SVGPan de Andrea en una (con suerte) más amigable Raphäel plugin :)

Fuente

2010-11-02 19:23:34

Oye, ¿tienes el complemento en alguna parte? La página de github ya no está disponible. –

@VicSzpilman https://github.com/andrewseddon/raphael-zpd? – Nitrodist

Terminé usando el svg-pan-zoom que se deriva de SVGPan, pero permite encabritado/paneo de una elemento arbitrario svg dentro de su HTML, y puede agregar controles.

SVGPan funciona muy bien si su página completa es solo un SVG cargado (como el ejemplo de tigre), pero no si su svg está en algún lugar más profundo en el html.

Fuente

2014-08-08 14:31:58 nathanvda

Zoom y paneo de imágenes svg usando raphael.js o alguna otra biblioteca js

Respuesta

Cuestiones relacionadas