HTML5 canvas in tempo reale

drawImage() ritagliare - live

Se riesci a leggere questo, il tuo browser non supporta Canvas.
ctx.beginPath(); // vuota buffer
var img = document.getElementById("Immagine"); 
ctx.drawImage(img, , , , ,, , , );
<img id="Immagine" width="1" height="1" src="MargheritaGrande.png">

drawImage: mostra come caricare un'immagine e quindi disegnarla su canvas specificandone posizione x,y e larghezza, altezza,

Il codice mostra come ritagliare l'immagine e disegnare la parte ritagliata su canvas

drawImage(Image, sx, sy, sw, sh, dx, dy, dw, dh)
Image: immaigne sorgente
sx , sy:  il punto x,y di origine del ritaglio sull'immagine sorgente.
sw , sh: larghezza altezza del rettangolo ritagliato a partire da sx e sy.
Quel rettangolo verrà copiato sulla canvas alla posizione dx e dy.
dw , dh: nuova dimensione dell'immagine copiata su canvas.

Acquistabile da:
• bookrepublic
• ebook LeggoOggi.it
• EURONICS
• freeonline
• Gola Ad
• GPLAY
• HOEPLI
• iTunes
• kobo
• omnia BUK
• SECRETARY
• StreetLib

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.