Utilizzo cookies

HTML5 canvas in tempo reale

toDataURL()

Il metodo toDataURL() converte <canvas> di un URL PNG codificato a 64 bit.

Per ottenere l'URL dei dati immagine in formato JPEG, possiamo passare image/jpeg come primo argomento nel metodo toDataURL ().

Per controllare la qualità delle immagini JPEG / JPG, è possibile passare un secodo agomento numerico fra 0 e 1.

Esempio:

var canvas = document.getElementById("canvas");

var DatiCanvas = canvas.toDataURL(); // mette il contenuto in DatiCanvas

I dati restituiti dalla funzione toDataURL () sono una stringa che rappresenta un URL codificato contenente i dati grafici.

La stringa può essere mostrata in un elemento textarea:

var canvas = document.getElementById("canvas");

var DatiCanvas = canvas.toDataURL();

document.getElementById("textArea").value = DatiCanvas;

La stringa può essere mostrata in un'altra finistra:

var canvas = document.getElementById("canvas");

var DatiCanvas = canvas.toDataURL();

window.open(DatiCanvas, "toDataURL() image", "width=600, height=200");

La stringa può essere mostrata come una nuova immagine sulla pagina:
var canvas = document.getElementById("canvas");
var MiaImmagine = canvas.toDataURL("image/png"); // In MiaImmagine i dati canvas

var OggettoImmagine = document.getElementById("IMMAGINE"); // Prende l'oggetto Immagine.

OggettoImmagine.src = MiaImmagine;

Questo e-book è un e-book interattivo, ciò significa che il lettore può inserire dei dati nelle pagine ed il contenuto di queste si adeguerà ai nuovi valori. Per inserire i dati, nelle pagine dell’e-book, sono stati implementati dei controlli simili a quelli che si possono trovare sulle pagine Internet ed un pulsante esegui per impartire il comando di adeguare il contenuto della pagina ai nuovi valori.

Antonella Brandi
Art-designer