如何应用KineticJS过滤器?

本文介绍了如何应用KineticJS过滤器?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我发现KineticJS过滤器文档非常令人沮丧，并且无法在线找到示例，尤其是考虑到亮度.

I find the KineticJS filters documentation extremely frustrating and could not find examples online, especially considering brightness.

dynamic.filters文档链接提到Kinetic.Filters.Brighten( imageData)，但没有有关如何向其传递参数或如何使用它的信息.

The kinetic.filters docs link mention a Kinetic.Filters.Brighten(imageData) but there's no info on how to pass parameters to it or how to use it.

我需要的是一个在舞台上的图层上的图像的工作示例，以及两个按钮-一个使图像更亮，一个使图像更暗.有人可以帮我吗?

All I need is a working example of an image on a layer on a stage, and two buttons - one to make the image brighter and one to make it darker. Can anyone please help me with that ?

谢谢！

推荐答案

确实，有关过滤器的文档很差.

Realy, documentation for filters is poor.

增亮滤镜示例:(kineticjs 4.5.0)

Example for Brighten filter: (kineticjs 4.5.0)

darth = new Kinetic.Image({ x: 10, y: 10, image: imageObj, draggable: true, filter: Kinetic.Filters.Brighten, filterBrightness: -50 });

要制作动画，您可以使用本教程: http ://www.html5canvastutorials/kineticjs/html5-canvas-tween-blur-filter-with-kineticjs/

for animate you can use this tutorial: www.html5canvastutorials/kineticjs/html5-canvas-tween-blur-filter-with-kineticjs/

var tween = TweenLite.to(darth, 0.6, { paused: true, setFilterBrightness: 50, onUpdate: function() { layer.batchDraw(); } });