1

I started using this AFrame example to mess around with graphs in VR:

https://github.com/vasturiano/3d-force-graph-vr

I needed to have more control over the scene so I moved to the lower level component:

https://github.com/vasturiano/aframe-forcegraph-component

Everything works nicely but I am now trying to bridge the gap between the lower-level three.js objects that are attached to the forcegraph AFrame entity and the VR controls at the scene level. I would like to add basic manipulation of the graph with VR controllers and/or hands but I am failing to conceptually connect the 2 up. The comments on the repos basically just say "use the lower-level frameworks to do this".

The concrete question: how do I add the ability to drag a node with this component? I know I'll have to write custom code to do it, just unsure actually how and where to do it. I haven't even gotten to a point where I know where to start trying to do this.

In other examples of this, the ability to manipulate the graph is there but only for a mouse and not in VR. I'm fine with hacking it so it only works for VR (specifically the Meta Quest 2), don't need to worry about anything else at the moment. I am using other AFrame level components too so I would like to stay at the AFrame level of abstraction as much as possible.

I am seeking comments on general direction, pseudocode, stubs, etc. I feel like I'm missing something small here to figure this out. I am pretty much a beginner.

Aframe version: 1.3.0

Updated question:

  1. Ability to move the nodes in the graph using oculus quest 2 controllers
  2. Ability to twist/turn/scale in/scale out the entire graph using oculus quest 2 controllers
halfer
  • 19,824
  • 17
  • 99
  • 186
Caleb
  • 870
  • 1
  • 10
  • 21
  • Wish i had some time to tackle nr. one, regarding 2. - how about using hands https://imgur.com/a/0NNH6V2 ? :D – Piotr Adam Milewski May 22 '22 at 21:28
  • @PiotrAdamMilewski By hands are you referring to SuperHands? (https://github.com/wmurphyrd/aframe-super-hands-component) If so, I did try but could not get it to work like in your link. Do you have example code for that specific interaction in the video? Because that is exactly one of the things I wanted to get working. – Caleb May 23 '22 at 20:49
  • @PiotrAdamMilewski After looking at your video more and trying it on my end, I don't think you are using either super-hands or the built in AFrame "hand-controls" as-is. So I'm a bit perplexed on how you got that working! Your hands also look way better than anything I have been able to render. Ahhh, quick update: this looks like you are using your hand tracking library. Going to try that now. :) – Caleb May 23 '22 at 23:37
  • [here's](https://github.com/gftruj/aframe-hand-tracking-controls-extras/blob/master/examples/forcegraph/index.html) the source, actually my stuff isn't necessary since i'm just using pinches which are available in vanilla [a-frame](https://aframe.io/docs/1.3.0/components/hand-tracking-controls.html#sidebar). Some easing would be nice, also not sure why but once i mess with the scale the cursor stops detecting nodes – Piotr Adam Milewski May 24 '22 at 06:28
  • @PiotrAdamMilewski Are you using a Quest 2 or Quest (original)? Your example doesn't seem to work with mine. All I did was clone your repo and try it out. I also tried seeing if starting with hand tracking (not starting with controllers) was the issue but that didn't seem work. I have all the WebXR flags set too so that shouldn't be an issue. Not sure what's going on, going to poke around some more. – Caleb May 24 '22 at 23:24
  • Did a few more tweaks and now things are working as expected. Thanks for the tips! I'm now trying to add translation, not just scale/rotate. Looking into doing that with maybe a different finger gesture? Looks like your additions support knowing which finger is gestured so going to try that. – Caleb May 25 '22 at 02:59

0 Answers0