aframe - 3d.io 查看器中的建筑 Material 预设选择

Question

我想创建一个 Web 应用程序，让用户可以在建筑 3D 场景中的地板和墙壁的不同预设之间进行选择。

https://spaces.archilogic.com/model/template/new?modelResourceId=f67ffde0-278e-11e4-9f8c-7dda0d61ae4a&mode=edit&view-menu=camera-bookmarks&main-menu=interior&logo=false

就像在这个编辑器中一样，但是，我需要更简单的 Material 菜单(用户从管理员之前上传的不同预设纹理以及相应的漫反射、规范、法线和 alpha 贴图中进行选择)。

我浏览了 archilogic 的所有存储库，但找不到 3D 编辑器的源代码以使其更简单。

有谁知道它是否可用，如果没有，我应该朝哪个方向发展这样的应用程序？

Answer 1

此功能仍在路线图上，尚未完成，但有一些方法可以完成类似的任务。

所以最重要的是，以下描述是由于所有这些还没有准备好和完善。这是实现目标的一种实验性方法。

让我们来分解一下。

预定义 Material

Archilogic 现在有一长串预定义 Material 可供您选择。它们与建筑元素的类型无关，因此您可以在任何元素上使用任何 Material 。 Here is the list of available materials .

地板和天花板

地板和天花板包含在带有 io3d-floor 组件的单个元素中。

因此，假设您已在 elem 元素中找到地板和天花板，则可以执行以下操作来选择预定义 Material :

elem.components['io3d-floor'].data.material_top = 'wood_parquet_oak';
elem.components['io3d-floor'].update()

这会将地板 Material 更改为给定的预定义 Material ，在本例中为“wood_parquet_oak”。对于天花板 Material ，将 material_top 更改为 material_ceiling。

墙壁

墙的工作方式几乎相同，但属性是 material_front 和 material_back 而不是 material_top 和 material_ceiling .

其他架构元素

对于其他元素，您可以通过查看相关组件的 .data 中可用的属性来解决这个问题(例如，io3d-wall 表示墙壁)。

自定义 Material

这有点难以正确实现，因为制作自定义 Material 涉及到许多属性。

假设您已在某处上传纹理，您可以像这样定义 Material :

elem.components['io3d-floor'].data.material_top = {
  mapDiffuse: "https://example.org/texture.hi-res.gz.dds",
  mapDiffusePreview: "https://example.org/texture.lo-res.jpg", 
  mapDiffuseSource: "https://example.org/texture.source.jpg"
}

您还可以给它附加参数，例如 size: [3,3] 在重复自身或传递法线贴图或镜面贴图之前缩放纹理以覆盖模型中的 3x3 米，但我为了简洁起见，排除这些。

注意:您可以将这种 Material 定义用于任何也接受上述预定义 Material 的东西。 遵循命名约定非常重要，并且您需要有可用的 gzip 压缩 DDS 纹理以及 JPEG 版本。

“源”图像是可选的，但其他两个图像必须存在，否则将不起作用。

总结:此功能尚未完全准备就绪(正如您可以通过使其工作的相当人为的方式看出的那样)，但在出现更好的方法之前，此解决方法将起作用。