问题标签 [threecsg]

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.

0 投票
1 回答
640 浏览

javascript - “未捕获的 ThreeBSP:不支持给定的几何图形”

前言:我正在使用Three-CSG来尝试合并 Three.js 中的几何图形。

Uncaught ThreeBSP: Given geometry is unsupported将 THREE.Mesh 的实例传递到库的ThreeBSP方法中时出现错误。

任何想法为什么我会收到此错误?我在下面提供了我的代码片段,我传递给库方法的对象评估trueinstanceof THREE.Mesh来自我的 js 文件中的一个,所以我对代码抛出错误的原因一无所知。任何帮助将不胜感激!

链接到控制台错误

谢谢,詹姆斯。

0 投票
1 回答
1012 浏览

javascript - bufferGeometry 上的 CSG 操作

我目前正在使用 three.js 几何类来创建一个形状,然后对该形状执行多个 CSG 操作。从而不断地重新绘制形状。

这个执行多个 csg 操作的过程很慢,因为我使用光线投射来获得点击时的形状并执行所选形状和预定义形状(任何形状或几何形状)的 CSG。

所以我的问题是:

  • 使用缓冲区几何会加速我的 CSG,但是否有任何库可以在THREE.BufferGeometry实例上执行 CSG 操作?

  • 有没有办法通过使用任何其他方法来加快这个过程?

这是我的代码流:

我将这个库用于 CSG 操作,整体流程类似于three.js 示例中的这个示例。

0 投票
1 回答
1448 浏览

javascript - 使用three.js的STL对象的横截面

我正在尝试截取使用three.js 的STLLoader 函数加载的心脏模型的横截面。我目前正在尝试将ThreeCSG包装器用于csg.js库,与此堆栈溢出帖子中的相同。

这是我的 csg 减法代码

我加载了 stl 模型,然后在加载器的回调函数中,我尝试减去网格。我得到的错误是在 ThreeCSG 包装文件的第 34 行,说

ThreeCSG.js:34 Uncaught TypeError:无法读取未定义的属性“长度”

我猜这是因为(a)我没有正确使用 ThreeCSG,(b)我需要在代码的其他地方做减法,或者(c)不支持 STL 格式模型。

无论如何,我完全被难住了,我会感谢在使用 three.js 方面更有经验的人的建议。

0 投票
0 回答
340 浏览

javascript - ThreeJS:CSG(包装器?)

