ZoomAndMove

With this tiny package you are able to zoom and move all DOMElements you put in the right container.

Installation

Using npm
npm i zoom-and-move --save

Using yarn
yarn add zoom-and-move

How to use

Add the bundle to your footer scriptblock

<script src="./JavaScript/ng.zoom-and-move.js"></script>

let myMap = new SVGMap('#main-map', {
    zoomEnabled: true, // zoomable
    moveEnabled: true, // moveable
    useCtrlKey: true, // use Ctrl + Wheel key to zoom
    transformOrigin: 'center', // https://developer.mozilla.org/de/docs/Web/CSS/transform-origin
    zoomlevel: {
        default: 1, // default zoom level of element
        min: .5, // smallest zoom level
        max: 2.5 // highest zoom level
    },
});

Coming soon

• [ ] add useAltKey
• [ ] Do stuff on reaching zoom level
• [ ] enable auto hinting (ctrl + wheel, alt + wheel, wheel, touch options)
• [ ] add controls (+zoom, -zoom, +moveTop, +moveDown, +moveLeft, +moveRight, reset to default)