Three.js r152 画布上不增加其他物体，触摸滑动显示线条，触摸结束线条消失

你可以使用Three.js的Raycaster来检测触摸事件，并在触摸移动时创建线条，触摸结束时将其删除。以下是示例代码：

var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// 创建一个平面作为触摸检测区域
var planeGeometry = new THREE.PlaneBufferGeometry(10, 10);
var planeMaterial = new THREE.MeshBasicMaterial({ color: 0xffffff, side: THREE.DoubleSide });
var planeMesh = new THREE.Mesh(planeGeometry, planeMaterial);
planeMesh.position.set(0, 0, -5);
scene.add(planeMesh);

// 创建线条对象
var lineMaterial = new THREE.LineBasicMaterial({ color: 0xff0000 });
var lineGeometry = new THREE.BufferGeometry().setFromPoints([]);
var line = new THREE.Line(lineGeometry, lineMaterial);
scene.add(line);

// 创建射线对象
var raycaster = new THREE.Raycaster();
var mouse = new THREE.Vector2();

function onTouchStart(event) {
  event.preventDefault();
  // 将触摸坐标转换为标准设备坐标(-1 到 1)
  mouse.x = (event.touches[0].clientX / window.innerWidth) * 2 - 1;
  mouse.y = -(event.touches[0].clientY / window.innerHeight) * 2 + 1;
}

function onTouchMove(event) {
  event.preventDefault();
  mouse.x = (event.touches[0].clientX / window.innerWidth) * 2 - 1;
  mouse.y = -(event.touches[0].clientY / window.innerHeight) * 2 + 1;
  
  // 将射线从相机发射
  raycaster.setFromCamera(mouse, camera);
  // 获取射线与平面的交点
  var intersection = raycaster.intersectObject(planeMesh)[0];
  
  // 更新线条的顶点位置
  if (intersection) {
    line.geometry.setFromPoints([new THREE.Vector3(0, 0, -5), intersection.point]);
  }
}

function onTouchEnd(event) {
  event.preventDefault();
  // 删除线条
  line.geometry.setFromPoints([]);
}

window.addEventListener('touchstart', onTouchStart, false);
window.addEventListener('touchmove', onTouchMove, false);
window.addEventListener('touchend', onTouchEnd, false);

camera.position.z = 5;

function animate() {
  requestAnimationFrame(animate);
  renderer.render(scene, camera);
}
animate();

在这个示例中，我们创建了一个平面作为触摸检测区域，并使用Raycaster获取射线与平面的交点。在触摸移动时，我们更新线条的顶点位置以显示线条，并在触摸结束时删除线条。