🖼 React Zoom Pan Pinch

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

Sources

• Demo
• Docs

## Key Features - 🚀 Fast and easy to use - 🏭 Light, without external dependencies - 💎 Mobile gestures, touchpad gestures and desktop mouse events support - 🎁 Powerful context usage, which gives you a lot of freedom - 🔧 Highly customizable - 👑 Animations and Utils to create own tools - 🔮 Advanced hooks and components ## Try other BetterTyped projects Do you like this library? Try out other projects **[⚡Hyper Fetch](https://github.com/BetterTyped/hyper-fetch)** - Fetching and realtime data exchange framework. --- ## Installation ```bash npm install --save react-zoom-pan-pinch or yarn add react-zoom-pan-pinch ```

## Examples ```jsx import React, { Component } from "react"; import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch"; const Example = () => { return ( ); }; ``` or ```jsx import React, { Component } from "react"; import { TransformWrapper, TransformComponent, useControls, } from "react-zoom-pan-pinch"; const Controls = () => { const { zoomIn, zoomOut, resetTransform } = useControls(); return ( ); }; const Example = () => { return ( {({ zoomIn, zoomOut, resetTransform, ...rest }) => ( <>

Example text

)} ); }; ```

## License MIT © [prc5](https://github.com/prc5) ## Help me keep working on this project ❤️ - [Become a Sponsor on GitHub](https://github.com/sponsors/prc5) ## 💖 Our sponsors