草庐IT

javascript - 每个面有 K 个顶点的 3D 点的三 Angular 剖分

coder 2025-03-31 原文

我正在使用 Three.js。我有一组 3D 点 (x, y, z) 和一组面孔。一张脸由K个点组成。它既可以是凸的也可以是凹的。 我在 Three.js 文档中找不到任何可以帮助我的东西。一种解决方案可能是对这些形状进行三 Angular 剖分，但到目前为止我还没有找到任何简单的 3D 三 Angular 剖分算法。

另一个解决方案是做类似的事情:

var pointsGeometry = new THREE.Geometry();

pointsGeometry.vertices.push(new THREE.Vector3(10, 0, 0));
pointsGeometry.vertices.push(new THREE.Vector3(10, 10, 0));
pointsGeometry.vertices.push(new THREE.Vector3(0, 10, 0));
pointsGeometry.vertices.push(new THREE.Vector3(1, 3, 0));
pointsGeometry.vertices.push(new THREE.Vector3(-1, 3, 0));
pointsGeometry.vertices.push(new THREE.Vector3(10, 0, 0));

var material = new THREE.MeshBasicMaterial({color: 0x00ff00});

var mesh = new THREE.Shape/ShapeGeometry/Something(pointsGeometry, material);
group.add(mesh);

scene.add(group);

我有很多这样的形状一起构建一个封闭的表面。

有什么建议吗？

感谢您的关注。 祝你有美好的一天。

最佳答案

正如您所指出的，有两种方法可以实现:

  • 使用 3D 三 Angular 剖分算法(Three.js 未提供)；
  • 使用通常用于 Three.js Shape 对象的 2D 三 Angular 剖分算法，并对几何体的每个面应用一些变换。

最后一个看起来很酷，但不幸的是，当我尝试时，我意识到它并不是那么微不足道。我想出了类似于 Paul-Jan 所说的东西:

对于几何体的每个面:

  1. 计算人脸的质心；
  2. 计算人脸法线；
  3. 计算人脸矩阵；
  4. 将 3D 点投影到面部的 2D 平面上；
  5. 创建几何体(使用 Shape 三 Angular 剖分算法进行三 Angular 剖分)；
  6. 将面矩阵应用于新创建的几何体
  7. 创建一个 Mesh 并将其添加到 Object3D(我试图将所有几何体合并为 1，但它因 ShapeBufferGeometry 而失败)

检查 this fiddle .

注意winding order您的顶点或将 THREE.Material.side 放到 THREE.DoubleSide 以防止面被剔除。

关于javascript - 每个面有 K 个顶点的 3D 点的三 Angular 剖分，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42393306/

javascriptAngularcodepointsGeometry几何体three.jsgeometryshapestriangulation

