0

Im grouping <a-box>'es with a <a-entity> wrapper.
Then, Im using the cursor component in the <scene> and trying to pick/select individual objects that make up the <a-entity> wrapper, yet only wrapper <a-entity> gets selected, not the individual objects.

Im really curious about this. I looked at all the aframe cursor (https://aframe.io/docs/0.2.0/components/cursor.html) docs, and there is no specific mention of this scenario. It does mention that the raycaster(https://aframe.io/docs/0.2.0/components/raycaster.html) used by the cursor returns the first entity that is intersecting with the projected ray... which would be the grouped entity... so always returning it makes sense.

everything works fine when all the <a-box>'es are attached to the global <a-scene>, and they can be selected individually.

Am I correct to assume that picking only works correctly when the particular object is a global entity (not a nested one)?

H. Pauwelyn
  • 13,575
  • 26
  • 81
  • 144
deepblue
  • 8,426
  • 13
  • 48
  • 60

1 Answers1

0

Not exactly. you can add a raycaster component to cursor entity. and set specific objects which you want to pick. you can see this question I asked before how to set “objects” property in aframe raycaster component .

Community
  • 1
  • 1
Craig.Li
  • 1,336
  • 10
  • 17
  • I tried this already, it doesnt work... . All objects that I want to be selectable have a "v3d_cube" class added to them – deepblue Dec 10 '16 at 03:24
  • I modified `raycaster` component source code, like this ```init: function () { this.direction = new THREE.Vector3(); this.intersectedEls = []; this.objects = []; this.prevCheckTime = undefined; this.raycaster = new THREE.Raycaster(); this.updateOriginDirection(); },``` – Craig.Li Dec 10 '16 at 05:52
  • sorry, i can't edit my last comment. and I modified raycaster component `refreshObjects` function, noted `this.objects = []` in line 58521. then I registered a `update-raycaster` component. code is `AFRAME.registerComponent('update-raycaster', { schema: {type: 'selector'}, init: function () { var raycasterEl = this.data; raycasterEl.components.raycaster.data.objects="#"+this.el.id; raycasterEl.components.raycaster.refreshObjects(); } });`. add this `update-raycaster="#cursor"` component to which entity you want to pick. sorry for my English. wish my words be useful – Craig.Li Dec 10 '16 at 06:03
  • I tried your suggested code. its throwing an error Uncaught (in promise) TypeError: Cannot read property 'data' of undefined(…) – deepblue Dec 11 '16 at 05:02
  • I don't know how you got this error. if I can see your code, maybe I would find the problem. and I wrote a demo published at [link](https://solitaire2015.github.io/aframe-demo.github.io/). I group two boxes in sphere, I add `update-raycaster="#cursor"` to the pink box. so, only the pink box can be selected. – Craig.Li Dec 12 '16 at 02:38