Smartcrop. js: smart image cropping library and smartcrop. js Cropping

Smartcrop. js: smart image cropping library and smartcrop. js Cropping
Smartcrop. js is a JS plug-in that does not cut faces. Today we will introduce you to smartcrop. js, a very good open source library on github recently. It is a smart cropping library for image processing. In many project development scenarios, image uploading may be a user's photo information or product image. However, in the webpage layout, for better user experience, they usually require some width and height constraints. For inappropriate images, users often need to provide a cropping method to better experience the website users. However, the default crop area of an image is usually displayed in a fixed position, which is often not a precise user crop position. Therefore, the open-source library introduced today is designed to solve such problems and provide users with a better user experience. First, we can use npm install smartcrop or bower install smartcrop to download it. Use it as follows:

SmartCrop. crop (image, {width: 100, height: 100}, function (result) {console. log (result); // {topCrop: {x: 300, y: 200, height: 200, width: 200 }}});

It outputs a better image cropping position, such as {topCrop: {x: 300, y: 200, height: 200, width: 200. Below is a case from its presentation site, please enjoy: github address: https://github.com/jwagner/smartcrop.js