Ruimtestad 1

VR Ruimtestad 1. terug naar de inleiding klik, voor de VR mode in fullscreen, op het VR logo.

naar de roterende ruimtestad in fullscreen

Een ruimtestad die koers zet richting planeet aarde

De panorama afbeelding is 5000 x 3750 pixels (aspect ratio = 4:3) waardoor er veel meer details zijn te zien

In mijn computer wordt de afbeelding omgezet naar 4096 x 3027 pixels (aspect ratio = 4:3)

Volgens sommige wiskundige is alles te herleiden tot fractals zo ook deze ruimtestad die is gemaakt met de fractalformule "amazing surf"

Met de muis kan je de camera draaien en met de pijltjestoets verplaatsen.

Met de joystick kan de camera, binnen de ruimtestad, in y richting roteren en in x en z richting verplaatsen

met de schuifknop naast de joystick roteert de x as

Met functieknop 1 reset de camera naar het midden van de ruimtestad

Met functieknop 2 reset de camera 900 meter buiten de ruimtestad.

de niet roterende ruimtestad in fullscreen

Onderstaand de schets van de roterende ruimtestad

 
<!DOCTYPE html>
<html>
<head>
  <title>roterende ruimtestad 1</title>
  <meta name="description" content="ruimtestad 1">
  <script src="../lib/aframe-v1.2.0.min.js"></script>
  <script src="../lib/aframe-gamepad-controls.js"></script>
</head>
<body>
 
<script>
       AFRAME.registerComponent('knop_1', {
         schema: {
         position:{default:"0 -1.6 0.2"}
   },
        init: function () {
           var data = this.data;
           var el = this.el;
           el.addEventListener('gamepadbuttondown:0', function () {
           el.setAttribute('position', data.position);
           });
         }
       });
 
  </script> 

  <script>
       AFRAME.registerComponent('knop_2', {
         schema: {
         position:{default:"0 -1.6 0.2"}
   },
         init: function () {
           var data = this.data;
           var el = this.el;
           el.addEventListener('gamepadbuttondown:1', function () {
           el.setAttribute('position', data.position);
           });
         }
       });
  </script>

  <a-scene>
    <a-assets>
      <img id ="fractal" src="../assets/amazing_surf.jpg">
    </a-assets> 
 
   <a-entity id="rig"
      movement-controls position="0 -1.6 0.2">
  <a-entity
                   camera position="0 1.6 0.2"
       look-controls wasd-controls="acceleration:800"
       gamepad-controls ="acceleration:800"
      knop_1="position: 0 1.6 0.2"
      knop_2="position: 0 1.6 800">
    </a-entity>
  </a-entity>

<a-entity
    animation="property: rotation; from: 0 0 0; to: 360 360 360; easing: linear; loop: true; dur: 50000">
    <a-sky src="#fractal"></a-sky> 
  </a-entity>
 
  </a-scene>
</body>
</html>

Flevopink