Непрозрачность анимации объекта изображения в Canvas с использованием GreenSock TweenLite

Question

В настоящее время я создаю анимированный баннер с помощью Canvas. У меня есть цветные точечные SVG-графики, установленные как объекты Image() на моем холсте. Я анимировал точки на холсте вдоль путей x,y, и я хотел бы, чтобы точки исчезали к концу их анимации...

Кажется, я не могу понять, как анимировать значения непрозрачности в canvas с помощью TweenLite... На самом деле, я даже не уверен, как вообще анимировать непрозрачность для точек, даже с помощью простого JavaScript... Я не был смог найти любые ответы в гугле.. Кто-нибудь здесь знает, как добиться этого желаемого эффекта? (желательно с использованием TweenLite)

Ради контекста, вот небольшой фрагмент кода, с которым я сейчас работаю:

function drawDot()
            {
                ctx.drawImage(orDt, orDtObj.x, orDtObj.y); //draw an orange dot in the canvas
            }
            function reAnimateDot() //set dot back to it's origin
            {
                orDtObj.x = xDotOgn; 
                orDtObj.y = yDotOgn; 

                animateDot();
            }

            function animateDot()
            { 
                var angle = Math.random()*(Math.PI*2);

                console.log('>> the angle : '+angle)

                var radius = 100;

                //find the end point for our dot
                var xEnd = orDtObj.x + radius * Math.cos( angle );
                var yEnd = orDtObj.y + radius * Math.sin( angle ) ;

                orDtObj.xEnd = xEnd;
                orDtObj.yEnd = yEnd;

                TweenLite.to(orDtObj, 2, {x:orDtObj.xEnd,  y:orDtObj.yEnd, autoAlpha:0, ease:Quad.easeOut, onUpdate:reDrawUnit, onComplete:reAnimateDot});
            }

Answer 1

Одним способом, которым я смог добиться этого эффекта, является наложение объектов холста поверх друг друга так же, как слои во Flash. Я в основном сгруппировал элементы, которые я хотел добавить в их собственные объекты холста, и затем изменил фактическое свойство canvas globalAlpha на каждом холсте отдельно... казалось, добился цели..

Пожалуйста, прокомментируйте, если вы, ребята, знаете какой-либо другой способ, который может работать..