Проблема с MouseEvent для 3d модели на Three.js

Question

Я недавно начал экспериментировать с three.js, я пытаюсь воспроизвести MouseEvent, чтобы 3D-модель слегка перемещалась, как если бы она следовала за курсором, всегда оставаясь в середине страницы.С небольшим количеством кода, написанного мной, я немного осмотрелся, я пришел к точке, где 3d-модель следует за курсором, но наоборот, в том смысле, что когда я перемещаю курсор в левую часть каркасаНапример, 3d модель движется вправо.Я также заметил, что чем ближе я подхожу к углам каркаса, тем больше 3D-модель становится меньше, хотя я хотел бы убедиться, что она всегда остается в своем первоначальном размере.

Кроме того, я хотел быУбедитесь, что при сжатии каркаса до размера, не являющегося рабочим столом, 3D-модель не делает ничего из этого, оставаясь в середине страницы.

код выглядит следующим образом:

var container, stats;
var camera, scene, renderer;
var mouseX = 0, mouseY = 0;
var windowHalfX = window.innerWidth / 2;
var windowHalfY = window.innerHeight / 2;
init();
animate();
function init () {
container = document.createElement('div' );
document.body.appendChild( container );
camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 1000 );
camera.position.z = 15;

//model

var loader = new THREE.ObjectLoader();

loader.load("/models/skull.json",function ( obj ) {

var box = new
THREE.Box3().setFromObject( obj );
var center = new THREE.Vector3();
box.getCenter ( center );
obj.position.sub (center);
obj.rotation.y = Math.PI;
scene.add ( obj );
});

renderer = new THREE.WebGLRenderer();
renderer.setPixelRatio( window.devicePixelRatio);
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild ( renderer.domElement );
document.addEventListener('mousemove', onDocumentMouseMove, false );

window.addEventListener ('resize', onWindowResize, false );
}

function onWindowResize() { windowHalfX = window.innerWidth;
windowHalfY = window.innerHeight;
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight );
}

function onDocumentMouseMove( event ) {
mouseX = (event.clientX - windowHalfX ) / 2;
mouseY = ( event.clientY - windowHalfY ) / 2;
}

function animate () {
requestAnimationFrame ( animate );
render();
}

function render89 {
camera.position.x += (mouseX - camera-position.x ) * .01;
camera.position.y += ( - mouseY - camera.position.y ) * .01;
camera.lookAt ( scene.position );
renderer.render ( scene, camera );
}

На этом изображении, например, у меня был курсор в правом нижнем углу.

Заранее большое спасибо.