Biblioteca de JavaScript para el procesamiento de imágenes de mosaico-photomosaic. js
| Autor: | ritz078 |
|---|---|
| Views Total: | 3,972 |
| Sitio oficial: | Ir a la web |
| Actualizado: | October 8, 2015 |
| Licencia: | MIT |
Vista prévia
Descripción
photomosaic. js es un pequeño complemento de JavaScript independiente que aprovecha la técnica de canvas HTML5 para aplicar efectos de mosaico personalizables a las imágenes existentes.
Funcionamiento
Agregue una imagen normal a su página web.
<img src="image.jpg" id='before'>
Cree un contenedor para colocar la imagen procesada.
<div id="after"></div>
Cargue el archivo photomosaic. js al final de su documento HTML.
<script src="photomosaic.js"></script>
Aplique un efecto de mosaico predeterminado a la imagen.
var photomosaic = new PhotoMosaic({
image
: document.getElementById('before'),
targetElement : document.getElementById('after'),
width
: 500,
height
: 500
}) Opciones de configuración completas.
var photomosaic = new PhotoMosaic({
// original image
image
: document.getElementById('before'),
// target container
targetElement : document.getElementById('after'),
// width of the image
width
: 500,
// height of the image
height
: 500,
// tile division height for creating mosaic
tileHeight
: 16,
// tile division width for creating mosaic
tileWidth
: 16,
// shape of the tiles (circle or rectangle)
tileShape
: 'rectangle',
// opacity of the resulting image
opacity
: 0.5
})
