Question

我正在使用kineticjs 5.1.0开发一些应用程序，并从kineticjs开始。

此应用程序可以更改图像的src属性，因此onLoad方法将被称为未知的次数。

它还有滑块来控制旋转，缩放，不透明度以及用jquery控制的一些滤镜的强度。

但是我无法同时应用不透明度和过滤。

此时，在加载时（onLoad），我重置所有转换值（旋转，缩放，偏移，滤镜和不透明度）。

leftImage.onload=function(){
    layer.add(imagenIzquierda);
    stage.add(layer);
    imagenIzquierda.cache();
    imagenIzquierda.filters([Kinetic.Filters.Brighten]);
    anchoIzquierdo=this.naturalWidth;
    altoIzquierdo=this.naturalHeight;
    escalaIzquierda=200/altoIzquierdo;
    $("#zoomIzquierdo").slider("option", "value", escalaIzquierda*100);
    $("#opacidadIzquierda").slider("option","value",100);
    $("#rotacionIzquierda").slider("option", "value", 0);
    imagenIzquierda.position({x: anchoIzquierdo/2*escalaIzquierda, 
                              y:altoIzquierdo/2*escalaIzquierda});
    imagenIzquierda.offset({x: anchoIzquierdo/2, y: altoIzquierdo/2});
    imagenIzquierda.scale({x: escalaIzquierda, y: escalaIzquierda});
    imagenIzquierda.rotation(0);
    imagenIzquierda.opacity(1);
    layer.draw();
};

在滑块幻灯片事件中，我只需设置值，就像这样

                $("#opacidadIzquierda").on("slide", function(event, ui){
                imagenIzquierda.opacity(ui.value/100);
                stage.draw();
            });

我的观察结果是，如果存在缓存，则不透明度无效，但如果没有缓存，则无法应用滤镜。我应该怎么做呢？

编辑：

经过大量的Google搜索后，我想出了https://github.com/ericdrowell/KineticJS/issues/847，仔细查看发布时间表告诉我的确，“不透明度不会影响缓存的形状https://github.com/ericdrowell/KineticJS/issues/847”

我所做的是清除缓存，保存/重置偏移，旋转和缩放，应用不透明度，缓存以及重新应用旧偏移，旋转和缩放以及过滤器。结果是，现在改变不透明度很慢，因为这些计算在滑块移动时发生，以便获得“实时视图”。

我在使用缓存时如何应用不透明度？

0 个答案: