three.js表示点的纹理3D?

您好。
在我当前的应用程序中,我使用了一组预加载的纹理,以便能够表示多种类型的纹理三点对象。
这个想法很简单,我以统一的方式传递纹理数组,每个点vertext都有一个属性,告诉我必须应用哪个纹理。
因为我使用的是WEBGL2和texture3d,我想知道是否可以使用相同的方法,但使用texture3d数组而不是标准的纹理数组,并能够为我的点提供3d外观。
我根本不使用texture3d,我看到的示例都链接到
rrd格式。
我希望能够使用非常基本的3d几何图形(如方框)来表示我的点或者球体。
可能吗?
是否存在不使用
rrd文件获取texure3d数据和尺寸的纹理3D示例?
非常感谢advanced。
致以最良好的祝愿
我认为您可以创建一个var>,然后使用该图像创建纹理:var>
我认为这是一个有趣的问题。当然,可以在片段着色器中为点采样3D纹理。与使用2D纹理阵列相比,它甚至可能提供性能优势。在WebGL2中,纹理也可以通过像素坐标而不是相对坐标进行采样。
但表示具有非常基本的3D几何体(如长方体或球体)的点…长方体可以通过将它们合并到单个几何体中来高效地渲染大量长方体。看一些three.js这方面的例子。无需尝试使用点,我认为…
但是球体…高分辨率球体有很多顶点,因此在球体外观中渲染点可能会很有趣。基本上,你要做的是找到点上的每个像素,首先是它是否“击中”球体,其次是它在球体上的位置。当您知道这一点时,可以使用u、v坐标(基本上是角度)应用纹理,并使用相应的计算法线和位置来计算照明。绝对不能保证提高渲染性能,但这将是一个有趣的尝试。
最难的问题是在透视投影下从像素位置映射到球坐标(您必须控制顶点着色器中点的比例和移动,以适应点靠近摄影机和屏幕边缘的极端情况)。不过,正交投影要容易得多,因为球体在屏幕空间中具有恒定的大小和圆形。
嗨,Elias。
谢谢你的反馈。
关键是我不知道如何创建与纹理3d相关的数据。
文档中说:
数据纹理3d(数据:TypedArray,宽度:Number,高度:数字,深度:数字)n**数据–纹理的数据。**n**宽度–纹理的宽度。**n**高度–纹理的高度。**n**深度–纹理的深度。**
但它没有解释如何创建此数据。
我所要实现的与您在这把小提琴中看到的相同,只是使用了纹理3D(球体)数据)而不是2d图像(disc.png)
在这里您可以看一看:nhttps://jsfiddle.net/b4qewc3n/32
因此,基本上我的问题是如何创建与球体纹理3D分布相关的数据
非常感谢您的帮助。
致以最良好的祝愿
小提琴在这里没有显示任何内容。n…
好的,我让它在本地工作几次修复后,我发现我必须滚动鼠标滚轮才能看到任何东西。这也适用于小提琴。nGL点基本上是二维的。顶点着色器决定其屏幕位置和大小,片段着色器为其着色。您可以在片段着色器中获得二维相对坐标,还可以使用从顶点着色器向前移动的任何对象。但不能使用纹理将点绘制到球体中。但是,可以添加从一个方向和一组灯光下看到的球体的静态渲染,并将其作为2D纹理添加到该点。正如在一些3JS示例中所做的那样。three.js示例18
没有明显的方法将3D纹理映射到GL点,因为您无法免费获得任何局部深度信息。您可以使用位置作为纹理的坐标,根据点在3D纹理中的空间位置对点进行着色。您还可以从GL点的局部坐标中获取u、v,并将w作为额外属性(每个点)。
您了解要传递给DataTexture3D的数据数组的格式吗?基本上,数据是按顺序存储的,R、G、B、R、G、B、R、G、B……三个连续条目形成一个像素,或者更确切地说是一个体素,因为它是一个3D纹理。除此之外,我现在还不知道维度的顺序。但我想你最终会得到这样的结果:nfor=3*(I*高度*深度+j*深度+=greenLevel(I,j,k);data[offset+>
红层、绿层、蓝层都是纹理中位置的函数。
嗨,Elias。
我以前没有见过这个例子。
这正是我想要的。
所以我想我真的不需要3d纹理来实现我想要的。
我会看看代码。
非常感谢你的帮助。
没问题。n Texture3d for representing points?n

three.js[已解决]正交摄影机的变换控件:gizmos缩放问题

您好,我正在使用带轨道控制的正交摄影机。我注意到当缩放照相机变焦不改变相机的位置(如透视相机)。首先,我想知道为什么这两个相机的实现方式不同?第二,我也在使用TransformControls,对于透视摄影机,更新功能上的小控件的重新缩放在这个等式中非常有效>但是使用OrbitControls更改缩放而不是正交摄影机的位置时,它没有正常工作。我试着像这样在等式中添加缩放,但没有得到任何好的结果>我应该以不同的方式包括它吗?我应该使用其他控件吗?谢谢大家的帮助!NaDaMa:首先,我很想了解为什么这两个摄像头...

日期:2021-12-11 08:00:01 浏览:1743

three.js多次渲染同一模型(obj模型),FPS要低得多

我试图在程序中渲染150个相同的树模型,但FPS突然从60下降到30+。你能告诉我什么是最好的解决办法吗?非常感谢。和平与爱。skr有两种典型的方法可以解决这个性能问题(太多的绘制调用):- 使用实例化渲染- 将所有几何体合并为一个几何体(因此只有一个网格)...

日期:2021-12-11 08:00:02 浏览:1746

three.js可缩放场景背景

three.js大家好,我有一个场景,由一个物体(反射雕像)组成,保持在一个漂亮背景的中心。我一直在使用威尼斯日落矩形hdr地图作为我的场景背景它既可以作为环境地图,也可以作为背景我看到背景不会与场景中渲染的网格一起缩放。这给人一种场景完全是假的感觉。i、 e状态向上/向下缩放,但背景不缩放。目前,我已经禁用了放大/缩小功能,这样用户就不会感到害怕。我的问题是:1. 当轨道控制放大/缩小时,我是否需要在此处使用一些着色器魔法来放大或缩小场景背景,以便看起来场景中的所有对象都在均匀缩放?或者这根本不可能做到?...

日期:2021-12-11 09:00:02 浏览:1273

three.js移动导入的Gltf模型

three.js我导入了我的gltf模型并将其添加到场景中,但现在如果我尝试移动它,它将不会=新建三、几何();var=混音器( 模型动画[0]>如何移动模式?Prakar_Srivastava:var>3D对象不能是Geometry或BufferGeometry类型。它应该是Object3D或类似Mesh、Points或Line的派生类的实例。在您的情况下,我只是这样声明变量:var mode;在动画循环中,执行以下操作:如果(mod!==未定义)>还请记住,基本3D场景的重要部分在代码片段中丢失(例如相...

日期:2021-12-11 10:00:01 浏览:1112

three.js平面明暗处理的问题

three.js嗨!我在项目中使用节点材质。我在模型渲染方面有问题。它看起来像是真实的平面阴影。如何平滑多边形?也有点像低分辨率阴影纹理贴图的自阴影。可能不是,但可能是。@Arkadiy\\u Vinkovskiy您需要在您的帖子中添加更多细节。屏幕截图不足以说明这里发生了什么。始终包括引起问题的代码,如果您使用的是模型,也要包括这些代码。更好的是,使用codepe制作一个工作示例...

日期:2021-12-11 10:00:02 浏览:997

three.js如何渲染立方体材质?

您好,直到昨天,我才相信Object3D是一组网格,而网格是一组几何体+材质,每个对象只有一个对象。我发现了立方体材质的结构,因此object3D的网格包含1个几何体(boxGeometry)和6个材质!所以问题是,这种网格的渲染效果如何?有关于它的文件吗?(这是为了提高我对three.js)非常感谢还有其他问题,与我的上一个帖子相关,如果一个网格中可能有多个材质,如何设置CustomDistanceMaterial以考虑所有材质的所有贴图?elysium11:所以问题是,渲染如何在这种类型的网格上工作?您...

日期:2021-12-11 11:00:03 浏览:859

three.js如何创建要在网格中拟合的线段

three.js伙计们,我想帮忙,假设我有一个这样的网格图像718×729 1.25 KB我想在网格面内创建线段,也就是说,我想将网格转换成这样的线图像710×828 740字节有人能帮忙吗???...

日期:2021-12-11 12:00:01 浏览:909

three.jsGLTFLoader.js这是我的登记簿错误

three.js每当我试着做决定的时候3.GLTFLoader对象我收到此错误代码:“未捕获类型错误:这是我的登记簿不是一个函数“我需要帮助!由Penta#u Trax在post#5中解决我最终发现我一直在使用错误的文件,当你需要使用jsm/example时,我使用的是js/example。其他东西也是个问题。但这是问题的基础。你能给我们看看你的代码吗?通常,如果你使用的是import语句,GLTFLoader不需要在前面加三个字符。好的,所以在这之前,我刚刚关注了这个视频,因为它是去年发布的。但是现在我试...

日期:2021-12-11 12:00:02 浏览:1069

three.js使用threejs的光流

嘿,我需要通过我的屏幕显示一束移动的光束。我不想使用任何模型或动画。我想知道我是否可以单独使用threejs来实现这一点。我也应该能够控制其运动的颜色强度和路径。嗨!也许这会有帮助:GitHub-jeromeetienne/三倍体积聚光灯: three.js扩展以提供体积聚光灯13,用于可视化光锥。您可以使用THREE.Curve()设置其路径。控制颜色强度,可能取决于曲线上的位置,也可以使用tween.js或者GSAP用于复杂的动画。创造力取决于您这是您想要的吗?https://threejs.org/e...

日期:2021-12-11 13:00:01 浏览:1317

three.js使用光线投射动态绘制多边形

我要画多边形three.js具有交点。为此,我使用下面的函数。首先,我使用光线投射器在第一个交点的第一个点添加球体。每次单击后,在交点处创建新球体,并在该交点和上一点之间创建线。现在,我希望在第一次单击时关闭多边形指向或单击该点周围。如何实现此目标。raycaster params是否与网格一起工作以检测鼠标位置周围的网格?function checkIntersectionclick() = raycaster.intersectObjects(addedObject, true);if (interse...

日期:2021-12-11 13:00:02 浏览:868