How to create a 3D cube in a frame in a frame?

Question

I am struggling with creating a wire-frame for the box primitive. Tried color, opacity and transparent attributes, but no one works. Here is the code -

<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>

You need to do something like this -

Answer 1

You want to check THREE.Material docs for this, since A-Frame cannot expose every option. Here is an example of a component using the option 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>

Answer 2

In A-Frame 0.9.0, you can define it wireframe: trueas a standardmaterial property , for example, like this:

<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>

, , ( , , , , ), , , .