原始图像α的getimagedata？

Question

在HTML5画布上，在javascript中，我使用屏幕外的画布元素在其上绘制图像。然后，我将该图像的一部分传输到屏幕上的另一个画布上。原始图像是带有alpha通道的png。然而，当图像被绘制到屏幕上时，它的alpha通道已经消失，它只是有一个白色的背景。

这种方式很有意义，但我在文档方面找不到更多关于如何采样一幅图像，在屏幕外执行一些操作，然后将图像转移到屏幕上的画布上，并且它的alpha通道是完整的。

下面是一个小演示(appologies，它是从一段更大的代码中破解出来的)：

    //this is all nested in an MVC view, using jQuery/Backbone

    this.pasteboard = $("<canvas/>").attr("width",1200).attr("height",600)
    this.pasteboard = this.pasteboard[0].getContext("2d");
    var img     = $("<img/>");
    var t       = this;
    img.load(function(){
        t.pasteboard.save();
        t.pasteboard.clearRect(0,0,args.width,args.height)
        t.pasteboard.drawImage(this,0,0);
        log("obj args:",args)
        o.imageData = t.pasteboard.getImageData(0,0,args.width,args.height);
        t.pasteboard.restore();
        o.ready = true;
        o.trigger("ready",args);
    }).attr("src",args.src);


 // and somewhere else in the view object i use 
 this.ctx.putImageData(myimagedataobjecthere,0,0);

 // all works fine except the alpha is now white background..

这大概是因为getimagedata和putimagedata之间的alpha通道缺乏保存？

有人对此有指点吗？就像我说过的，我没有立即找到关于这件事的文件.

非常感谢

一个

Answer 1

原始图像是一个带有alpha通道的png。然而，当图像被绘制到屏幕上时，它的alpha通道已经消失，它只是有一个白色的背景。

等等，不应该是这样的。如果似乎是这样的话，我认为代码中的其他部分是错误的。

下面是一个示例，在一个画布上绘制一个透明的图像，在它之前和之后绘制一些东西，然后将该画布绘制到另一个画布上，保持透明：

http://jsfiddle.net/Urutb/

在任何情况下，getImageData和PutImageData都绝对保留了alpha通道，您在这里所做的其他事情肯定是问题所在。