Skip to content

A jQuery plugin providing a hook for Andrea Leofreddi's SVGPan library on an arbitrary number of SVGs

License

Notifications You must be signed in to change notification settings

talos/jquery-svgpan

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery-svgpan

This is an an adaptation of Andrea Leofreddi's SVGPan library, version 1.2.2, for use as a jQuery plugin.

When called upon SVG element(s), this will add all the capabilities of Andrea Leofreddi's SVGPan library to those elements. Non-SVG elements will be silently ignored.

This is useful if you have SVG content sitting in the DOM. For example, if you are generating graphics via the d3 visualization library. It will not work if you are embedding the SVG through some other means.

See it in action!

Usage

You can configure the behaviour of the pan/zoom/drag by passing arguments.

  • viewportId: String ID of the root SVG element.
  • enablePan: Boolean enable or disable panning (default enabled)
  • enableZoom: Boolean enable or disable zooming (default enabled)
  • enableDrag: Boolean enable or disable dragging (default disabled)
  • zoomScale: Float zoom sensitivity, defaults to .2
    $(selector).svgPan(viewportId, enablePan, enableZoom, enableDrag, zoomScale);

Examples

This would enable SVGPan for all SVGs currently on the page. The element #viewport would be used as the viewport for each.

    $('svg').svgPan('viewport');

This would enable SVGPan for a single element (provided it is an SVG).

   $('#id').svgPan('viewport');

Links

Andrea Leofreddi's original SVGPan library on Google code

Fork jquery-svgpan at

CDN jquery-svgpan from

About

A jQuery plugin providing a hook for Andrea Leofreddi's SVGPan library on an arbitrary number of SVGs

Resources

License

Stars

Watchers

Forks

Packages

No packages published