Mask and Cache

by lannymcnie

HTML

<script src="https://code.createjs.com/createjs-2015.11.26.combined.js"></script>
<canvas id="canvas" width="800" height="600"></canvas>

JavaScript

var stage = new createjs.Stage("canvas");
createjs.Ticker.on("tick", tick);

// Create 2 shapes
var s = new createjs.Shape().set({x:10, y:10});
s.graphics.f("red").ss(4).s("blue").rr(0,0,100,100,10);
var s2 = s.clone().set({x:150});
stage.addChild(s, s2);

// 1. Mask
s.mask = new createjs.Shape(new createjs.Graphics().dr(8,8,50,50));

// 2. Cache
s2.cache(-2,-2,50,50);

function tick(event) {
    stage.update(event);
}