Caman Js è la libreria Javascript che ti permette di dare un effetto 'Instagram' alle tue immagini, ovvero ti permette di creare filtri personalizzabili come nel famoso social network.
L'utilizzo è semplice e veloce e funziona sia nella versione "browser" sia in Nodejs.
Iniziamo accedendo al sito ufficiale: camanjs.com e scarichiamo l'ultima versione stabile. All'interno dello zip scaricato troviamo molto materiale, (tra cui anche numerosi eempi), noi apriamo la cartella dist e estraiamo il file minificato: caman.full.min.js.
Creiamo la nostra pagina html per vedere come funziona la libreria Camanjs e nella head inseriamo:
<script type="text/javascript" src="caman.full.min.js">
Successivamente inseriamo nel codice html le immagini che vogliamo filtrare, dandogli un ID a nostro piacimento:
< img src="nostra-img.jpg" id="filtro" >
Ora inseriamo i valori per filtrare la nostra immagine:
Caman('#filtro', function () {
this.brightness(-10);
this.contrast(30);
this.sepia(20);
this.saturation(-30);
this.render();
});
Se tutto è corretto dovreste vedere un effetto simile a quello qui sotto:
Prima
Dopo
I parametri che si possono impostare sono molti e si possono creare numerosissimi effetti, per saperne di più vi consiglio di leggere la guida ufficiale.
Commenti
Ancora nessun commento per questo articolo