Javascript 将图像另存为png并允许用户将图像共享到社交媒体

我想要相同的图像一旦转换。我试过canvas.toDataURL（“image/png”）；但这对我不起作用。我尝试了下面的代码，虽然它创建了一个img，但它没有显示屏幕截图。我是一个使用javascript的新手。你能帮忙吗

function showImage() 
{
html2canvas($('#hpImplement'), 
{
    onrendered: function(canvas) 
   {
       var elem = document.createElement("img");
       elem.setAttribute("src", canvas);
       elem.setAttribute("alt", "Flower");
       document.getElementById("hpShare").appendChild(elem);

   },
}); 

}

我甚至试过：

function showImage() 
{
    html2canvas($('#hpImplement'), 
   {
        onrendered: function(canvas) 
       {
           var theCanvas = canvas.toDataURL("image/png");
           var elem = document.createElement("img");
           elem.setAttribute("src", theCanvas);
           elem.setAttribute("alt", "Flower");
           document.getElementById("hpShare").appendChild(elem);

       },
  }); 
}

---

对我来说似乎很有用：然而，要在社交媒体上共享图像，而不需要用户将其下载到磁盘然后上传到另一个网站，社交网站需要一种自己访问图像的方式，因此必须将其保存在某个公共web服务器上。这太奇怪了。它在JSFIDLE上工作，但是当我尝试通过代码编辑器在google chrome上运行代码时，它没有运行@pawel我是否缺少一个特定的插件？我有html2canvas插件，我有JQuery 1.8.2插件。@pawel它似乎没有读取var theCanvas=canvas.toDataURL（“image/png”）；当我添加这条语句时，它除了编写elem.setAttribute（“src”，canvas）代码外，什么也不做；它会创建一个img标记，但不显示图像。可能您试图在屏幕上绘制屏幕截图之前渲染屏幕截图，即在加载页面之前执行脚本。常见问题：中的脚本试图对执行时不存在的元素执行某些操作。尝试

window.onload=showImage

在加载所有内容后执行脚本。