有关javascript - 每个面有 K 个顶点的 3D 点的三 Angular 剖分的更多相关文章

  1. 世界前沿3D开发引擎HOOPS全面讲解——集3D数据读取、3D图形渲染、3D数据发布于一体的全新3D应用开发工具 - 2

    无论您是想搭建桌面端、WEB端或者移动端APP应用，HOOPSPlatform组件都可以为您提供弹性的3D集成架构，同时，由工业领域3D技术专家组成的HOOPS技术团队也能为您提供技术支持服务。如果您的客户期望有一种在多个平台（桌面/WEB/APP，而且某些客户端是“瘦”客户端）快速、方便地将数据接入到3D应用系统的解决方案，并且当访问数据时，在各个平台上的性能和用户体验保持一致，HOOPSPlatform将帮助您完成。利用HOOPSPlatform，您可以开发在任何环境下的3D基础应用架构。HOOPSPlatform可以帮您打造3D创新型产品，HOOPSSDK包含的技术有：快速且准确的CAD

  2. FOHEART H1数据手套驱动Optitrack光学动捕双手运动(Unity3D) - 2

    本教程将在Unity3D中混合Optitrack与数据手套的数据流，在人体运动的基础上，添加双手手指部分的运动。双手手背的角度仍由Optitrack提供，数据手套提供双手手指的角度。 01  客户端软件分别安装MotiveBody与MotionVenus并校准人体与数据手套。MotiveBodyMotionVenus数据手套使用、校准流程参照：https://gitee.com/foheart_1/foheart-h1-data-summary.git02  数据转发打开MotiveBody软件的Streaming，开始向Unity3D广播数据；MotionVenus中设置->选项选择Unit

  3. Unity 3D 制作开关门动画,旋转门制作,推拉门制作,门把手动画制作 - 2

    Unity自动旋转动画1.开门需要门把手先动,门再动2.关门需要门先动,门把手再动3.中途播放过程中不可以再次进行操作觉得太复杂?查看我的文章开关门简易进阶版效果:如果这个门可以直接打开的话,就不需要放置"门把手"如果门把手还有钥匙需要旋转,那就可以把钥匙放在门把手的"门把手",理论上是可以无限套娃的可调整参数有:角度,反向,轴向,速度运行时点击Test进行测试自己写的代码比较垃圾,命名与结构比较拉,高手轻点喷,新手有类似的需求可以拿去做参考上代码usingSystem.Collections;usingSystem.Collections.Generic;usingUnityEngine;u

  4. [Vuforia]二.3D物体识别 - 2

    之前说过10之后的版本没有3dScan了，所以还是9.8的版本或者之前更早的版本。 3d物体扫描需要先下载扫描的APK进行扫面。首先要在手机上装一个扫描程序，扫描现实中的三维物体，然后上传高通官网，在下载成UnityPackage类型让Unity能够使用这个扫描程序可以从高通官网上进行下载，是一个安卓程序。点到Tools往下滑，找到VuforiaObjectScanner下载后解压数据线连接手机，将apk文件拷入手机安装然后刚才解压文件中的Media文件夹打开，两个PDF图打印第一张A4-ObjectScanningTarget.pdf，主要是用来辅助扫描的。好了，接下来就是扫描三维物体。将瓶

  5. ruby - 将n维数组的每个元素乘以Ruby中的数字 - 2

    在Ruby中，是否有一种简单的方法可以将n维数组中的每个元素乘以一个数字？这样:[1,2,3,4,5].multiplied_by2==[2,4,6,8,10]和[[1,2,3],[1,2,3]].multiplied_by2==[[2,4,6],[2,4,6]]？(很明显，我编写了multiplied_by函数以区别于*，它似乎连接了数组的多个副本，不幸的是这不是我需要的)。谢谢! 最佳答案 它的长格式等价物是:[1,2,3,4,5].collect{|n|n*2}其实并没有那么复杂。你总是可以使你的multiply_by方法:c

  6. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  7. ruby - Ruby 和 Ruby on Rails 中的三层架构 - 2

    我是一名决定学习Ruby和RubyonRails的ASP.NETMVC开发人员。我已经有所了解并在RoR上创建了一个网站。在ASP.NETMVC上开发，我一直使用三层架构:数据层、业务层和UI(或表示)层。尝试在RubyonRails应用程序中使用这种方法，我发现没有关于它的信息(或者也许我只是找不到它？)。也许有人可以建议我如何在RubyonRails上创建或使用三层架构？附言我使用ruby​​1.9.3和RubyonRails3.2.3。 最佳答案 我建议在制作RoR应用程序时遵循RubyonRails(RoR)风格。Rails

  8. ruby - 每个页面上的 Jekyll 分页 - 2

    据我们所知，Jekyll默认分页仅支持index.html，我想创建blog.html并在那里包含分页。有什么解决办法吗？ 最佳答案 如果您创建一个名为/blog的目录并在其中放置一个index.html文件，那么您可以向_config.yml表示paginate_path:"blog/page:num"。不是使用根文件夹中的默认index.html作为分页器模板，而是使用/blog/index.html。分页器将根据需要生成类似/blog/page2/和/blog/page3/的页面。这将使您到达yourwebsite.com/b

  9. ruby - `gem install` 多个 gem 的语法是什么，为每个 gem 指定版本？ - 2

    如何使用geminstall同时安装多个gem，同时指定我想要的版本？例子:geminstallakami-v1.2.0--ignore-dependenciesgeminstallatomic-v1.1.14--ignore-dependenciesgeminstallaws-s3-v0.6.2--ignore-dependenciesgeminstallbackports-v3.3.0--ignore-dependenciesgeminstallbrendanlim-sms-fu-v1.0.0--ignore-dependenciesgeminstallbuilder-v3.1.3

  10. ruby-on-rails - 未定义的方法每个 rails 错误 - 2

    我正在通过位于http://ruby.railstutorial.org的教程在Rails上试用ruby.我已经到了可以创建用户并将他们的姓名和头像显示在以下位置的地步:http://localhost:3000/users/1现在我想在用户访问时显示所有用户:http://localhost:3000/users/这是我的Controller:classUsersController这是我的看法。#Viewforindexactioninuser'scontroleerAllusers我收到以下错误。undefinedmethod`each'fornil:NilClass谁能告诉我为

随机推荐