javascript - Easljs 对位图应用滤镜

Question

我正在尝试弄清楚如何使用 easljs 为视频源添加过滤器。根据文档，我可以将过滤器设置为 bitmap.filtes 属性。但这似乎不起作用。没有错误或任何东西，只是根本没有应用过滤器。

关于文档的一个混淆是，它提到必须在显示对象上调用 cache() 才能应用过滤器，但对于 bitmap 类，它表示不应调用 cache()。

下面是我用作测试的代码:

var stage = new createjs.Stage('screen');

var video =  document.getElementById('source');
var bitmap = new createjs.Bitmap(video);

bitmap.scaleX = 0.44;
bitmap.scaleY = 0.44;
bitmap.y = 30;

bitmap.filters = [
    new createjs.ColorFilter(0,0,0,1,255,0,0),
    new createjs.BoxBlurFilter(5, 5, 10)
];

stage.addChild(bitmap);

Answer 1

有关位图和过滤器的文档具有误导性 - 我将确保在下一个版本中对其进行更新。

应避免缓存位图，因为它不会提供任何性能优势，您将从缓存容器、形状和文本中获得性能优势。事实上，它甚至会降低性能，因为它会使用额外的内存来存储缓存版本

但是您必须缓存位图以对其应用过滤器。向您的示例添加一个缓存调用，它应该可以工作。

对于文档引起的任何混淆，我们深表歉意。