Ligera vainilla JavaScript Image Cropper-imagecrop. js

Vista prévia

Descripción

imagecrop. js es una biblioteca de JavaScript Pure Vanilla que crea un área rectangular alrededor de una imagen dada que permite redimensionar visualmente una imagen y colocar un recorte.

Funcionamiento

Cargue el imagecrop. min. CSS y el imagecrop. js en el documento.

<link rel="stylesheet" href="imagecrop.min.css">
<script src="imagecrop.js"></script>

Cree una nueva instancia de Cropper de imagen.

// Selector: CSS selector for the image cropper
// image_url: path to your image
// options: available options.
//
 -- max_width: the maximum width
//
 -- max_height: the maximum height
//
 -- update: callback function
//
 -- min_crop_width: the minimum width that the cropped image can be
//
 -- min_crop_height: the miminum height that the cropped image can be
//
 -- create_cb: callback function
//
 -- update_cb: callback function
//
 -- destroy_cb: callback function
//
 -- fixed_size: if it should constrain the size of the cropped area to be fixed or not ?
//
 -- mode: the type of preview you should see when using the image cropper, 'square' or 'circular'
img_c = new ImageCropper(selector, image_url, options);

Realice el recorte de la imagen.

// mime_type: image/jpeg or image/png
// quality: 1 is the highest quality setting, and 0 is the lowest quality setting
var img_b64_str = img_c.crop(mime_type, quality);

Registro de cambios

v1.4.0 (07/30/2018)

• Se han añadido más opciones