A-frame - Extended cube parametrs

Monday, 10 April 2017 | Written by  |

In this post we can learn more parametrs, which can are usefull in better work with object. We will rotate with cube, show some options how to work with dimensions etc.. 

Example

Like i first, we can change background color from white to grey. For this we can use tag <a-sky></a-sky>, where we just add paramter with color.

Complete code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>WebVR.center - Example</title>  
    <script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
  </head>
  
  <body>
    <a-scene> 
         <a-sky color="#333"></a-sky>
         <a-box position="0 0 -5" rotation="0 45 30" depth="5" color="#b50e0e"></a-box>
    </a-scene>
    
    
  </body>

</html>
                                                            a

You can see, that we can rotate with cube with attribut rotation. To the rotation we set up angles like whole numbers.

Another attribut, which manage size of object is depth, height or width. The same funcion we can do with attribut scale. 

         <a-box position="0 0 -5" rotation="0 45 30"  scale="1 1 5" color="#b50e0e"></a-box>

Attribut WIREFRAME

 <a-box position="0 0 -5" rotation="0 45 30"  scale="1 1 5" wireframe="true" color="#b50e0e"></a-box>

 

© 2017 WebooVR by Weboo.eu. All rights reserved