如何將Easeljs圖形對象轉換爲base64？

Question

我注意到Graphics對象中有一種方法可以根據base64字符串來繪製添加筆劃和填充到Graphics對象，但是有什麼方法可以做相反的轉換嗎？即從Graphics對象創建一個base64字符串？我想要這樣做的原因是，圖形對象可以以字符串形式存儲，然後解碼爲Graphics對象。如果有這樣的easeljs函數，那將是我首選的方法。如果沒有，我想知道是否有某種方法可以訪問圖形信息並將它自己變成一個字符串。

Answer 1

有人剛剛投了我的問題，所以我想我會回答它。

簡短的答案是否定的，沒有這樣做的功能。 http://community.createjs.com/discussions/easeljs/7828-is-there-a-way-to-convert-an-easeljs-graphics-object-to-a-base64-string

但是你可以自己做。該CreateJS使用在其底部64的編碼圖案，在被描述：http://www.createjs.com/Docs/EaselJS/classes/Graphics.html#method_decodePath

針對解碼器的源代碼是在：http://www.createjs.com/Docs/EaselJS/files/easeljs_display_Graphics.js.html#l1041

下面是一個例子的功能。但是，它只會編碼直線;它不會編碼二次或貝塞爾曲線。另外，如果我沒有記錯，它不會爲較小的x和y值優化字符串大小。如果有人有更完整的解決方案並願意分享，我很樂意看到它，因爲實際上，如果我有時間的話，我實際上計劃在下個月或兩個月後重新開始工作。

kettu.BASE_64_LIST = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z','a','b','c','d','e','f','g','h','i', 'j', 'k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z','0','1','2','3','4','5','6','7','8','9','+','/']; 

kettu.toBase64 = function(myShape) { 
    var result = ''; 
    var prevX = 0; 
    var prevY = 0; 
    for(var i = 2; i < myShape.graphics._instructions.length - 1; i++) { 
     var header; 
     var x = 0x00000; 
     var y = 0x00000; 
     if(myShape.graphics._instructions[i].f == kettu.context.lineTo || myShape.graphics._instructions[i].f == kettu.context.moveTo) { 
      if(myShape.graphics._instructions[i].f == kettu.context.lineTo) { 
       header = 'M'; 
       xStart = myShape.graphics._instructions[i].params[0] * 10 - prevX; 
       yStart = myShape.graphics._instructions[i].params[1] * 10 - prevY; 
       x = Math.abs(xStart); 
       y = Math.abs(yStart); 
       prevX += xStart; 
       prevY += yStart; 
       x1 = (x & 0xff000); 
       if (xStart < 0) x1 |= 0x20; 
       x2 = (x & 0x00fc0) >> 6; 
       x3 = (x & 0x0003f); 
       y1 = (y & 0xff000) >> 12; 
       if (yStart < 0) y1 |= 0x20; 
       y2 = (y & 0x00fc0) >> 6; 
       y3 = (y & 0x0003f); 
       x = kettu.BASE_64_LIST[x1] + kettu.BASE_64_LIST[x2] + kettu.BASE_64_LIST[x3]; 
       y = kettu.BASE_64_LIST[y1] + kettu.BASE_64_LIST[y2] + kettu.BASE_64_LIST[y3]; 
      } 
      else if(myShape.graphics._instructions[i].f == kettu.context.moveTo) { 
       header = 'E'; 
       x |= myShape.graphics._instructions[i].params[0] * 10; 
       y |= myShape.graphics._instructions[i].params[1] * 10; 
       prevX = x; 
       prevY = y; 
       x1 = (x & 0xff000) >> 12; 
       if (x < 0) x1 |= 0x20; 
       x2 = (x & 0x00fc0) >> 6; 
       x3 = (x & 0x0003f); 
       y1 = (y & 0xff000) >> 12; 
       if (y < 0) y1 |= 0x20; 
       y2 = (y & 0x00fc0) >> 6; 
       y3 = (y & 0x0003f); 
       x = kettu.BASE_64_LIST[x1] + kettu.BASE_64_LIST[x2] + kettu.BASE_64_LIST[x3]; 
       y = kettu.BASE_64_LIST[y1] + kettu.BASE_64_LIST[y2] + kettu.BASE_64_LIST[y3]; 
      } 
     } 
     result += header + x + y; 
    } 
    return result; 
}