JavaScript para pixelar imágenes usando una paleta fija-ditherjs
| Autor: | danielepiccone |
|---|---|
| Views Total: | 2,426 |
| Sitio oficial: | Ir a la web |
| Actualizado: | October 27, 2018 |
| Licencia: | GPL 3.0 |
Vista prévia
Descripción
ditherjs es una librería JavaScript elegante e interesante para pixelar las imágenes Web usando una paleta fija, basada en HTML5 Canvas Element.
Funcionamiento
Incluya la biblioteca JavaScript dither. js en el documento HTML.
<script src="src/ditherjs.js"></script>
Inserte una imagen en el documento.
<img class="dither" src="demo.jpg" alt="" />
El JavaScript para habilitar la pixelación de la imagen.
<script>
var palette1 = [
[0,0,0],
[85,255,85],
[255,85,85],
[255,255,85]
];
var palette2 = [
[0,0,0],
[85,255,255],
[255,85,85],
[255,255,255]
];
var palette3 = [
[0,0,0],
[255,0,255],
[0,255,255],
[255,255,255]
];
var coin = Math.random();
var palette = coin < 0.3 ? palette1 : coin < 0.6 ? palette2 : palette3;
var options = {
"step": 3,
"className": "dither",
"palette": palette,
"algorithm": "ordered"
};
dither = new DitherJS('.dither',options);
</script> Registro de cambios
10/27/2018
- v0.10.0
