three.js - Raycasterの視覚化

Question

レイキャストを使って交差点を検出しようとしています。私の現在の問題は、レイキャストが目的の方向を目指しているかどうかわからないことです。だから私の一般的な質問は：レイキャストを見えるようにする方法はありますか？もしそうなら：それはどのように行われますか？これは私に大いに役立ちます。

マイケル

Answer 1

raycsterを表示する別の方法は次のとおりです。

scene.add(new THREE.ArrowHelper(raycaster.ray.direction, raycaster.ray.origin, 300, 0xff0000) );

Answer 2

原点から光線の方向に線を引いてみませんか。

より具体的には（r83を使用）：

    // 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：https ://codepen.io/anon/pen/evNqGy