aframe - Make camera follow height map terrain using raycaster -


i'm trying make camera follow contours of heightmap landscape.

i've added raycaster points down, not reporting changes in intersection.

i've had detach raycaster camera, camera rotate raycaster.

can tell me i'm doing wrong here?

how distance raycaster terrain?

full code: live demo - blue vertical line raycaster

<script>     // custom follow terrain component      //     // idea use raycaster pointing down work out distance between camera , terrain     // , adjust camera's z value accordingly     aframe.registercomponent('collider-check', {         dependencies: ['raycaster'],         init: function () {              var myheight = 2.0;             var cam = this.el.object3d;              this.el.addeventlistener('raycaster-intersected', function (evt) {                  // i've got camera here , intersection, should able adjust camera match terrain?                  var dist = evt.detail.intersection.distance;                   // these values not change :(                 console.log('raycaster (camera y, distance terrain, terrain.y)', cam.position.y, dist, evt.detail.intersection.point.y);             });         }     });      // when move camera, drag raycaster object - it's not attached camera won't rotate ray     aframe.registercomponent('moving', {         schema: { type: 'selector', default: '#theray'},         init: function () {             // this.data raycaster component         },         tick: function() {             // camera             var c = this.el.object3d.position;             // set raycaster position match camera - have shifted on bit can see             this.data.setattribute('position', '' + (c.x - 2.0) + ' ' + (c.y - 2.0) + ' ' + c.z);         }     });  </script>  <a-scene>      <!-- place camera in middle of our map -->     <a-camera position="6 0.2 6" rotation="0 90 0" moving>         <a-cursor color="#4cc3d9" fuse="true" fuse-timeout="100"></a-cursor>     </a-camera>      <!-- if attach raycaster camera, rotate camera - , that's not want -->     <a-entity collider-check id='theray' rotation="0 0 0" position="6 1 6" visible="true">         <!-- aframe inspector barfs on -->         <a-entity raycaster="objects:.walkonthis;direction:0 -1 0;showline:true;origin:0 1 0" line="start:0 0 0;end:0 -5 0:color:red;opacity:1.0"></a-entity>     </a-entity>       <!-- landscape -->     <a-entity heightgrid='xdimension: 12; zdimension: 10; yscale: 0.5; heights:     5 4 3 2 1 1 1 1 2 3 3 6     5 4 3 2 1 1 1 1 2 3 3 3     3 3 0 0 1 1 1 1 2 3 3 3     3 3 1 0 1 1 1 1 2 3 3 3     3 3 2 1 1 1 1 1 2 3 3 3     3 3 2 1 1 1 1 1 2 3 3 3     3 3 2 1 1 1 1 1 2 3 3 3     3 3 1 0 1 1 1 1 2 3 3 3     3 3 0 0 1 1 1 1 2 3 3 3     3 3 0 0 1 1 1 1 2 3 3 6     ;     ' material="color: #ccc" class='walkonthis'></a-entity> </a-scene> 


Comments

Popular posts from this blog

ubuntu - PHP script to find files of certain extensions in a directory, returns populated array when run in browser, but empty array when run from terminal -

php - How can i create a user dashboard -

javascript - How to detect toggling of the fullscreen-toolbar in jQuery Mobile? -