Ability to easily add helpers to Object3d components

[oveddan]

Right now, there are multiple THREE.js helpers that work on THREE.Object3d objects. These include:

• BoxHelper
• EdgesHelper
• FaceNormalsHelper
• VertexNormalsHelper
• WireframeHelper

It would be great if there was an easy way to drop a helper as part of a parent Object3d container.

This would be done by lettings you drop in helpers as child components of Object3d elements. Such as:

var geometry = new THREE.BoxGeometry(1, 20, 100)
var material = new THREE.MeshBasicMaterial(0xffffff)
<Mesh material={material} geometry={geometry} >
  <EdgesHelper />
  <VertexNormalsHelper />
</Mesh>

There should also be an easy way to port over the helpers to these types of components.

[Izzimach]

I looked at this and adding in helpers as children would probably not work very well. The main reason is that child elements are created before their parents. In the above example, the helpers are constructed before the Mesh. However when creating helper objects you need to pass in the object being 'wrapped' so in fact the Mesh needs to created first and then passed in as an argument to the helpers.

I know it's less helpful but wrapping the object in a helper fits into the architecture better, something like:

<BoxHelper>
  <Mesh material={material} geometry={geometry} ></Mesh>
</BoxHelper>

or if you want multiple helpers

<Helpers types={BoxHelper, FaceNormalsHelper}>
  <Mesh material={material} geometry={geometry} ></Mesh>
</Helpers>

I know that's not ideal. I'll look at it a bit more next week.

[oveddan]

Thanks for looking into this. The latter example seems ideal as you'd be able to add multiple helpers.

[Izzimach]

So helpers are in and an example is put in with commit 5f99a3c0ef30b8124366d9b23d9d07a783d5a7c0

It looks like some helpers use different things they "wrap" so this will not work for all kinds of helpers. But it at least works with the BoxHelper ATM