Tasarım Kodlama

HTML5 Canvas Birleşik İşlemler

HTML5 Canvas ile bileşik bir işlem gerçekleştirmek için canvas içeriğinin globalCompositeOperation özelliğini kullanabiliriz. Bu özellik, tuvalin kaynak ve hedef durumları arasındaki karma işlemi tanımlar. Hedef, bileşik bir işlemden önceki canvas durumu olarak tanımlanır. Kaynak, bileşik bir işlemden sonra canvas durumu olarak tanımlanır.

source-atopsource-insource-outsource-overdestination-atopdestination-indestination-outdestination-overlighterxor, ve copy dahil olmak üzere on iki bileşik işlemden birini gerçekleştirebiliriz. Aksi belirtilmedikçe, varsayılan bileşik işlem source-over gerçekleştirilir.

Bir tuval içeriğinin kullanım ömrü boyunca yalnızca bir kompozit işlemi destekleyebileceğini bilmek önemlidir. Birden fazla bileşik işlem kullanmak istiyorsak, bu eğitimde olduğu gibi, işlemleri gizli bir tuval üzerine uygulamamız ve sonuçları görünür bir tuval üzerine kopyalamamız gerekir.

Çıktı:

Kod:

 

 

 

 

Yorum yap