我目前正在开发一个 three.js 项目,在该项目中我使用 TrackballControls.js 进行相机控制。在我的场景中,我使用 OBJMTLLoader 加载的对象很少。我必须从场景中选择单个对象,并且需要放大和缩小这些单个对象。我能够使用具有以下功能的鼠标事件获得结果。
function onDocumentMouseDown( event ) {
myobj = null;
mouse_obj=null;
event.preventDefault();
controls.enabled = false;
var vector = new THREE.Vector3( mouse.x, mouse.y, 0.5 );
projector.unprojectVector( vector, camera );
var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
var intersects = raycaster.intersectObjects( objects, true );
if ( intersects.length > 0 ) {
SELECTED = intersects[ 0 ].object.parent;
myobj = intersects[ 0 ].object.parent; // selects the intersected object
var intersects = raycaster.intersectObject( plane );
offset.copy( intersects[ 0 ].point ).sub( plane.position );
container.style.cursor = 'move';
}
}
上面的代码选择对象,下面的代码放大和缩小滚动事件。
onRendererScroll = function(event) {
controls.enabled = true;
if(myobj!=null)
{
var delta=0;
event.preventDefault();
event.stopPropagation();
//alert(myobj.position.x+ ' ' +event.clientX+ ' ' +myobj.position.y+ ' ' +event.clientY);
if ( event.wheelDelta ) { // WebKit / Opera / Explorer 9
delta = event.wheelDelta / 40;
} else if ( event.detail ) { // Firefox
delta = - event.detail / 3;
}
myobj.scale.x = myobj.scale.x+delta*0.01;
myobj.scale.y = myobj.scale.y+delta*0.01;
myobj.scale.z = myobj.scale.z+delta*0.01;
}
}
但是我必须使用触摸事件来实现相同的功能。我试图使用这个想法,但无法成功。我试图实现从鼠标事件中获得的相同想法。我正在处理的代码如下。谁能帮我解决这个问题..?我不想让我的代码被调试。我只是想知道如何实现它。
onDocumentTouchMove=function(event) {
event.preventDefault();
if (event.touches.length === 2)
{
controls.enabled = true;
mouse.x = (((event.touches[0].pageX-(curX+12))/width)*2-1)-(((event.touches[1].pageX-(curX+12))/width)*2-1);
mouse.y = (-((event.touches[0].pageY-curY)/height)*2+1)-(-((event.touches[1].pageY-curY)/height)*2+1);
if(myobj!=null)
{
var delta=0;
event.preventDefault();
event.stopPropagation();
delta=Math.sqrt( mouse.x * mouse.x + mouse.y * mouse.y );
myobj.scale.x = myobj.scale.x+delta*0.01;
myobj.scale.y = myobj.scale.y+delta*0.01;
myobj.scale.z = myobj.scale.z+delta*0.01;
}
}
}
onDocumentTouchStart=function(event) {
event.preventDefault();
controls.enabled = false;
if (event.touches.length === 1)
{
myobj = null;
var vector = new THREE.Vector3( mouse.x, mouse.y, 0.5 );
projector.unprojectVector( vector, camera );
var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );
var intersects = raycaster.intersectObjects( objects, true );
if ( intersects.length > 0 ) {
SELECTED = intersects[ 0 ].object.parent;
myobj = intersects[ 0 ].object.parent;
var intersects = raycaster.intersectObject( plane );
offset.copy( intersects[ 0 ].point ).sub( plane.position );
}
}
}
onDocumentTouchEnd=function(event) {
event.preventDefault();
controls.enabled = false;
if ( INTERSECTED ) {
plane.position.copy( INTERSECTED.position );
SELECTED = null;
}
}