Simple way to create ability to grab objects without using third party components

Question

while superhands and other components exist, I'd like to build a simple component that allows me to grab objects. Many of these components do a bunch of other things and/or depend on yet other components.

When I add superhands, other parts of my system don't work, so I really just want "grab and move" and have the object move with my hand controller.

score 1 · Answer 1 · answered Mar 21 '23 at 14:03

Simplest Example.

    <!DOCTYPE html>
<html>
  <head>
    <script src="https://aframe.io/releases/1.4.1/aframe.min.js"></script>
    <script>
    AFRAME.registerComponent('grabber', {
      init: function () {
      this.grabbed = null;
  
    },
    events: {
      gripdown: function(evt) {
        if (evt.currentTarget.components['raycaster'].intersections.length>0) {
          this.grabbed = evt.currentTarget.components['raycaster'].intersections[0].object.el;
          evt.currentTarget.object3D.attach(this.grabbed.object3D);          
        }
    }, gripup: function(evt) {
      if (this.grabbed) {
        this.el.sceneEl.object3D.attach(this.grabbed.object3D);
        this.grabbed = null;
      }
    }
  }
});
    </script>
  </head>
  <body>
    <a-scene>
      
      <a-box position="0 1.5 -2" rotation="45 0 45" color="#4CC3D9" ></a-box>
      <a-camera id="camera" position="0 1.5 0"></a-camera>
      <a-entity id="right-hand"
              laser-controls="hand: right"
              oculus-touch-controls="hand: right"
              raycaster="lineColor: #fff; lineOpacity: 0.7; far: 10"
              grabber>
      </a-entity>
    </a-scene>
  </body>
</html>

Example on Glitch

Simple way to create ability to grab objects without using third party components

1 Answers1