graphics - Three.js / WebGL でオブジェクト境界を作成するにはどうすればよいですか?

Question

私はグラフィックスに不慣れで、ゲームのオブジェクト境界を作成する方法を考えていました。

現在、マウスを追跡するオブジェクトがあります。私の船のrotation.zが0の場合、これは私の境界では問題なく機能します。しかし、船を回転させると、境界は奇妙な動作をします。

船の世界位置を取得して、x と y の境界を簡単に確認してみました。ただし、回転すると、世界の位置が異なる x と y を与えるようです。船のすべての回転で機能する境界を作成するにはどうすればよいですか?

これが私のゲームです（助けのために衝突はオフになっています）：http://www.cis.gvsu.edu/~chaua/CS371/WebGLProject/home.html

私が望む動作は、船を回転させていないときに発生します。左右のマウスで船を回転させます。

関連するコード スニペット (レンダリング ループ内):

if(mouseLeftDown)
        ship.rotation.z += leanSpeed;
if(mouseRightDown)
        ship.rotation.z += -leanSpeed;
....
....

targetX = ((lastMouseX / window.innerWidth) * 2 - 1) * 90;
targetY = -((lastMouseY / window.innerHeight) * 2 - 1) * 60;

var worldPosition = (new THREE.Vector3()).getPositionFromMatrix(ship.matrixWorld);

if(worldPosition.x + targetX <= (randSpawnWidth/2)-500 && worldPosition.x + targetX >= -(randSpawnWidth/2)+500)
    ship.translateX(targetX);
if(worldPosition.y + targetY <= (randSpawnHeight/2)-500 && worldPosition.y + targetY >= -(randSpawnHeight/2)+500)
    ship.translateY(targetY);

助けていただければ幸いです。ありがとう！