Three.js 通过 Gui 阻止 Raycast

2024-03-22

我想通过光线投射选择对象,但每次我想在 Three.js GUI 上选择某些内容时,Mousdown 事件都会被触发。 我怎么说“如果 Gui 在对象前面,则不触发”之类的话

document.addEventListener( 'mousedown', onDocumentMouseDown, false ); function onDocumentMouseDown( event ) { if (event){}

该 GUI 是一个普通的 Three.js GUI,如下所示:

gui = new GUI( { width: 330 } );

解决这个问题的一种方法是jQuery和一个附加控制变量:

$( gui.domElement ).mouseenter(function(evt) {

    enableRaycasting = false;

} );

$( gui.domElement ).mouseleave(function() {

    enableRaycasting = true;

} );

然后您可以使用enableRaycasting以确定是否应该发生光线投射。

Demo: https://jsfiddle.net/gnwz5ae7/ https://jsfiddle.net/gnwz5ae7/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Three.js 通过 Gui 阻止 Raycast 的相关文章

  • 如何从 cdn THREE.js 加载 GLTFLoader

    我在弄清楚如何让 GLTFLoader 在 THREE js 中工作时遇到一些问题 我不明白如何使用 CDN 站点来托管文件 我尝试过使用网络上示例的链接 但这并没有完成我的工作 我在另一篇文章中读到 GLTFLoader 文件必须与我正在
  • 如何添加标签/标签以显示在多个对象的顶部,以便当用户单击对象时标签始终面向相机?

    本质上 我想说的是 我想创建一个出现在对象顶部 表面上的标签或标签 以便当用户单击对象时 即使对象旋转 标签也始终面向相机 我该如何去做呢 我被告知要使用正交相机 但我不确定如何 和 CSS 作为标签 请参阅上一篇文章 如何使我的文本标签始
  • Three.js - 从点缩放圆柱体

    是否可以从特定点开始增加 Y 轴上圆柱体的比例 与圆柱体从其原点向上和向下生长到新比例不同 它只是像条形图一样从顶部向上 向下生长 当前代码 function animate render cylinder scale y 0 1 requ
  • 使用 OrbitControls 时锁定 x 轴旋转 - Three.js

    使用 OrbitControls 时锁定 x 轴旋转是否可行 目前我有一个挂在绳子上的圣诞星的对象模型 我希望它仅水平旋转 对于您的 OrbitControls 实例集 controls minPolarAngle Math PI 2 co
  • 有什么方法可以从 Three.js Object3D 中获取边界框吗?

    我正在使用 Three js 和 OBJLoader js 加载 OBJ 文件 这将返回一个 Three Object3D 对象 它具有您期望从 3D 模型中获得的内容 位置向量 向上向量 我不明白的是如何获得它的边界框 这可能吗 您不需要
  • 在 ThreeJS 中将 2D 鼠标坐标转换为世界 XZ 坐标

    我需要将鼠标屏幕坐标转换为 XZ 平面上的 ThreeJS 世界坐标 我发现这个工作代码可以将鼠标位置转换为 XY 世界坐标 但我不知道如何修改它以获取 XZ 坐标 var vector new THREE Vector3 vector s
  • 将几何图形转换为 BufferGeometry

    据我了解 Geometry 存储顶点和面的 javascript 对象结构 而 BufferGeometry 仅通过 Float32Arrays 等存储原始 gl 数据 有没有什么方法可以将标准 Geometry 转换为 BufferGeo
  • THREE.JS 加载 STL 网格数组

    因此 我有一个数据库 其中包含文件引用列以及对其所需的子 STL 文件的任何引用 我可以将一两个模型加载到 THREE js 查看器中 因此所有这些都可以正常工作 但是当我加载四个左右的数组时 事情开始变得毛茸茸的 分配的网格 ID 开始变
  • 将球体上的 3d 点转换为 UV 坐标

    我在球体上有一个 3d 点 想要将其转换为球体纹理上的 UV 点 有人可以指出正确的方向吗 我可以采用纯数学解决方案 Edit 我目前有这个 它不会返回正确的 UV 坐标 p 是球体上的 3d 点 mesh position 是球体的位置
  • 将 A 框架与 Three.js 相结合

    我想知道 是否可以将 Three js 元素添加到 A 框架场景中 假设 A frame 是基于 Three js 构建的 并且 three Version 0 74 0 登录到你的控制台这不应该是一件奇怪的事情 对吧 我在我的 A 框架场
  • 如何在 Three.js 中从三角面获取多边形?

    我在网上查了一下是否有人遇到同样的问题 我正在使用 Three js 我有一个 3DObject 其中可能包含孔 面是三角形的 假设我想从上面看到它 我的目标是获得一个代表顶面周长的多边形 这对我来说意味着不再有三角面 而只有 1 个多边形
  • 星系模拟:更改点的颜色并在鼠标悬停时显示文本

    我正在尝试创建模拟 https riteshsingh github io galaxies 4673 个最近星系的位置 星系是点 我想为鼠标悬停时的点着色并加载星系的名称 我花了很多天试图实现它 我可以更改颜色以及进行基本的光线投射 但是
  • Three.js 中几何图形的事件处理? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我正在寻找对 Three js 中的几何图形 相机 灯光 我们添加到场景中的东西 进行某种事件处理 我用谷歌搜索但找不到任何相关内容
  • 无法让 raycaster.intersectObjects() 从远处返回相交的对象

    我有一个包含几个随机数的散点图Sprite用作数据点的对象 我想检测鼠标指针 光标 和Sprite对象 我用来检测交叉点的设置如下 var projector new THREE Projector window addEventListe
  • Three.js:基于图像的光照(IBL)

    I m searching to add an IBL to my scene and objects But I can t find anything on the web There are some examples with an
  • 在 Three.js 中使用多种材质来合并几何体

    我想使用 2 个网格创建一棵松树 其中 1 个用于树干 另一个用于灌木 这就是我所做的 var pine geometry new THREE Geometry var pine texture 1 THREE ImageUtils loa
  • Three.js - 如何翻译几何图形

    我有一个脚本 可以定位各种宽度 高度和深度的立方体 并且正在努力根据 xAxis yAxis 和 zAxis 也有所不同 将它们准确地排列起来 var geometry new THREE BoxGeometry width height
  • Three.js 椭圆

    如何在 Three js 中创建一个椭圆 我看过这个 在 THREE js 中绘制椭圆 https stackoverflow com questions 11419896 drawing an ellipse in three js 但如
  • 如何在 Three.js 场景中包含 OVRManager?

    我创建了几个 Three js Javascript 演示应用程序 正在我的新 Oculus Go 中进行试验 我正在尝试让 Go 控制器在我的应用程序中执行某些操作 根据 Oculus 开发人员中心的说法 最好的办法是将 OVRManag
  • 如何在react-三纤维中提取并播放动画

    嗯 我有 gltf 动画模型 我成功加载模型 但无法播放嵌入的动画 我想知道是否可以以任何方式解决它 顺便说一句 我正在反应中工作 先感谢您 在这里您可以找到型号https drive google com file d 1ZVyklaQu

随机推荐