2014-07-18 112 views
1

我正在创建一个允许用户拍照的应用程序。拍摄的照片绘制到画布上,并在画布上完成图像编辑后用当前日期和其他用户特定信息进行标记,我可以将图像作为DataUri获取,但应用程序需要将图像保存到手机本地文件系统并获取设备文件系统上保存位置的路径。以下是该得到dataURI代码:使用Phonegap将Canvas图像保存为手机文件系统中的图像?

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,但它将图像保存为图库,但不返回文件路径。

任何建议,将不胜感激。

+0

你想将其保存为图像文件或64位编码的PNG URL文件? –

回答

2

的确,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

+0

只是一个简短的说明,我的答案是不幸的只适用于Android。对于IOS,插件只是在msg参数中返回'Image saved':( – QuickFix

+0

,所以经过一年后,你是否找到IOS的解决方案?你介意在这里分享解决方案吗? – ggDeGreat

+1

这个问题在这里讨论:https:/ /github.com/devgeeks/Canvas2ImagePlugin/issues/38 – QuickFix

相关问题