Sto provando a usare HTML2Canvas per rendere il contenuto di un div. Ecco il codice:HTML2Canvas non esegue il rendering completo div, solo ciò che è visibile sullo schermo?
var htmlSource = $('#potenzial-page')[0];
$('#btn').on("click", function() {
html2canvas(htmlSource).then(function(canvas) {
var img = canvas.toDataURL();
window.open(img);
});
});
sto usando v5 beta 3.
Quando questo codice viene eseguito, rende solo ciò che è visibile sullo schermo. Il div #potenzial-page è essenzialmente l'intera pagina, meno l'intestazione e il piè di pagina. Tutto il contenuto di questo div è visibile scorrendo (ci sono alcuni elementi nascosti, ma non voglio che gli elementi nascosti siano visibili nell'immagine.)
Non riesco a trovare cosa non va o perché non salverà l'intero div. Dovrei anche notare che sembra che l'immagine sia alta quanto il div ma solo parzialmente visibile.
Per dare un esempio di quello che voglio dire, ecco un confronto:
La sinistra è come HTML2Canvas dovrebbero rendere la div. La destra mostra come esegue il rendering quando viene eseguito il codice sopra. L'immagine giusta è ciò che è visibile nella schermata del mio browser.
Ho provato ad aggiungere l'opzione height ma non fa differenza.
UPDATE
Se ho scorrere fino alla cima della pagina poi eseguire lo script che renderà l'intero div come dovrebbe.
Come si esegue il rendering del div senza dover scorrere verso l'alto?
Sto affrontando lo stesso problema, come hai fatto a risolvere questo problema? –