问题标签 [buffer-geometry]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
graph - lineSegment shaderMaterial - bufferGeometry (Threejs)
我正在尝试用 Three.js 编写图形可视化,所以我有一个 bufferGeometry 来保存我的顶点,我正在用我自己的 ShaderMaterial 绘制它来制作数千个 Three.Points 但现在我想知道如何着色三个。 lineSegments 为我自己改变它。我想用相同的 bufferGeometry 绘制我的边缘,并为边缘的头部使用两个索引。我搜索了太多但我没有找到任何东西?可能吗?
three.js - 没有 UV 的简单 2d 世界(三点)中的纹理坐标
我想在 THREE.Points 中加载一个图像,并且我正在使用没有 uv 属性和 shaderMaterial 的 bufferGeometry 谁能解释我什么是 vu 以及我为什么需要它?我有一个 2d 世界(所有点都有 z=0 位置)所以我可以使用简单vec2
而不是在属性中保存 uv 坐标吗?
提前致谢
indexing - 在索引的 BufferGeometry [three.js] 中使用自定义属性
我有一个索引bufferGeometry,它有position
,appear
我设置的属性出现属性是顶点是否出现在相机中。我想用它来检查我的线是否应该被渲染如果至少有一个顶点出现在相机中,我希望我的线被渲染。
在片段着色器中使用丢弃之前,我在没有索引的情况下写了这个(多次使用每个顶点),但现在使用索引我有问题,它们不会消失提前谢谢
javascript - 实例化 vs bufferGeometry vs interleavedBuffer
我需要绘制数千个具有位置、大小和颜色属性的点和线,它们的位置是动态的(拖动时交互)。
直到现在我一直在使用缓冲区几何,但现在我又发现了两件事
- 实例化
- 交错缓冲区
我想知道这些是什么以及它们是如何工作的?它们的优点和缺点是什么?它们更适合我的情况还是简单的缓冲区几何最适合我?
你能给我一个完整的比较这三个吗?
three.js - 一次绘制调用中的多条带状线
我想绘制很多带状线,性能对我来说非常重要,所以我不能使用数千个绘制调用。
我的第一个解决方案是使用LineSegments
这样的重复索引
我知道BufferGeometry
和ShaderMaterial
实例化。那些比我的解决方案更好吗?
performance - 在 THREEJS 中以 60FPS 显示 25000 行
我在 THREEJS 中显示 25000 行,性能很差。(<5FPS)
我遵循“最简单”的方法,每条线创建 1 个网格并将其添加到场景中:
我生成常规几何(与缓冲区几何)为:
现场 JSFiddle:http: //jsfiddle.net/16fnyb8k/34/
几何创建:https ://github.com/FNNDSC/ami/blob/dev/src/loaders/loaders.trk.js#L328-L408
我应该以某种方式将所有几何图形合并在一起吗?改用缓冲区几何形状(这会对性能产生任何影响)吗?两个都?
=== 更新 ===
我用 N BufferGeometries 做了一个虚拟测试,但它似乎并没有真正产生任何影响:
现场小提琴:http: //jsfiddle.net/16fnyb8k/51/
=== 更新 2 ===
使用缓冲区几何图形并将所有线条合并在一起使其更加平滑,但是现在所有线条都已连接:
JS 小提琴:http: //jsfiddle.net/16fnyb8k/59/
谢谢
three.js - Threejs - 你可以将 circleBufferGeometry 与 Points 材料一起使用吗?
我正在通过调整threejs中的缓冲区几何drawcalls示例在threejs中设置粒子系统。我想创建一系列点,但我希望它们是圆形的。
threejs 点的文档说它接受几何或缓冲区几何,但我也注意到有一个circleBufferGeometry。我可以用这个吗?或者除了使用精灵之外,还有其他方法可以使积分变得圆润吗?我不确定,但似乎为每个粒子加载图像会导致很多不必要的开销。
那么,简而言之,有没有一种更高效或更简单的方法可以在没有精灵的threejs中制作圆形粒子(球体或圆盘)的粒子系统?
javascript - 在three.js中每帧更新bufferGeometry的索引
我必须在循环函数中更新 bufferGeometry 的索引,但只能更新未分配的索引。如果索引数组的元素被赋值,下次就不能再赋值了。我搜索了一些问题,比如mesh.geometry.index.needsUpdate = true;
,但是没有效果。
我的代码通过 bufferGeometry 创建了一个新的 Mesh。
这是我的代码更新循环函数中的索引。
这是渲染结果。
只能保留第一个分配的索引。例如,indices([0,1,2,2,3,0]) 是有效的。下次我设置新值时,indices([4,5,6,6,7,4]) 无效。
我搜索了一些问题。例如,cube.geometry.index.needsUpdate = true;
无效。其他geometry.addAttribute('indices', new THREE.BufferAttribute(new Float32Array(iIndices), 3));
和更新cube.geometry.attributes.indices.array;
。这是无效的。
如何在循环函数中更新 bufferGeometry 的这些索引?
当我尝试一些方法来解决它时,我发现了一个有新问题的低方法。如何优化它。
这是我的方法。
这是结果(之前)。
这是结果(之后)。
几何的顶点是不变的,但几何的索引(result01)是 [0,1,2,2,3,0] 并且几何的索引(result02)是 [4,5,6,6,7,4 ].当几何图形被渲染时,索引在 result01 和 result02 之间的每一帧都会更新。
但是,该方法仅支持new THREE.Mesh(geometry, new THREE.MeshBasicMaterial({wireframe: false}));
. 当 时wireframe=true
,几何索引无法更新。
什么时候优化呢wireframe=true
?
three.js - 在 Three.js 中对 BufferGeometrys 索引进行 UV 映射
我在映射立方体的每一侧时遇到问题。立方体被制成 BufferGeometry ,其中每一面都是一侧的旋转副本(某种工作模板),并通过应用四分之一来相应地旋转。UV 也会被复制。我将跳过我以前见过的任何顶点坐标并依赖索引。
这给我留下了总共 8 个顶点和 12 个面。但是我认为当我必须设置所有 UV 时,我的顶点不足。正如屏幕截图所示,我已经“正确”地映射了立方体的每一侧。但缺少顶部和底部。我不知道如何设置顶点UV顶面和底面。
我能否以某种方式在同一个顶点上应用多个 UV,具体取决于它用于哪个面,还是我完全失去了情节?
我可以通过应用 6 个 PlaneBufferGeometry 来解决这个问题,但这会给我留下 4*6=24 个顶点。这比 8 还要多。
我一直无法弄清楚这一点。要么我完全误解了它的工作原理,要么考虑到我的限制,我想要完成的事情是不可能的。