Hi
I'm trying to tween between colours but it's not quite what I expected (code below) - it seems to fade from one colour to the next rather than animate through all the colours in between. I think this is because it's doing it in rgb, I want to tween between hues in hsl colours so for example from hsl(0, 100%, 50%) to hsl(120, 100%, 50%).
I've tried to get hsl to work in the TweenLite.to() function but am unclear how this works, how is hsl used in the function? Will using hsl tweening through hues 0 -> 120 or also just fade from one to the next?
//colours
var colours = {
0: new THREE.MeshPhongMaterial({ color: "hsl(120, 100%, 50%)" }),
1: new THREE.MeshPhongMaterial({ color: "hsl(200, 100%, 50%)" }),
2: new THREE.MeshPhongMaterial({ color: "hsl(240, 100%, 50%)" }),
3: new THREE.MeshPhongMaterial({ color: "hsl(360, 100%, 50%)" })
}
//animate to next colour
colourTo(colourplane, colours[0], 5);
//colour tween
function colourTo(target, value, speed)
{
var initial = new THREE.Color(target.material.color.getHex());
var value = new THREE.Color(value.color.getHex());
//tween colour
TweenLite.to(initial, speed, {
r: value.r,
g: value.g,
b: value.b,
onUpdate: function () {
target.material.color = initial;
}
}