如何在框架中创建线框 3D 立方体?
How to create a wire-frame 3D cube in a-frame?
我正在努力为框基元创建线框。尝试了颜色、不透明度和透明属性,但 none 似乎有效。这是代码 -
<a-entity geometry="primitive: box; width: 1; height: 1; depth: 1" position="0 1 0" material="color: #0000FF; opacity: 0.5;" rotation="0 0 120"></a-entity>
需要渲染这样的东西 -
您需要检查一下 THREE.Material docs,因为 A-Frame 无法公开所有选项。这是一个示例组件,使用 wireframe
选项:
AFRAME.registerComponent('wireframe', {
dependencies: ['material'],
init: function () {
this.el.components.material.material.wireframe = true;
}
});
<a-entity geometry="primitive: box" material="color: blue" wireframe></a-entity>
在 A-Frame 0.9.0 中,您可以将 wireframe: true
定义为 standard
material 的 属性,例如:
<a-entity geometry="primitive: box; width: 1; height: 1; depth: 1"
position="0 1 0"
material="color: #0000FF; opacity: 0.5; wireframe: true"
rotation="0 0 120">
</a-entity>
也许你会得到比你需要的更多的电线(至少在我得到的效果图中,有些对角线有电线,而不仅仅是边缘),但也许足够好而且非常简单。
我正在努力为框基元创建线框。尝试了颜色、不透明度和透明属性,但 none 似乎有效。这是代码 -
<a-entity geometry="primitive: box; width: 1; height: 1; depth: 1" position="0 1 0" material="color: #0000FF; opacity: 0.5;" rotation="0 0 120"></a-entity>
需要渲染这样的东西 -
您需要检查一下 THREE.Material docs,因为 A-Frame 无法公开所有选项。这是一个示例组件,使用 wireframe
选项:
AFRAME.registerComponent('wireframe', {
dependencies: ['material'],
init: function () {
this.el.components.material.material.wireframe = true;
}
});
<a-entity geometry="primitive: box" material="color: blue" wireframe></a-entity>
在 A-Frame 0.9.0 中,您可以将 wireframe: true
定义为 standard
material 的 属性,例如:
<a-entity geometry="primitive: box; width: 1; height: 1; depth: 1"
position="0 1 0"
material="color: #0000FF; opacity: 0.5; wireframe: true"
rotation="0 0 120">
</a-entity>
也许你会得到比你需要的更多的电线(至少在我得到的效果图中,有些对角线有电线,而不仅仅是边缘),但也许足够好而且非常简单。