tinycrop
Lightweight pure JavaScript image crop library. Plays nicely with React.
Install from repository
Using NPM:
npm i tinycrop -S
Or Yarn:
yarn add tinycrop
Build from source
- Install nodejs
- Clone this repository
-
npm install
-
npm run build
Create new cropper
var Crop = require('tinycrop')
var crop = Crop.create({
parent: '#mount',
image: 'images/portrait.jpg',
bounds: {
width: '100%',
height: '50%'
},
backgroundColors: ['#fff', '#f3f3f3'],
selection: {
color: 'red',
activeColor: 'blue',
aspectRatio: 4 / 3,
minWidth: 200,
minHeight: 300,
width: 400,
height: 500,
x: 100,
y: 500
},
onInit: () => { console.log('Initialised') }
});Events
crop
.on('start', function (region) { console.log('Start', region) })
.on('move', function (region) { console.log('Move', region) })
.on('resize', function (region) { console.log('Resize', region) })
.on('change', function (region) { console.log('Change', region) })
.on('end', function (region) { console.log('End', region) });