Change hand color

[pjanik]

Is there an easy way to do it?
Function that sets bone color seems like an overkill. Also, if I set HSL value, it doesn't seem to be correct anyway (try to set red in HSL space).
I've looked at the source code and I can't see how I can provide material option that would overwrite color.

[pehrlich]

See the README: materialOptions gives control of the material configuration, like this:

(window.controller = new Leap.Controller)
  .use('riggedHand', {
    materialOptions: {
      color: new THREE.Color(0xff0000)
    }
  })
  .connect()

See Plunkr: https://plnkr.co/edit/7fkhnY?p=info

Note that you may want to change the material wholly. I recommend taking a look at this PR, which shows how to put in a custom shader experimentally: #11

Specifically, you can subscribe to the riggedHand.meshAdded event and replace the material:

   .on('riggedHand.meshAdded', function(handMesh){
         console.log('mesh added', arguments);
         handMesh.material =  new THREE.ShaderMaterial({
             uniforms: uniforms,
             vertexShader: document.getElementById('vertexShader').innerHTML,
             fragmentShader: document.getElementById('fragmentShader').innerHTML
         });
         handMesh.skinning = true;
    })

[pjanik]

For some reason I was assuming that materialOptions had to be a static, JSON-like hash (e.g. accepting color: 0xff0000, but not the THREE object). I would consider adding color example to readme, as probably it's one of the most popular things that people might want to customize.

Thanks a lot!

[pehrlich]

done!