Je travaille actuellement avec html2canvas et FileSaver, pour enregistrer le canevas généré lorsque le bouton est cliqué. Une boîte de dialogue apparaîtra et l'utilisateur pourra choisir où sauvegarder l'image et la renommer s'il le souhaite. Cela fonctionne parfaitement ... dans Firefox. Je n'arrive pas à l'utiliser dans Chrome, IE ou Safari.html2canvas + Problèmes liés au navigateur FileSaver
html2canvas fera sa part et créera l'image hors de la div dans tous ces navigateurs. La boîte de dialogue FileSaver est la chose qui ne fonctionnera pas dans les navigateurs mentionnés ci-dessus.
Des idées? J'ai joint mon script. Vous pouvez voir mon code complet de travail ici: https://jsfiddle.net/ticklishoctopus/556etja4/
Script (avec l'aide de messages précédents SO):
$(function() {
$("#btnSave").click(function() {
html2canvas($("#testbtn"), {
onrendered: function (canvas) {
theCanvas = canvas;
document.body.appendChild(canvas);
canvas.toBlob(function (blob) {
saveAs(blob, "testimage.jpg");
});
}
});
});
});
Je vais essayer! Aurai-je besoin de changer quelque chose dans mon script? Ou simplement importer cette bibliothèque? – ticklishoctopus
Lire la description. Vous devrez peut-être modifier vos fonctions standard avec celles requises dans la bibliothèque. – ZombieChowder
Nous devons lire des choses différentes, je vois ceci: "canvas-toBlob.js implémente les méthodes standards HTML5 canvas.toBlob() et canvas.toBlobHD() dans les navigateurs qui ne le supportent pas nativement. Blob.js nécessite une prise en charge de Blob pour fonctionner, ce qui n'est pas le cas dans tous les navigateurs.Blob.js est une implémentation de blob multi-navigateur qui résout ce problème. " Qui n'a pas de vraie réponse. – ticklishoctopus