react-zoom-pan-pinch

!npm bundle size
!NPM
!npm
!GitHub stars

> Super fast and light react npm package for zooming, panning and pinching html
> elements in easy way

- Demo
- Docs

Features

- :rocket: Fast and easy to use
- :factory: Light, without external dependencies
- :gem: Mobile gestures, touchpad gestures and desktop mouse events support
- :gift: Powerful context usage, which gives you a lot of freedom
- :wrench: Highly customizable
- :crown: Animations and Utils to create own tools

Install

``bash
npm install --save react-zoom-pan-pinch
`

or

`bash
yarn add react-zoom-pan-pinch
`

Usage

`jsx
import React, { Component } from "react";

import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch";

class Example extends Component {
render() {
return (





);
}
}
`

or

`jsx
import React, { Component } from "react";

import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch";

class Example extends Component {
render() {
return (
initialScale={1}
initialPositionX={200}
initialPositionY={100}
>
{({ zoomIn, zoomOut, resetTransform, ...rest }) => (



Example text

)}

);
}
}

License

MIT © prc5