如何克隆具有已缓存过滤器的 easeljs 位图。

Question

...

let blurFilter = new createjs.BlurFilter(blurX, blurY, blurQuality);
bitmap.filters = [blurFilter];
bitmap.cache(0, -blurY, this.width, this.height + blurY);

...

bitmap.clone() doesn't clone the cached bitmap with filters. It only clones the original file image.

I don't want to apply filters twice as it will take lot of time and resources

Answer 1

由于 DisplayObjects 不克隆它们的缓存（这可能会产生一些意想不到的结果），您可以简单地自己分配缓存：

var bmp2 = bmp1.clone();
bmp2.cacheCanvas = bmp1.cacheCanvas;
bmp2.bitmapCache = bmp2.bitmapCache; // Also required for version 1.0+

请注意，如果您使用 updateCache().

更新其中一个位图，这两个实例都会更新

我经常使用的一种方法是简单地将 cacheCanvas 作为新位图的来源。如果您使用比例因子，则必须适应它。

var bmp2 = new createjs.Bitmap(bmp2.cacheCanvas);

如果您使用 WebGL 缓存（通过 StageGL），这种方法不会工作。

希望对您有所帮助。

如何克隆具有已缓存过滤器的 easeljs 位图。

How to clone easeljs bitmap which has filters on it that been cached.

javascript

createjs

easeljs