2D container. Drag and scale in a fixed space.
https://wings-j.github.io/two-dimension-container
Install:
npm install --save-dev @wings-j/two-dimensional-container
Example:
import TwoDimensionContainer from '@wings-j/two-dimensional-container'
let container = new TwoDimensionContainer('100%', '100%', { animate: true })
container.translateTo(window.innerWidth / 2, window.innerHeight / 2)
document.body.appendChild(container.$container)
let div = document.createElement('div')
container.$content.appendChild(div)
constructor(width?: string, height?: string, config?: Partial<Config>)
- width: width of the container
- height: height of the container
- config:
- translate: draggable
- scale: scalable
- translateSpeed: speed of translating
- scaleSpeed: speed of scaling
- animate: zoom with animations
- animateDuration: animation duration
Container element.
Content element.
Current position and scale factor
Absolute translate.
Parameters:
- ax:absolute value of x
- ay:absolute value of y
Relative translate.
Parameters:
- ax:relative value of x
- ay:relative value of y
Absolute scale.
Parameters:
- ax:absolute factor
Relative scale
Parameters:
- ax:relative factor