Pixi bunny with mouse offset w/o texture load
HTML
<script src="http://planetinaction.com/library/pixi.js"></script>
<div id="logarea">log data</div>
CSS
margin: 0;
padding: 0;
background-color: #000000;
JavaScript
var renderer = PIXI.autoDetectRenderer(800, 600, { antialias: true });
document.body.appendChild(renderer.view);
// create the root of the scene graph
var stage = new PIXI.Container();
stage.interactive = true;
var container = new PIXI.Container();
stage.addChild(container);
container.rotation = -0.6;
var graphics = new PIXI.Graphics();
graphics.interactive = true;
// set a fill and line style
graphics.beginFill(0xFF3300);
graphics.lineStyle(10, 0xffd900, 1);
graphics.lineStyle(2, 0x0000FF, 1);
graphics.drawRect(10, 150, 200, 10);
graphics.on('mousemove', handleMouseMove);
container.addChild(graphics);
// run the render loop
animate();
function handleMouseMove(event){
var pos = event.data.getLocalPosition(graphics);
$("#logarea").text('x:' + pos.x + 'y:' + pos.y);
}
function animate() {
renderer.render(stage);
requestAnimationFrame( animate );
}