Question

我在画布中创建图像并保存图像。我发现了一个非常好的插件here。

图像保存代码：

          var canvas = document.getElementById('myCanvas');
          var context = canvas.getContext('2d');
          var imageObj = new Image();
          imageObj.src = imageURI;
          imageObj.onload = function() {
            contentW = $("#content").width();
            canvas.width = 400;
            canvas.height = 600;
            context.drawImage(imageObj, 0, 0,canvas.width,canvas.height);

            //the plugin
            setTimeout(function(){
            window.savephotoplugin(canvas,"image/png",device.version,function(val){ 
                    //returns you the saved path in val 
                    alert("Photo Saved: " + val);   
                });
            },3000) 
        }

插件工作非常好唯一的问题是它是在绘制画布之前完成的。所以我放了一个setTimeout来避免它，但有没有办法检测canvas何时完成并调用后面的函数。尝试jquery .change（）不起作用。

如果有人发现这个代码有用，请随意使用，插件非常好用：）

Answer 1

正如您所看到的，drawImage不接受任何回调。 canvas也没有定义有关其绘制过程的任何事件。因此，您选择timeout是正确的。只有一件事你可以改进。使用setTimeout(..., 0)代替setTimeout(..., 3000)。有关此技巧的更多详细信息here

绘制画布后，在phonegap中保存画布图像

1 个答案: