Три JS Orbit Control Zoom,Pan & Move Listener
Я знаю, есть EventListener для управления орбитой, который запускает "изменения", но мне нужно, чтобы слушатели были более конкретными, такими как масштабирование, панорамирование и перемещение. Есть ли что-то подобное уже реализовано?
Ищете что-то подобное:
var controls = new THREE.OrbitControls( camera, renderer.domElement );
controls.addEventListener( 'onpan', myPanFunction );
controls.addEventListener( 'onzoom', myZoomFunction );
controls.addEventListener( 'onmove', myMoveFunction );
Или что-то типа того:
var controls = new THREE.OrbitControls( camera, renderer.domElement );
controls.addEventListener( 'change', myFunction(event){
switch (event){
case pan:
//do something
break;
case zoom:
//do something
break;
case move:
//do something
break;
default:
break;
}
});
Я надеюсь, что ясно, чего я хочу достичь.
1 ответ
Решение
Хорошо, я решил это, просто слушая mousedown события в сочетании с mousemove. Это может быть не практичным во всех случаях, но для меня это сработало:
canvas = document.getElementById("canvas")
canvas.addEventListener("mousedown", function(e){
// on rotate
if(e.button === 0 && currentTutorialPage === 0 && tutorial){
canvas.onmousemove = function(e) {
// do something
}
}
// on zoom
else if(e.button === 1 && currentTutorialPage === 1){
canvas.onmousemove = function(e) {
// do something
}
}
// on pan
else if(e.button === 2 && currentTutorialPage === 2){
canvas.onmousemove = function(e) {
// do something
}
}
});
// remove eventListener
canvas.addEventListener("mouseup", function(e){
canvas.onmousemove = null
});