objects=[];
raycaster = new THREE.Raycaster();
mouse = new THREE.Vector2();
//监听全局点击事件,通过ray检测选中哪一个object
document.addEventListener("mousedown", (event) => {
  event.preventDefault();
  this.mouse.x = (event.clientX / this.renderer.domElement.clientWidth) * 2 - 1;
  this.mouse.y = - (event.clientY / this.renderer.domElement.clientHeight) * 2 + 1;   this.raycaster.setFromCamera(this.mouse, this.camera);
  this.scene.children.forEach(child => {
    if (child instanceof THREE.Mesh) {//根据需求判断哪些加入objects,也可以在生成object的时候push进objects
      this.objects.push(child)
    }
})
var intersects = this.raycaster.intersectObjects(this.objects); if (intersects.length > 0) {
  console.log(intersects[0].object)
}
}, false)
 
官方demo:https://threejs.org/examples/canvas_interactive_cubes.html

threejs Object的点击(鼠标)事件(获取点击事件的object)的更多相关文章

  1. java:javaScript(定义方式,循环语句,函数与参数,事件机制,控制台记录,event事件获取键盘ascii,confirm和prompt,事件和内置对象,获取input,点击更换背景色)

    1. 定义JS的两种方式: <!DOCTYPE> <html> <head> <meta charset="UTF-8"></ ...

  2. 点击鼠标获取元素ID

    原文:点击鼠标获取元素ID public partial class Form1 : Form { public Form1() { InitializeComponent(); } private ...

  3. jQuery通过event获取点击事件的事件对象

    要想搞明白js的事件机制,必须搞清楚几个概念:事件对象,事件源,还有事件流 事件对象: 当事件发生时会产生事件对象,事件对象的作用是用来记录“事件发生是一些相关的信息.注意事件对象只有在事件发生时才会 ...

  4. C#实现模拟鼠标点击事件(点击桌面的其他程序 )

    注释感觉已经很清楚了,有不懂的欢迎评论 1 using System; using System.Collections.Generic; using System.ComponentModel; u ...

  5. 一段简单的代码记录如何通过 js 给 HTML 设置自定义属性,并且通过点击事件获取到所设置的自定义属性值

    for (var i = 0; i <= 5; i++) { const divJoinDay = document.createElement("div"); divJoi ...

  6. 【three.js第七课】鼠标点击事件和键盘按键事件的使用

    当我们使用鼠标操作three.js渲染出的对象时,不仅仅只是仅限用鼠标对场景的放大.缩小.旋转而已,还有鼠标左键.右键的点击以及键盘各种按键等等的事件.我们需要捕获这些事件,并在这些事件的方法里进行相 ...

  7. vue.js click点击事件获取当前元素对象

    Vue.js可以传递$event对象 <body id="app"> <ul> <li v-on:click="say('hello!', ...

  8. webAPI(DOM) 2.1 获取页面元素 | 事件1 | 属性操作 | 节点 | 创建元素 | 事件2

    js分三个部分: ECMAScript标准:js的基本语法 DOM:Ducument Object Model--->文档对象模型--->操作页面的元素 BOM:Browser Objec ...

  9. JS怎样将拖拉事件与点击事件分离?

    帖子:http://bbs.csdn.net/topics/390785395?page=1#post-397369340 怎样将拖拉事件跟点击事件分离? 须要做到:拖拉时不触动点击事件 <ht ...

随机推荐

  1. SpringMvc 笔记

    整理出来是 SpringMvc 笔记 方便以后查询 框架太多了 不经常使用 忘记的可能性很大 自己整理一套笔记 一看就明白了 1 对比 原始请求响应流程 1 发送请求 --> 2 控制层 --& ...

  2. SVM(三)线性支持向量机

    本文是在微信公众号发表的原创~ 额,图片粘不过来~就把链接给你们吧 http://mp.weixin.qq.com/s?__biz=MjM5MzM5NDAzMg==&mid=400740076 ...

  3. angular js实现开关效果

    功能:实现点击排序,再点击排倒序. 实现方法如下 方法一:定义变量实现点击切换true或false,代码为:  $scope.lidata = [                {"name ...

  4. BinLog日志

    一.概述 binlog 二进制日志文件,可以说是MySQL最重要的日志了,它记录了所有的DDL和DML(除了数据查询语句)语句,以事件形式记录,还包含语句所执行的消耗的时间,MySQL的二进制日志是事 ...

  5. ItemsSource数据源 或 集合属性 的定义 ——> 的数据源定义(典型)

    在Xaml中: ItemsSource="{Binding Path=GridDataSource.PoliceforceDataSource}" 在ViewModel中: Obs ...

  6. 修改tomcat默认端口号8080

    1.背景 在默认情况下,tomcat的端口是8080,使用了两个tomcat,那么就需要修改其中的一个的端口号才能使得两个同时工作. 2.方法 2.1改动一 那么,如何修改tomcat的端口号呢?首先 ...

  7. iptables详解(7):iptables扩展之udp扩展与icmp扩展

    前文中总结了iptables的tcp扩展模块,此处,我们来总结一下另外两个跟协议有关的常用的扩展模块,udp扩展与icmp扩展. udp扩展 我们先来说说udp扩展模块,这个扩展模块中能用的匹配条件比 ...

  8. vue的slot的使用问题

    slot的使用问题 根据官方文档来说,有三种使用方式 https://cn.vuejs.org/v2/guide/components.html#%E4%BD%BF%E7%94%A8%E6%8F%92 ...

  9. 【转】Fork/Join框架测试

    Fork/Join框架介绍 下面使用该框架计算0-50000000000的和,并比较普通计算方法.Fork/Join框架.Java8新特性三种计算方式的计算时间: import java.time.D ...

  10. label技巧

    问题描述: 一般都用label的for属性指定label的点击范围: <label for="male"><input type="radio" ...