How to use the Raycaster function from three

Find comprehensive JavaScript three.Raycaster code examples handpicked from public code repositorys.

52
53
54
55
56
57
58
59
60

// mouse tracking
var mouse = new three.Vector2();
var mouseV3 = new three.Vector3();
var mousePlane = new three.Plane(new three.Vector3(0, 0, 1), 0);
var raycaster = new three.Raycaster();

// raycast objects
var intersectObjects = [];
fork icon271
star icon0
watch icon0

+ 32 other calls in file

23
24
25
26
27
28
29
30
31
32
const {
  camera,
  resetPosition = new three.Vector3(0, 0, 0),
} = options;

const raycaster = new three.Raycaster();
const position = resetPosition.clone();
const plane = new three.Plane(new three.Vector3(0, 0, 1), 0);

const updatePosition = (coords) => {
fork icon271
star icon0
watch icon1

+ 19 other calls in file

832
833
834
835
836
837
838
839
840
841
class LODRaycast {
    constructor() {
        this.subdivisionRays = 1;
        this.thresholdUp = 0.6;
        this.thresholdDown = 0.15;
        this.raycaster = new three.Raycaster();
        this.mouse = new three.Vector2();
        this.powerDistance = false;
        this.scaleDistance = true;
    }
fork icon75
star icon468
watch icon0

31
32
33
34
35
36
37
38
39
40
if (!this.controller.active) {
  return;
}
var vector = new THREE.Vector3(0, -1, 0);
vector.applyQuaternion(this.controller.quaternion);
var raycaster = new THREE.Raycaster(this.controller.position, vector);
var intersects = raycaster.intersectObjects(this.intersectArr);
if (intersects.length > 0) {
  for (var i = 0;i < intersects.length;i++) {
    if (this.lastActiveCreature !== intersects[i].object.parent.parent) {
fork icon11
star icon33
watch icon10

411
412
413
414
415
416
417
418
419
420
this.brainboundingbox = null;
this.last_anim_timestamp = null;
this.mouseHandler = null;
this.nodeParticleTexture = NODE_PARTICLE_IMAGE;
this.min_radius = null;
this.raycaster = new THREE.Raycaster();
this.trackControls = null;
this.backgroundColor = 0xffffff;
this.renderer = null;
this.camera = null;
fork icon7
star icon21
watch icon7

+ 3 other calls in file

43
44
45
46
47
48
49
50
51
52
var mouseUpEvent = { type: "mouseUp", mode: scope.mode };
var objectChangeEvent = { type: "objectChange" };

// Reusable utility variables

var ray = new THREE.Raycaster();

var _tempVector = new THREE.Vector3();
var _tempVector2 = new THREE.Vector3();
var _tempQuaternion = new THREE.Quaternion();
fork icon4
star icon26
watch icon0

121
122
123
124
125
126
127
128
129
      const composer = new EffectComposer( this.renderer );

      composer.addPass( renderPass );
      

      let raycaster = new THREE.Raycaster();
let pointer = new THREE.Vector2();

      const gui = new GUI();
fork icon3
star icon7
watch icon0

+ 2 other calls in file

120
121
122
123
124
125
126
127
128
129
// avoid collisions with world obstacles
var originPoint = this.mesh.position.clone();
var localVertex = this.geometry.vertices[0].clone()
var globalVertex = localVertex.applyMatrix4(this.mesh.matrix);
var directionVector = globalVertex.sub(this.mesh.position);
var raycaster = new THREE.Raycaster(originPoint, directionVector.clone().normalize(), 0, visionRange);

if (this.debug) {
  const arrow = new THREE.ArrowHelper(raycaster.ray.direction, raycaster.ray.origin, 50, 0xff0000)
  if (this.counter % 50 === 0) {
fork icon2
star icon5
watch icon0

+ 7 other calls in file

34
35
36
37
38
39
40
41
42
43
};
//events
const _changeEvent = { type: 'change' };
const _startEvent = { type: 'start' };
const _endEvent = { type: 'end' };
const _raycaster = new three_1.Raycaster();
const _offset = new three_1.Vector3();
const _gizmoMatrixStateTemp = new three_1.Matrix4();
const _cameraMatrixStateTemp = new three_1.Matrix4();
const _scalePointTemp = new three_1.Vector3();
fork icon1
star icon3
watch icon0

414
415
416
417
418
419
420
421
422
423
}

// Main draw
drawSpace();

const raycaster = new THREE.Raycaster();

for (let x = 0; x < SIZE; x++) {
  for (let y = 0; y < SIZE; y++) {
    const pixel = voxelMap[`${x}:${y}`];
fork icon1
star icon1
watch icon0

+ 17 other calls in file

128
129
130
131
132
133
134
135
136
)
intersectPlane.visible = false
state.scene.add(intersectPlane)
state.objects.intersectPlane = intersectPlane

state.objects.raycaster = new THREE.Raycaster()

this._setupGrid(state)
this._setupGridLabels(state)
fork icon65
star icon0
watch icon2

28
29
30
31
32
33
34
35
36
37
this.opts = opts || {};
this.opts.enableLaser = this.opts.enableLaser !== undefined ? this.opts.enableLaser : true;
this.opts.laserLength = this.opts.laserLength !== undefined ? this.opts.laserLength : 3;
this.canvas = this.renderer.domElement;

this.raycaster = new _threeModule.Raycaster();
this.waitcb = null;
this.hoverTarget = null;

this.intersectionFilter = this.opts.intersectionFilter || function (o) {
fork icon4
star icon10
watch icon1

+ 3 other calls in file

186
187
188
189
190
191
192
193
194
195
if (instance === null) {
  instance = new World()

  instance.scene = new THREE.Scene()
  instance.camera = new THREE.PerspectiveCamera(75, 1, 1, 1000)
  instance.raycaster = new THREE.Raycaster(new THREE.Vector3(), new THREE.Vector3(0, -1, 0), 0, 10)
  instance.renderer = new THREE.WebGLRenderer({antialias: true})

  // set a background
  instance.scene.background = new THREE.Color(0xffffff)
fork icon1
star icon0
watch icon2

+ 3 other calls in file

128
129
130
131
132
133
134
135
136

let localVertex = this.collideBoxMesh.geometry.vertices[vertexIndex].clone();
let globalVertex = localVertex.applyMatrix4( this.collideBoxMesh.matrix );
let directionVector = globalVertex.sub( this.collideBoxMesh.position );

let ray = new THREE.Raycaster( originPoint, directionVector.clone().normalize());
let collisionResults = ray.intersectObjects(this.collidableMeshList);

if ( collisionResults.length > 0 && collisionResults[0].distance - directionVector.length() < 0 ) {
fork icon1
star icon4
watch icon2

9
10
11
12
13
14
15
16
17
18
  this.stats = null
  this.controls = null
  this.opts = { el: null, initLight: false, initGrid: false, ...opts }
  this.renderCb = null
  this.mouseClickHandle = null
  this.rayCaster = new THREE.Raycaster()
}

_initCamera() {
  const { cameraOpt } = this.opts
fork icon1
star icon7
watch icon2

87
88
89
90
91
92
93
94
95
    mouseMove: false,
    mouseUp: false,
    mouseOut: false,
},
raycastPos: null,
raycaster: new THREE.Raycaster(),
raycastList: [],

cameraLastPos: new THREE.Vector3(0, 0, 0),
fork icon1
star icon1
watch icon0

5
6
7
8
9
10
11
12
13
14
import worlddata from './data/world.json'
const OrbitControls = require('three-orbitcontrols')
var TWEEN = require('@tweenjs/tween.js');
var topojson = require('topojson')
var THREE = require('three')
var raycaster = new THREE.Raycaster()
var mouse = { x: 0, y: 0 , z: 15}
var pickerPoint = new THREE.Vector3();
var holdCountry = false;
var currentCountry, overlay, pointer;
fork icon0
star icon1
watch icon1

+ 17 other calls in file

100
101
102
103
104
105
106
107
108
109
110
111
112
var travelUseSmooth = false; // zoom changes (for orthographic camera)


var startZoom = 0;
var endZoom = 0; // ray caster for drag movement


var rayCaster = new THREE.Raycaster();
var plane = new THREE.Plane(new THREE.Vector3(0, 0, -1)); // default parameters :


var defaultOptions = {
  enableRotation: true,
fork icon0
star icon1
watch icon0

161
162
163
164
165
166
167
168
169
170
var quaterAxis = new THREE.Quaternion();
var axisX = new THREE.Vector3(1, 0, 0);
var minDistanceZ = Infinity;
var lastNormalizedIntersection = new THREE.Vector3();
var normalizedIntersection = new THREE.Vector3();
var raycaster = new THREE.Raycaster();
var targetPosition = new THREE.Vector3();
var pickedPosition = new THREE.Vector3();
var sphereCamera = new THREE.Sphere();
var previous;
fork icon0
star icon1
watch icon0

12242
12243
12244
12245
12246
12247
12248
12249
12250
12251
recursive = recursive || false;
linePrecision = linePrecision || 20;


var direction = vector.sub( camera.position ).normalize();
var raycaster = new THREE.Raycaster(
    camera.position,
    direction);
raycaster.linePrecision = linePrecision;
var intersections;
fork icon0
star icon0
watch icon0

+ 13 other calls in file

Other functions in three

Sorted by popularity

function icon

three.Vector3 is the most popular function in three (22341 examples)