Question

我正在创建一个允许用户拍摄照片的应用。在画布上完成图像编辑后，拍摄的照片被绘制到画布上并标记当前日期和其他用户特定信息，我能够将图像作为DataUri获取，但应用程序需要将图像保存到电话本地文件系统并返回设备文件系统上保存位置的路径。以下是获取dataURI的代码：

    var canvas = $('#myCanvas')[0];
    var context = canvas.getContext('2d');
    var imageObj = new Image();
    var scale = 0.2;
    var imgWidth, imgHeight;
    imageObj.src = "data:image/jpeg;base64," + imageData;
    imageObj.onload = function() {

        var mpImg = new MegaPixImage(imageObj);

        if (z.globals.deviceType == "iPhone") {

            imgWidth = imageObj.width,
                imgHeight = imageObj.height;
            mpImg.render(document.getElementById('canvas'), { width: imgWidth * scale, height: imgHeight * scale });

        } else {

            canvas.width = 670;
            canvas.height = 500;
            context.drawImage(imageObj, 0, 0, 670, 500);

        }

        var dateTaken = new Date();

        context.fillStyle = "#FFFFFF";

        context.fillText(toString(dateTaken), 0, 30);

        largeImg.src = canvas.toDataURL();

有没有办法使用Phonegap将dataURI保存到设备文件系统并重新获取文件路径。

我尝试了canvas2ImagePlugin.js，但它将图像保存到图库但不返回文件路径。

任何建议都将不胜感激。

Answer 1

确实，canvas2ImagePlugin返回已保存文件的URI。

这是传递给成功回调的参数，在文档中称为“msg”。

window.canvas2ImagePlugin.saveImageDataToLibrary(
        function(msg){
            console.log("Imaged saved to URI : "+msg);
        },
        function(err){
            console.log(err);
        },
        document.getElementById('myCanvas')
    );

它返回如下内容：

Imaged saved to URI :/storage/sdcard1/Pictures/c2i_1862014144659.png

使用Phonegap将Canvas Image保存为手机文件系统中的图像？

1 个答案: