我在读这文章如何使飞船跟随光标使用CreateJS TUTS +，我想知道我怎样才能使朝鼠标位置的实体举措，但是它旋转得面对的问题。
这是没有旋转和代码的示例的小提琴
var canvas = document.getElementById("Canvas");
var ship;
var stage;
var assets;
var loader;
var serverString = "http://source.tutsplus.com/gamedev/authors/JamesTyner/SmoothMoves/";
var stageHeight = 600;
var stageWidth = 600;
var shipHeight = 64;
var shipWidth = 64;
var easingAmount = 0.15;
var text;
stage = new createjs.Stage(canvas);
assets = [];
manifest = [{
src: serverString + "ship.png",
id: "character"
}];
loader = new createjs.LoadQueue(false);
loader.onComplete = handleComplete;
loader.onFileLoad = handleFileLoad;
loader.loadManifest(manifest);
function handleFileLoad(event) {
var id = event.item.id;
var result = loader.getResult(id);
ship = new createjs.Bitmap(result);
ship.x = (stageWidth / 2) - shipWidth;
ship.y = stageHeight - shipHeight;
ship.regX = shipWidth/2;
ship.regY = shipHeight/2;
}
function handleComplete() {
stage.addChild(ship);
text = new createjs.Text("Click To Activate", "20px Arial", "#000000");
text.x = 200;
text.y = stageHeight / 2;
stage.addChild(text);
stage.update();
}
stage.onMouseDown = function () {
stage.removeChild(text);
createjs.Ticker.addEventListener("tick", tick);
};
function tick(event) {
var xDistance = stage.getStage().mouseX - ship.x;
var yDistance = stage.getStage().mouseY - ship.y;
var distance = Math.sqrt(xDistance * xDistance + yDistance * yDistance);
if (distance > 1) {
ship.x += xDistance * easingAmount;
ship.y += yDistance * easingAmount;
}
stage.update();
}
谢谢你们
首先计算船与鼠标指针之间的角度（以度为单位）：
var mousePointerPosition = {
x: stage.getStage().mouseX,
y: stage.getStage().mouseY
};
var spaceShipPosition = {
x: ship.x,
y: ship.y
};
var angle = Math.atan2(
spaceShipPosition.y - mousePointerPosition.y,
spaceShipPosition.x - mousePointerPosition.x
) * 180 / Math.PI;
然后旋转飞船：
ship.rotation = ( angle > 180 ? -angle : angle ) + 90;
如果angle超过180，则将角度反转以使船转向另一个方向。我还增加+ 90了角度，因为船相对于鼠标位置旋转了90度。
Js Fiddle：http : //jsfiddle.net/nkZjR/200/
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句