HTML2Canvas tam olarak görüntülenmiyor, sadece ekranda görünen nedir?

Question

Bir div içeriğini oluşturmak için HTML2Canvas kullanmaya çalışıyorum. sadece ekranda görünür ne hale,

var htmlSource = $('#potenzial-page')[0]; 

$('#btn').on("click", function() {   

    html2canvas(htmlSource).then(function(canvas) { 
     var img = canvas.toDataURL(); 
     window.open(img); 
    }); 

}); 

Bu kod çalıştırıldığında ben v5 beta 3.

kullanıyorum: İşte kodudur. #potenzial-page div, esas olarak başlık ve altbilgi eksi tüm sayfadır. Bu div içerisindeki tüm içerikler kaydırılarak görülebilir (bazı gizli öğeler vardır, ancak gizli öğelerin görüntüde görünmesini istemiyorum.)

Neyin yanlış olduğunu veya neden tümüyle kaydetmeyeceğimi bulamıyorum. Ayrıca, görüntünün div kadar uzun ama sadece kısmen görülebilir gibi göründüğüne dikkat etmeliyim.

sol HTML2Canvas div hale nasıl geçerli:

ne demek istediğimi bir örnek vermek gerekirse, burada bir karşılaştırması. Doğru, yukarıdaki kodu çalıştırdığında nasıl işlediğini gösterir. Doğru görüntü, tarayıcılarımda görünen şeydir.

height seçeneğini eklemeyi denedim, ancak bir fark yaratmıyor. Ben sayfa en üst ilerlerseniz

GÜNCELLEME

sonra olması gerektiği gibi tüm div hale getirecek komut dosyasını çalıştırın.

En üste kaydırmak zorunda kalmadan div'u nasıl oluştururum?

Answer 1

SO bu çözümü gördünüz mü: "Html2canvas converting overflowed content to image" bir geçici çözüm çözüm için taşma ayar ile önerilmiştir daha sonra taşma gizli hale görünür. benim için çalıştı

Answer 2

bir çözüm benim css için aşağıdaki eklemek oldu:

.html2canvas-container { width: 3000px !important; height: 3000px !important; } 

O (varsayılan olarak görünüyor) görüntülenebilir alana oluşturmayı sınırlama gelen html2canvas engeller.

Buraya bakın: https://github.com/niklasvh/html2canvas/issues/117