PROBLEMAS COM RESOLUÇÃO DE IMAGENS EM CANVAS

[leonardo23costa 0]

Boa noite galera, estou desenvolvendo um app que gere imagens automaticamente.

Estou conseguindo gerar a imagem e tudo mais usando uma biblioteca chamada html2canvas.

 

Porém quando salvo a imagem a qualidade da mesma sai em uma resolução péssima.

Conseguem me ajudar por favor?

 

Div da qual está sendo gerada uma imagem:

<div id="layout" class="layout-content" style="background-color:#FAEF64; background-image:url('images/flower.png'); background-size:250px; background-position:center;">
	  <p id="tecnica" class="center" style="position:absolute; margin-top:75px; left:0; right:0; margin-left:auto; margin-right:auto; z-index:999; text-transform:uppercase; font-size:12px;">T É C N I C O&nbsp;&nbsp;&nbsp;E M&nbsp;&nbsp;&nbsp;E N F E R M A G E M</p>
	  <p id="nome" class="center" style="position:absolute; margin-top:80px; left:0; right:0; margin-left:auto; margin-right:auto; z-index:999; text-transform:uppercase;">SEU NOME</p>
	  <p id="slogan" class="center" style="position:absolute; margin-top:250px; left:0; right:0; margin-left:auto; margin-right:auto; color:#000; z-index:999; text-transform:uppercase;">CUIDANDO DE VOCÊ COM <br />DEDICAÇÃO</p>
	  <img src="images/03.png" style="position:absolute; margin-top:320px; left:0; right:0; margin-left:auto; margin-right:auto; z-index:999; width:60%;" />
  </div>

 

Script para gerar e salvar a imagem:

<script>
	$("#download").click(function() {
		html2canvas($("#layout"), {
		  onrendered: function(canvas) {
			var a = document.createElement('a');
			
			a.href = canvas.toDataURL("image/jpeg", 1.0);
			a.download = 'sou-enfermagem.jpeg';
			a.click();
		  }
		});
	});
  </script>

Me ajudem por favor... Abraço.

[leonardo23costa 0]

ninguém sabe como melhorar a qualidade da imagem salva pelo html2canvas?

[ViniciusPuttiMorais 0]

eu nao conheco essa tecnologia que voce esta utilizando, mas recomendo tentar usar o elemento canvas do HTML5, acredito que faca o mesmo e nao tem problemas de qualidade de imagem.