threejs解决相机位置与target距离非常小时滚轮好像滚不动了的现象(修改target位置)
修改 OrbitControls 源码:
// 是否允许 滚轮放大查看模型时,自动修改target和相机位置使得相机可以越过模型
this.enableZoomOver = false;
function handleMouseWheel( event ) {//原代码
/**
* 问题:threejs计算缩放量通常与当前相机位置与target距离成比例,当相机位置与target距离小于1时,由于会出现滚轮好像滚不动了的现象
* 调整:当相机位置与target距离小于 1 时,同时沿着相机视线方向移动相机和target,保持其相对位置保证能一直滚轮放大查看,缩小恢复正常
*/
if (scope.enableZoomOver) {
if (scope.getDistance() < 1) {
// console.warn('距离小于1了!', scope.target);
_zoomAtZeroDistance(event.deltaY)
// console.warn('距离小于1了!新的distance', scope.getDistance());
return
}
}
//......原代码
}
/**
* 零距离缩放逻辑
*/
function _zoomAtZeroDistance (deltaY) {
const direction = new Vector3()
scope.object.getWorldDirection(direction)
// 计算移动量(反向处理滚轮方向)
const speed = 0.001 * Math.abs(scope.domElement.clientHeight)
const moveDelta = deltaY > 0 ? -speed : speed
// 沿视线方向移动相机
scope.object.position.addScaledVector(direction, moveDelta)
scope.target.addScaledVector(direction, moveDelta)
// 触发更新
scope.update()
}
解决zoomIn过近时pan平移移不动:
- let targetDistance = offset.length();
+ // 过近时保证最小平移距离
+ let targetDistance = Math.max(offset.length(), 0.5);