僞造一幅畫布 - 可以工作嗎？

我試圖「僞造」一個畫布，用這個內容將這個僞造的畫布交給一個可能是任意的框架來後處理所有的line-，curve-和moveTo。僞造一幅畫布 - 可以工作嗎？

爲了解決這個問題，我嘗試了這個代碼，它實際上工作正常，但是我想知道在這次幸運的拍攝中我有多幸運。

(function(){ 
    function DebugCanvas(){ 
     this._dom = document.createElement('canvas'); 
     addPropertiesToObject.call(this, this._dom); 
     this._fakeContext = null; 
    } 

    Object.defineProperties(DebugCanvas.prototype, 
    { 
     'constructor' : { 
      'value' : DebugCanvas, 
      'enumerable' : true 
     }, 

     'getContext' : { 
      'value' : function(which){ 
       var ctx; 
       if(which == '2d'){ 
        if(this._fakeContext == null){ 
         this._fakeContext = new FakeContext(this._dom); 
        } 
        ctx = this._fakeContext; 
       } else { 
        ctx = this._dom.getContext(which); 
       } 
       return ctx; 
      }, 
      'enumerable' : true 
     } 
    } 
); 

function FakeContext(debugCanvas){ 
    this._debugCanvas = debugCanvas; 
    this._realContext = debugCanvas._dom.getContext('2d'); 
    addPropertiesToObject.call(this, this._realContext); 
} 

Object.defineProperties(FakeContext.prototype, { 
    'toString' : { 
     'value' : function(){ 
      return '[Object FakeContext]'; 
     }, 
     'enumerable' : true 
    }, 

    'canvas' : { 
     'get' : function(){ 
      return this._debugCanvas; 
     }, 
     'set' : function(c){ return }, 
     'enumerable' : true 
    } 
}); 

function addPropertiesToObject(from){ 
    var description, obj; 

    for(var prop in from){ 
     obj = from; 
     do { 
      if(obj.hasOwnProperty(prop) && 
       !this.constructor.prototype.hasOwnProperty(prop)){ 

       try{ 
        description = Object.getOwnPropertyDescriptor(obj, prop); 
        Object.defineProperty(this.constructor.prototype, prop, description); 
       } catch(err){ 
        this[ prop ] = from[ prop ]; 
       } 
       break; 
      } 
     } while(obj = Object.getPrototypeOf(obj)); 
    } 
}; 
})()

的基本想法是，只要他們是複製所有的畫布，canvas.prototypes'（所有的鏈向上），上下文和context.prototypes'屬性假冒對象的原型中，不在那裏。

來源

2012-09-09 philipp

使用真正的畫布有什麼問題？ – Kristian

»後處理所有繪圖命令«，這就是爲什麼。 – philipp

在JavaScript中，您可以自由地構建替換對象，其中包含與原始屬性相同的所有屬性/方法，並用它代替原始對象。方法調用或屬性訪問將是相同的，調用代碼通常不會知道區別。這在javascript中可能是一件非常有用的事情。

像這樣的替換的更復雜的部分是模擬所有方法和屬性的實際行爲，以便您將它傳遞到的代碼按您的要求工作。但是，如果你能成功地做到這一點，它應該可以正常工作。沒有涉及到運氣 - 只要你對方法/屬性的模擬是正確的，這應該是有效的。

來源

2012-09-09 17:04:21 jfriend00

它實際上適用於我設置的測試環境。我只是不確定我無法效仿哪種行爲... – philipp

@ philipp - 這是一個很難的部分，尤其是對於你選擇的豐富對象。它將完全取決於你傳遞假對象的代碼以嘗試使用它以及它期望的結果。 – jfriend00

重寫上下文的所有回調，以便我可以交出座標。這裏描述的意圖在這裏描述：http://gamedev.stackexchange.com/questions/14323/scrolling-box2d-debugdraw接下來，能夠在那裏交付可以相當不錯的其他框架，如處理 – philipp

僞造一幅畫布 - 可以工作嗎？

回答

相關問題