我一直在使用独立的 ThreeCSG.js ( https://github.com/chandlerprall/ThreeCSG ) 创建不同的形状,但是我尝试创建的某些形状出现错误:超过最大调用堆栈。

似乎 repo 没有更新,所以我尝试了 CSG-wrapper ( https://github.com/kraag22/csg-wrapper ),它可以毫无问题地创建形状,但对于 THREE.JS 来说已经过时了。

您可以使用任何其他 CSG 库吗?或者是最新的 CSG ( https://github.com/evanw/csg.js )包装器?

我关于回购的两份报告:

https://github.com/kraag22/csg-wrapper/issues/3 https://github.com/chandlerprall/ThreeCSG/issues/23

0 投票
1 回答
2924 浏览

javascript - Three.js - 合并多个几何图形/网格,移除公共区域

我正在尝试将两个几何/网格(红色和蓝色)合并为一个独特的。但是在创建新几何并应用geometry.merge() 后,我发现所有内部顶点和面仍然存在(绿色区域)。

我想删除所有额外的信息,因为它会在渲染面上产生视觉故障,而且我无法正确计算合并体积。我需要像上一张图​​片一样的东西,一个只包含最小外部/外部的单个网格面和顶点,删除内部的。

在此处输入图像描述

我尝试应用 ThreeCSG 来减去网格,但我发现它在尝试加载大型模型时会不断崩溃。我也尝试应用 raycaster 来检测常见的人脸,但这对大型模型的性能也有很大影响。

ThreeCSG 是这里唯一的好选择吗?但由于我不能在每个模型上都使用它,我应该丢弃它。我想快速应用一些不太依赖于网格三角形数量的东西。

0 投票
0 回答
267 浏览

javascript - ThreeCSG 和减法的奇怪结果

我正在学习three.js,对于一个项目,我需要在圆柱体和球体之间创建一个相交。这是代码中有趣的部分:

这是我的两个对象:

圆柱体和球体

....结果:

在圆柱体.减法(球体)之后......奇怪的结果

我不明白为什么圆柱体和球体之间的减法会给我这些结果。

先感谢您 :)

PS:我正在使用three.js r74 和threeCSG 的最新版本。就像 CSG 不可能在 r74 版本中保持 Mesh 的位置一样……但我无法更改我的 three.js 版本 ^^''

0 投票
0 回答
508 浏览

javascript - 使用 THREE.js 的 CSG 操作无法与 objloader 一起使用

我正在尝试使用 THREE.js 和 ThreeCSG 对从 objloader 导入的 2 个网格文件执行减法,但它不起作用。这是一段代码:

但是布尔运算不起作用。此外,未定义减法和 toolCSG 和 tool2CSG。我使用 STLloader 或使用 OBJloader检查了 stackoverflow的类似示例。它适用于立方体和球体等通用对象,但不适用于加载的复合对象。此外,我应该提到我正在使用 r.72 和 objloader 版本 68,因为我需要从加载器而不是缓冲区几何中获取几何。如果您能帮助我解决这个问题,我将不胜感激。

r.72

0 投票
1 回答
464 浏览

javascript - Three.js CSG 如何更改结果的材质和颜色?

我想在合并两个网格后得到的这个特定对象“结果”上获得 MeshLambertMaterial:

在这里,我有一个盒子和一个 latheGeometry。联合完成后,我得到随机的纯色丑陋物体。相反,我应该得到 LambertMaterial 白色对象。

图片:http: //imgur.com/a/nbSq1

0 投票
0 回答
1068 浏览

javascript - 如何通过在 ThreeJS 中计算新面孔来改进合并

我正在学习 ThreeJS 4 个月,将其应用到个人项目中。昨天,我使用大部分 ThreeJS 几何图形和一些 CSG 技巧实现了构建据点。结果看起来不错,但我喜欢精确度,而且我的几何形状有点乱(主要是在 CSG 减法之后)。

[问题]我想知道是否有一种已知的方法可以合并两个几何体并用新的计算面替换它的旧面?有一个JSFiddle来说明我的问题。

[编辑:用第四个和第五个网格更新小提琴]

获得相同网格的三种方法

  1. 左边的第一个网格是由三个 boxGeometry 组成的基本合并几何。
  2. 在调用 mergeVertices() 函数之后,中间的第二个网格是完全相同的网格。结果节省了4个顶点。但是网格内的面仍然存在。它不仅会导致看起来很糟糕(对我而言),还会导致这些部分的纹理或照明问题(面法线不在它们应该在的位置)。
  3. 右边的最后一个网格是合并后我期望的网格。看看中间方框下面的脸,它们只适合他们应该的。

它导致纹理和照明问题的事实(看看 JSFiddle,它照亮了网格的内部部分)让我认为它必须是解决这个问题的一种简单且众所周知的方法,但我只是感觉像一个大菜鸟。

这个问题与另一个问题直接相关,如果我没有找到(或理解)关于 SO 的任何答案(也许它会帮助你理解我为什么要这样做),我会问这个问题:Is there a way to apply这个合并几何体上的纹理,而不为每个几何体的每个面创建独特的材质(因为不同的 UV 映射和网格大小)?我无法想象要为我巨大的堡垒的每一面手动完成...

[编辑]写下我的问题,我刚刚意识到 ThreeCSG 及其union()功能可以解决问题。但我不喜欢它创建的顶点混乱。即使对于像这些盒子这样的基本几何体,ThreeCSG 也会在几何体的部分已经一切正常的地方创建奇怪的顶点和面。

我用第四个网格 (CSG) 更新了 JSFiddle。在这个简单的用例中,我们可以看到比预期多出 2 个顶点和 2 个面。似乎它保留了旧面孔(看看线框!)。

ThreeCSG 联盟是目前最好的选择吗?

[编辑 2] Fiddle 使用原生 CSG 几何图形进行了更新。它给出了我预期的结果,只有 20 个顶点和 32 个面。感谢威尔特的这个想法。问题是对多边形进行硬编码需要太长时间(只看三个框的代码)。我没有 JSON 文件来加载和生成多边形,我只有 ThreeJS 几何图形。因此,我将研究 ThreeJS 和 ThreeCSG 几何之间的转换,我希望了解为什么在进行转换时会产生不好的结果。

0 投票
1 回答
306 浏览

javascript - 如何通过降低分辨率或 BSP 树的大小或数量来优化 CSG 库?

我正在尝试对从 objloader 导入的 2 个网格文件执行布尔操作,使用 THREE.js 和 ThreeCSG 交互多次并实时进行。我只是想问是否有任何方法可以优化 CSG 代码,通过降低分辨率(链接)或 BSP 树的数量或大小来减少布尔运算的运行时间,从而使程序实时运行或更快?我使用的对象非常大,所以这是它运行缓慢的原因之一。提前感谢您的所有帮助。