Javascript 带有three.js和gsap的Mousemove事件

我正在尝试执行mousemove事件，当鼠标悬停在网格上时，网格将缩放，然后当鼠标不再悬停在网格上时，网格将恢复到其原始大小。所以我一直在看其他的例子，他们没有使用gsap。我见过的最接近的一个是tween.js，所以我的语法可能是错误的，但我不知道如何纠正它

这是我的功能

function onMouseMove(event) {
 //finding position of mouse
                event.preventDefault();
                mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
                mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
                raycaster.setFromCamera(mouse,camera);

      // meshes included in mousemove
                objects.push( mesh);
                objects.push( mesh2 );

//including objects into intersects

                var intersects = raycaster.intersectObjects(objects, true);

    //if statement for intersection
                if ( intersects.length > 0 ) {

                    if ( intersects[ 0 ].object != INTERSECTED ) 
                    {
                        if ( INTERSECTED ) 
//gsap animation
                            INTERSECTED.gsap.to(intersects[0].object.scale, {duration: .7, x: 1.2, y:1.2});
                            INTERSECTED = intersects[ 0 ].object;


                    }
                } else {// there are no intersections 
                        // restore previous intersection object to its original size
                        if ( INTERSECTED ) 
                        gsap.to(intersects[0].object.scale, {duration: .7, x: 1, y:1});

                            INTERSECTED = null;

                }
            }

有了这个，我得到了一个错误： 无法读取未定义的属性“object” 在onMouseMove

但是，当我以前使用未定义的

对象执行for循环时，代码可以工作，但我只需要再次缩小它

以下是我的for循环：

 for(var i = 0; i < intersects.length; i++) {
                    gsap.to(intersects[i].object.scale, {duration: .7, x: 1.2, y:1.2});
                };

使用此更新的代码进行尝试：


让摄影机、场景、渲染器、立方体、立方体1；
让雷卡斯特；
让mouse=new THREE.Vector2（），INTERSECTED=null；
常量对象=[]；
init（）；
制作动画（）；
函数init（）{
摄像头=新的三个透视摄像头（70，window.innerWidth/window.innerHeight，0.1100）；
摄像机位置z=20；
场景=新的三个。场景（）；
const geometry=新的三个.BoxBufferGeometry（3,3,3）；
const material=new THREE.MeshBasicMaterial（{color:0x00ff00}）；
立方体=新的三个网格（几何体、材质）；
立方体位置y=5；
场景.添加（立方体）；
const geometry1=新的三点几何（3,3,3）；
const material1=新的三个.MeshBasicMaterial（{color:0x00ff00}）；
cube1=新的三网格（几何1，材料1）；
场景。添加（立方体1）；
raycaster=new-THREE.raycaster（）；
renderer=new THREE.WebGLRenderer（{antialas:true}）；
renderer.setPixelRatio（window.devicePixelRatio）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
addEventListener（'mousemove'，onMouseMove，false）；
}
mouseMove函数（事件）{
event.preventDefault（）；
mouse.x=（event.clientX/window.innerWidth）*2-1；
mouse.y=-（event.clientY/window.innerHeight）*2+1；
raycaster.setFromCamera（鼠标、相机）；
//包含在mousemove中
对象。推（立方体）；
对象。推送（立方体1）；
var intersects=raycaster.intersectObjects（objects，true）；
如果（相交长度>0）{
变量对象=与[0]相交。对象；
如果（对象！==相交）{
相交=对象；
gsap.to（INTERSECTED.scale，{duration.7，x:1.2，y:1.2}）；
}
}否则{
如果（相交！==null）{
gsap.to（INTERSECTED.scale，{duration.7，x:1，y:1}）；
相交=空；
}
}
}
函数animate（）{
请求动画帧（动画）；
渲染器。渲染（场景、摄影机）；
}
正文{
保证金：0；
}
帆布{
显示：块；
}

你能用一个实例来说明这个问题吗？你可以使用这把小提琴上的代码：Hi@Mugen87。这是我的fiddle[link]（）我用for循环演示了我的缩放，但我希望当鼠标不再在带有gsap的对象上方悬停时，它能再次缩小。我已经注释掉了我试图使用的if语句