Question

我尝试将画布导出为png图像。我用下面的代码来做这件事。

function onExport() {
        var canvas = $("#container_canvas")[0]; //id of the canvas 
        var dt = canvas.toDataURL();
        this.href = dt; 
    }

这适用于除IE以外的所有其他浏览器。没有采取任何行动。我使用IE 10版本。帮我解决这个问题。感谢。

Answer 1

这是一个从画布创建html img元素的更完整示例。

它在IE10中运行良好。

如果用户需要，他们可以右击 - 保存 - 作为新的img。

示例代码和演示：

＆＃13;

var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");


ctx.fillStyle='skyblue';
ctx.fillRect(50,50,150,55);
ctx.strokeRect(50,50,150,55);
ctx.fillStyle='white';
ctx.font='14px verdana';
ctx.fillText('Click the canvas',55,65);
ctx.fillText('to save it as',55,80);
ctx.fillText('a new image',55,95);


canvas.addEventListener("click",function(){
  var img=new Image();
  img.onload=function(){
    document.body.appendChild(img);
  }
  img.src=canvas.toDataURL();
});

＆＃13;

body{ background-color: ivory; }
canvas{border:1px solid red;}
img{border:1px solid blue;}

＆＃13;

<h4>Click the canvas. The new blue element is an img</h4>
<canvas id="canvas" width=300 height=300></canvas>

＆＃13;

将画布导出到图像在IE中不起作用

1 个答案: