EaselJS colorMatrixFilter將無法在Chrome上工作

Question

我試圖在位圖對象上使用EaselJS的colorMatrixFilter緩存，然後將其用作SpriteSheet對象的源圖像，但它不適用於Chrome。它通過Firefox和Safari工作。

鉻（應該是blue狐狸）：

Safari瀏覽器：

​​

這裏是我的代碼：

lr.SpriteSheet = function (sSprite, nFrameWidth, nFrameHeight, oAnimations) { 
    var _cacheBmp = new createjs.Bitmap(sSprite); 

    return { 
     Sprite: function (oArgs) { 
      oArgs = oArgs || {}; 

      _cacheBmp.filters = oArgs.aFilters || []; 
      _cacheBmp.cache(0, 0, _cacheBmp.image.width, _cacheBmp.image.height); 
      var spriteSheet = new createjs.SpriteSheet({ 
       images: [_cacheBmp.cacheCanvas], 
       frames: {width: nFrameWidth, height: nFrameHeight}, 
       animations: oAnimations 
      }); 
      this.self = new createjs.Sprite(spriteSheet, oArgs.sAction || 0); 
      this.self.set({ 
       x: (oArgs.nX || 0) * lr.GRID, 
       y: (oArgs.nY || 0) * lr.GRID 
      }).set(oArgs.oProps || {}); 
      lr.scene.addChild(this.self); 
     } 
    } 
} 

var fox = new lr.SpriteSheet("Graphics/Fox.png", 30, 40, { 
     stand: 0, 
     run: { 
      frames: [0,0,0,0,1,1,2,3,3,4,4,4,4,3,3,2,1,1,0,0,0,0,5,5,6,7,7,8,8,8,8,7,7,6,5,5], // Easing 
      next: true 
     }, 
     jump: [10, 14, "neutral", 0.5], 
     runJump: [5, 7, "split", 0.666], 
     neutral: 15, 
     split: 8, 
     fall: 16, 
     land: [16, 20, "stand", 0.5], 
     almostFalling: [9, 9, true, 0.1] 
    }); 

var matrix = new createjs.ColorMatrix().adjustColor(-25, 10, -25, -180); 
var player = new fox.Sprite({ 
    nX: 1, nY: 1, 
    oProps: {regX: 7, regY: 6}, 
    nWidth: 11, nHeight: 30, 
    aFilters: [new createjs.ColorMatrixFilter(matrix)], 
    sAction: "run", 
    aPush: [lr.movable, lr.collidable] 
}); 

我已經試過檢查_cacheBmp.filters值，並將其返回[colorMatrixFilter]，我認爲這是正確的。有人能幫我嗎？

Answer 1

看起來我要回答我自己的問題again。這是一個愚蠢的錯誤無論如何...

經過大量的時間，試圖解決一個不存在的跨源安全問題，我發現問題發生的原因是我本地測試（file:///）和過濾器或緩存不適用於某些瀏覽器。

如果你有完全相同的問題，就去localhost。