EaseJS color filter
HTML
<script src="https://code.createjs.com/easeljs-0.8.2.min.js"></script>
<canvas id="filter" width="800" height="600">
JavaScript
var stage = new createjs.Stage("filter");
var head = new createjs.Container();
head.x = 300;
head.y = 300;
head.regX = 100;
head.regY = 100;
var path = "https://rawgit.com/hamilton-lima/javascript-samples/master/easejs/colorfilter/";
var layer1, img = new Image();
img.crossOrigin = "Anonymous";
img.onload = function() {
layer1 = new createjs.Bitmap(img);
layer1.filters = [
new createjs.ColorFilter(0, 0, 0, 1, 0, 0, 100, 1)
];
layer1.cache(0,0,50,50);
head.addChildAt(layer1, 0);
}
img.src = path + "layer1.png";
/* var layer2 = new createjs.Bitmap(path + "layer2.png"); */
/* head.addChild(layer2); */
stage.addChild(head);
createjs.Ticker.addEventListener("tick", handleTick);
function handleTick() {
stage.update();
}