https://github.com/waynegm/imgviewer2
Extensible and responsive jQuery plugin to zoom and pan images based on the Leaflet mapping library
https://github.com/waynegm/imgviewer2
image jquery jquery-plugin leaflet responsive viewer
Last synced: 27 days ago
JSON representation
Extensible and responsive jQuery plugin to zoom and pan images based on the Leaflet mapping library
- Host: GitHub
- URL: https://github.com/waynegm/imgviewer2
- Owner: waynegm
- License: mit
- Created: 2017-02-01T10:06:40.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-10-06T12:16:36.000Z (over 1 year ago)
- Last Synced: 2024-08-31T17:40:58.455Z (8 months ago)
- Topics: image, jquery, jquery-plugin, leaflet, responsive, viewer
- Language: JavaScript
- Size: 1.39 MB
- Stars: 60
- Watchers: 6
- Forks: 34
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
# imgViewer2
Extensible and responsive jQuery plugin to zoom and pan images. Zooming and panning works on desktop browsers using:
- the mousewheel to zoom in and out
- left mouse button double click to zoom in
- shift and left mouse button drag to define a area to zoom
- left mouse button click and drag to pan around.
On touch enabled devices pinch gestures can be used to zoom in and out and tap and drag to pan around.
It is an easily extended, responsive UI component based on the jQuery widget factory that uses the [Leaflet](http://leafletjs.com/index.html) mapping library for the underlying image display. It should work on all browsers and platforms supported by [Leaflet](http://leafletjs.com/index.html).
This plugin is the successor to the original [imgViewer](https://github.com/waynegm/imgViewer) plugin.
## Examples
1. [Fixed size image](http://waynegm.github.io/imgViewer2/fixed_image_size.html)
2. [Dynamic image size](http://waynegm.github.io/imgViewer2/dynamic_image_size.html)
3. [Decorated, dynamic image size](http://waynegm.github.io/imgViewer2/dynamic_decorated_image.html)
4. [Custom onClick callback](http://waynegm.github.io/imgViewer2/custom_onclick_callback.html)
2. [Control options](http://waynegm.github.io/imgViewer2/control_options.html)
3. [Simple extension to display markers and notes](http://waynegm.github.io/imgViewer2/basic_note.html)
4. [Simple extension using Leaflet plugins to display markers and notes](http://waynegm.github.io/imgViewer2/basic_note_with_plugins.html)
5. [Simple extension to compare multiple versions of an image](http://waynegm.github.io/imgViewer2/img_comparator.html)
## Documentation
1. [Using the plugin](plugindocs/usage.md)
2. [Options](plugindocs/options.adoc)
2. [Methods](plugindocs/methods.adoc)
3. [Extending](plugindocs/extending.md)
4. [Release History](plugindocs/releases.md)