nartc / angular-three

🧊 THREE.js integration for Angular 🧊
https://angular-three.netlify.app/
MIT License
306 stars 23 forks source link

[Docs] ngtObjectInputs and ngtObjectOutputs #114

Open IRobot1 opened 2 years ago

IRobot1 commented 2 years ago

I noticed in a new example ngtObjectInputs and ngtObjectOutputs. Can you add some documentation on why these are needed and best practices for using.

IRobot1 commented 2 years ago

Also, is there a preferred method for converting an THREE.Vector3 to NgtTriple?

nartc commented 2 years ago

I'll add docs about those "PassThrough" soon. Three.Vector3.toArray() is I guess the best method

IRobot1 commented 2 years ago

Also, when to use ngt-value and best practices.

IRobot1 commented 2 years ago

Can you add a page that covers keyboard, mouse/pointer events? At the canvas level and at the object level.

If possible, how it to transfer control from one object (pawn) to another.

nartc commented 2 years ago

You have an example? Events as in Raycaster events or DOM events?

IRobot1 commented 2 years ago

I've been able to answer my own question about events. All NGT objects have output events which can be handled as needed.

For keyboard events, use Angular HostListener

For Raycasting, it really depends if the origin is the current mouse location, camera or your hand in VR.

IRobot1 commented 2 years ago

Is there a topic that discusses how to do content projection for NGT objects? That is, how to write a custom component that allows some of its content to be passed in. In the following, how does app-xr-inspect component get the inner content to render?

<app-xr-inspect>
  <ngt-mesh #socket>
    <ngt-sphere-geometry [args]="[0.02]"></ngt-sphere-geometry>
    <ngt-mesh-standard-material color="gold"></ngt-mesh-standard-material>
  </ngt-mesh>
  <ngt-group [rotation]="[ -60 | radian,0, 0]">
    <ngt-mesh [position]="[0,-0.1,0]">
      <ngt-cylinder-geometry [args]="[0.01, 0.01, 0.2]"></ngt-cylinder-geometry>
    </ngt-mesh>
  </ngt-group>
</app-xr-inspect>
IRobot1 commented 2 years ago

Using SOBA billboard as an example, I was able to get content project working. Is there a simpler method?