CamanJs effetto Instagram per le tue foto

CamanJs effetto Instagram per le tue foto

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

Lascia un commento: