html2canvas tarayıcı üzerinden ekran görüntüsü almanızı sağlayan javascript kütüphanesi. Kütüphane tüm işlemleri istemci üzerinde yani tarayıcı üzerinde gerçekleştiriyor.

Kullanım

Kütüphanenin kullanımı oldukça basit, çağırdığımız fonksiyon element ve seçenekler şeklinde 2 değer alıyor. Element olarak hangi alanın ekran görüntüsünü almak istediğinizi geçebilirsiniz, seçenekler içinse şu sayfayı kontrol edebilirsiz.

html2canvas(element, options);

Örneğin önce tüm sayfanın ekran görüntüsünü alalım,

html2canvas(document.body, {});

Şimdi aldığımız bu ekran görüntüsünün yükseklik ve genişliğini ayarlayalım, (sol üstten kırpma işlemi gibi çalışır)

html2canvas(document.body, {
  width: 500,
  height: 500
});

Son olarak bu ekran görüntüsünü alarak sayfaya ekleyelim, onrendered özelliğine geçeceğiniz fonksiyon ile, ekran görüntüsünden sonra ne işlem yapacağınızı belirtebilirsiniz.

html2canvas(document.body, {
  width: 500,
  height: 500,
  onrendered: function(canvas) {
    document.body.appendChild(canvas);
  }
});

Tarayıcı Desteği

• Firefox 3.5 +
• Google Chrome
• Opera 12+
• IE9 +
• Safari6

Örnek Uygulama

Eklenti Sayfası : http://html2canvas.hertzen.com/