Ziehe die Linie in Richtung Rajaster in three.js

Question

In three.js benutze ich PointerLock steuert den grundlegenden Ego-Shooter. Ich benutze

function onDocumentMouseDown(event) { 
    var raycaster = new THREE.Raycaster(); 
    mouse3D.normalize(); 
    controls.getDirection(mouse3D); 
    raycaster.set(controls.getObject().position, mouse3D); 
    var intersects = raycaster.intersectObjects(objects); 
    ... 
} 

eine Kollision mit einem Objekt zu erfassen, die Sie „Schuss“ das Objekt bedeutet.

Jetzt möchte ich den Weg der Kugel visualisieren. Ich dachte darüber nach, eine Linie von der Stelle aus zu zeichnen, auf die der Benutzer schaut, in Richtung des Radfahrers, aber ich kann mir nicht vorstellen, wie das geht ... Wer kann mir helfen? Ich bin neu bei three.js, hätte nie gedacht, eine Linie zu zeichnen, wäre so schwer.

Update: Ich versuche, eine Linie zu zeichnen mit:

var geometry = new THREE.Geometry(); 
geometry.vertices.push(...); 
geometry.vertices.push(...); 
var line = new THREE.Line(geometry, material); 
scene.add(line); 

aber ich kann nicht herausfinden, was anstelle der „...“ zu setzen. Wie kann ich erkennen, an welchen Punkt die Linie gehen soll? Und wie kann man feststellen, von welchem ​​Punkt es ausgeht? Der Spieler kann sich bewegen und sogar springen, also ist der Startpunkt immer auch anders.

Answer 1

Sie können die folgenden (mit R83) verwenden:

// Draw a line from pointA in the given direction at distance 100 
    var pointA = new THREE.Vector3(0, 0, 0); 
    var direction = new THREE.Vector3(10, 0, 0); 
    direction.normalize(); 

    var distance = 100; // at what distance to determine pointB 

    var pointB = new THREE.Vector3(); 
    pointB.addVectors (pointA, direction.multiplyScalar(distance)); 

    var geometry = new THREE.Geometry(); 
    geometry.vertices.push(pointA); 
    geometry.vertices.push(pointB); 
    var material = new THREE.LineBasicMaterial({ color : 0xff0000 }); 
    var line = new THREE.Line(geometry, material); 
    scene.add(line); 

Codepen an: https://codepen.io/anon/pen/evNqGy