javascript - dom到图像库生成低质量图像

Question

我使用 dom-to-image 将 div 内容下载为图像，但它给了我一个低质量的图像，我的代码不清楚：

<script> 
    var node = document.getElementById('my-certificate');
    var btn = document.getElementById('download-btn');

    var options = {
        quality: 0.99 
    };
    
    btn.onclick = function() {
      domtoimage.toBlob(node, options)
        .then(function(blob) {
          window.saveAs(blob, 'my-certification.png');
        });
    
    }
</script>   

任何想法如何产生更好的质量？

标签： javascript

Answer 1

在渲染图像之前使用选项中的宽度和高度来放大节点。（如果你不这样做，质量就像屏幕截图）

 var options = {
    quality: 0.99,
    width: 2000,
    height: 2000,
};