Search the Community
Showing results for tags 'colour'.
Found 1 result
-
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; } }
