Fusionar varias imágenes a una imagen-Merge-images. js
| Autor: | lukechilds |
|---|---|
| Views Total: | 2,394 |
| Sitio oficial: | Ir a la web |
| Actualizado: | April 4, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Merge-images. js es una biblioteca de JavaScript que fusiona varias imágenes con una imagen con Canvas. Admite node. js y el explorador.
Funcionamiento
Instale la biblioteca con NPM.
# NPM $ npm install merge-images --save
Importe el Merge-images. js al proyecto.
import mergeImages from 'merge-images';
Defina una matriz de imágenes para fusionar.
mergeImages(['1.jpg', '2.jpg', '3.jpg'])
Visualice la imagen fusionada en la página.
<img />
.then(b64 => document.querySelector('img').src = b64); Especifique la opacidad y la posición de las imágenes.
mergeImages([
{ src: '1.png', x: 0, y: 0, },
{ src: '2.png', x: 32, y: 0, opacity: 0.6},
{ src: '3.png', x: 16, y: 0, opacity: 0.5 }
]) Opciones de personalización predeterminadas.
mergeImages(['1.jpg', '2.jpg', '3.jpg'],{
// file format
// quality
quality: 0.92,
// width/heigh
width: undefined,
height: undefined,
// allows usage outside of the browser
Canvas: undefined
})
