-
Drawing Graphs for animated values (Scale, Position etc)
Hello everyone! I have a very specific need to render graphs of what happens to objects that I animate in AE – it’s game interface animations related and this is going to help other people understand my animations.
All tutorials I found are CSV-based graphs but I need my graphs to be scale-driven or position-driven (any given value actually).
I imagine such graphs to be plotted in realtime, every frame, till the end of timeline. For scale, for example, it could be like this:
I’m really hoping for a ready recipe for that (my expression skills are almost 0) – maybe someone did something similar before, but any advice would be apreciated.
P.S. Thats a CSV tutor I watched – https://www.youtube.com/watch?v=5bXfhogposMSome contents or functionalities here are not available due to your cookie preferences!This happens because the functionality/content marked as “Google Youtube” uses cookies that you choosed to keep disabled. In order to view this content or use this functionality, please enable cookies: click here to open your cookie preferences.
-
2 Replies
-
Hi Vadim,
I quickly hacked this together, which plots a line for the scale value of a specific object. It might not be exactly what you are looking for but this should point you in the general direction and give you something to work with ☺yBase=400; //y Position the graph should "start" on.
xStart=-900; //leftmost point of the graph
xEnd=xStart*-1; //rightmost point of the graph
fTotal= timeToFrames(thisComp.duration); // getting the total number of frames so that each frame will represent a point on the path
xStep=length(xStart,xEnd)/fTotal; //distance between the points, steps
pointArr = []; //creating an empty array
lay= thisComp.layer("Object"); //the "watched" layerfor (i=0; i<= fTotal; i++){
pointArr.push([xStart+(i*xStep),yBase-(lay.transform.scale.valueAtTime(framesToTime(i))[0])])
}
/*
I get the x position of each point on each frame, starting from the xStart value.
Then I get the values of one of the scale dimensions on every frame and substract that from my yBase line.
Then I push the value as x and y into my empty array
*/
createPath(pointArr,[],[],isClosed=false);
Since I dont go after tangents I added a round corners to the shape layer.
And to have the graph animate I simply put this expression on the end property of a trim paths I added on my graph:
linear(time,0,thisComp.duration,0,100) -
Hi! Thanks a lot! I can totally work with that, I will definetely study your example and try to adapt it for my needs, realy apreciate.
Reply to this Discussion! Login or Sign Up