gpt4 book ai didi

javascript - 旋转实体以查看鼠标(Craftyjs)

转载 作者:行者123 更新时间:2023-11-30 00:10:38 25 4
gpt4 key购买 nike

我一直在尝试让我的播放器实体旋转到鼠标,但是我无法触发 MouseMove 事件。

Crafty.e("2D, Mouse, Canvas, Color"
.attr({ w:1000, h:1000, x:0, y:0 })
.bind('MouseMove', function(e)
{
console.log("Mouse Pos:"+ e.x +","+e.y);
//get hero
var pos1 = {
x: e.x,
y: e.y
}
var pos2 = {
x: player.x,
y: player.y
}
player.rotation = 0;
player.rotation = -Engine.degree(pos1, pos2);


})

当我将 MouseMove 替换为 click 或 mousedown 或任何其他鼠标事件时,它会在该事件发生时旋转到鼠标。但是它从不调用 mousemove 函数。我做错了什么?

最佳答案

看看CraftyMouseFace ,一个 Crafty 组件 made by the community :

This component does the following:

  • It finds the angle between given Sprite and mouse position and triggers a Crafty event which holds information about current mouse position and calculated angle in radians and degrees.
  • Determines sprite facing direction.
  • Triggers Crafty events when a mouse buttons is pressed down or released up anywhere on the game screen.

第一个功能听起来正是您所需要的。

让我们将 MouseMoved 事件及其事件数据放在以下代码段中进行测试。
四处移动鼠标指针,注意绿色矩形如何旋转以面向指针。

Crafty.init();

Crafty.e("2D, DOM, Color, MouseFace")
.attr({x: 75, y: 75, w: 60, h: 60})
.origin("center")
.color('green')
.bind("MouseMoved", function(data) {
this.rotation = data.rad * 180 / Math.PI;
});
<script src="https://github.com/craftyjs/Crafty/releases/download/0.7.1/crafty-min.js"></script>
<script src="https://cdn.rawgit.com/petarov/CraftyMouseFace/master/src/craftyMFace.js"></script>

关于javascript - 旋转实体以查看鼠标(Craftyjs),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36660929/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com