javascript - Bouncing image balls with KineticJS -
i'm starting out kineticjs library , been playing creating shapes etc.. however, i'm struggling create custom circle own image in it. have tried using fillpattern doesn't scale/centre correctly @ all. meant use own circle image or rectangle image , let kineticjs take care of things?
just give bit of background: want 3 balls bouncing in , settling in place.
any advice welcome.
sorted it... needed offset values
var ball = new image(); ball.src = 'ball2.jpg'; ball.height = 230; ball.width = 230; var stage = new kinetic.stage({ container: 'container', width: 1000, height: 1000 }); var circle = new kinetic.circle({ x: 300, y: 300, radius: 115, fillpatternimage: ball, fillpatternoffset :{ x: -115, y: -115 } }); var layer = new kinetic.layer(); // add shape layer layer.add(circle); // add layer stage stage.add(layer); ball.onload = function () { stage.draw(); }
Comments
Post a Comment