Javascript 带PixiJS的交互式图形-鼠标盖不'；不要开火，而单击可以

尝试在将鼠标悬停在图形元素上时触发事件。 click事件按预期工作，但鼠标悬停似乎未启动

以下是fiddlejs链接的摘录：

var renderer = PIXI.autoDetectRenderer(500, 500, null, true);
var stage = new PIXI.Stage(0xFFFFFF);
stage.interactive = true;

document.getElementById("canvas").appendChild(renderer.view);

var rect = new PIXI.Graphics();
rect.lineStyle(1, 0x000);

rect.interactive = true;
rect.hitArea = new PIXI.Rectangle(0,0, 200, 200);
rect.drawRect(0,0, 200,200);
rect.click = function(ev) { console.log("clicked"); }
rect.mouseover = function(ev) { console.log("over"); }
stage.addChild(rect);

renderer.render(stage);

FiddleJS链接：

也许我应该使用精灵而不是图形元素

---

谢谢

PIXI.InteractionManager在其update（）函数中处理mouseover和mouseout事件。为了从这些事件中获得响应，您需要在每一帧中不断更新渲染器

var renderer = PIXI.autoDetectRenderer(500, 500, null, true);
var stage = new PIXI.Stage(0xFFFFFF);
stage.interactive = true;

document.getElementById("canvas").appendChild(renderer.view);

var rect = new PIXI.Graphics();
rect.lineStyle(1, 0x000);

rect.interactive = true;
rect.hitArea = new PIXI.Rectangle(0,0, 200, 200);
rect.drawRect(0,0, 200,200);
rect.click = function(ev) { console.log("clicked"); }
rect.mouseover = function(ev) { console.log("over"); }
stage.addChild(rect);

update();
function update(){
    requestAnimFrame(update);
    renderer.render(stage);
};