2011-05-13 40 views
1

我已經使用基地64編碼器我canvas.getImageData()像素陣列 上,我想它的base64編碼字符串保存到文件的圖像...有沒有辦法將canvas.getImageData()像素數組編碼爲base64?

我不能使用canvas.toDataURL因爲它不是在webOS的支持

這裏我的代碼 它生成一個base64編碼字符串,但該字符串亙古不生成圖像...

EditorAssistant.prototype.encode = function (input) { 
this._keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz/="; 

    // public method for encoding 

     var output = ""; 
     var chr1, chr2, chr3, enc1, enc2, enc3, enc4; 
     var i = 0; 

     input = this._utf8_encode(input); 

     while (i < input.length) { 

      chr1 = input.charCodeAt(i++); 
      chr2 = input.charCodeAt(i++); 
      chr3 = input.charCodeAt(i++); 

      enc1 = chr1 >> 2; 
      enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); 
      enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); 
      enc4 = chr3 & 63; 

      if (isNaN(chr2)) { 
       enc3 = enc4 = 64; 
      } else if (isNaN(chr3)) { 
       enc4 = 64; 
      } 

      output = output + 
      this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + 
      this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4); 

     } 

     return output; 
    } 

EditorAssistant.prototype._utf8_encode =function (string) { 
     string = string.replace(/\r\n/g,"\n"); 
     var utftext = ""; 

     for (var n = 0; n < string.length; n++) { 
      var c = string.charCodeAt(n); 
      if (c < 128) { 
       utftext += String.fromCharCode(c); 
      } 
      else if((c > 127) && (c < 2048)) { 
       utftext += String.fromCharCode((c >> 6) | 192); 
       utftext += String.fromCharCode((c & 63) | 128); 
      } 
      else { 
       utftext += String.fromCharCode((c >> 12) | 224); 
       utftext += String.fromCharCode(((c >> 6) & 63) | 128); 
       utftext += String.fromCharCode((c & 63) | 128); 
      } 

     } 

     return utftext; 
    } 

這裏我打電話上述功能

 var imaged = this.canvasContext.getImageData(0, 0, this.canvas.width, this.canvas.height); 

    var data =""; 
    for(var i = 0; i<imaged.data.length; i++){ 
     data += imaged.data[i]; 
    } 

    var strEncoded = this.encode(data); 

    $('image').src = 'data:image/jpeg;base64,'+strEncoded; 

你能告訴我我做錯了嗎? thnks

+0

您是否找到了解決方案?我有同樣的問題。 – hungryMind 2011-07-07 13:43:43

+0

不幸的是沒有.... – 2011-07-08 04:41:12

+0

我在網上找到了一些可以很好地創建bmp的東西。我還需要將數據保存爲jpg。 http://www.nihilogic.dk/labs/canvas2image/ – hungryMind 2011-07-08 07:24:38

回答

1
$.getImageData({ 
    url: "http://farm4.static.flickr.com/3002/2758349058_ab6dc9cfdc_z.jpg?zz=1", 
    success: function(image){ 

    // Set up the canvas 
    var can = document.getElementsByTagName('canvas')[0]; 
    var ctx = can.getContext('2d'); 

    // Set the canvas width and heigh to the same as the image 
    $(can).attr('width', image.width); 
    $(can).attr('height', image.height); 

    // Draw the image on to the canvas 
    ctx.drawImage(image, 0, 0, image.width, image.height); 

    // Get the image data 
    var image_data = ctx.getImageData(0, 0, image.width, image.height); 
    var image_data_array = image_data.data; 


    // Write the image data to the canvas 
    ctx.putImageData(image_data, 0, 0); 

    }, 
    error: function(xhr, text_status){ 
    // Handle your error here 
    } 
}); 
相關問題