-
How to delete a layer based on its name?
Hi,
I am working on a math video and i figured it might be fun to write scripts to allow a visualization of what i explain in the video.
The short version might be enough to understand where the issue lies. However i go more into details in the Long Version:
Short Version:
I want to create an arrow at a point (x1,y1). The arrow is a mask applied to a solid, made using Shape.vertices. I want the base of the arrow (see image) to coincide with the anchor point of the solid, so that i can rotate it without the base moving.
However, i can’t get that part right. Looks like i can’t understand how Shapes work with respect to the solids.
Long Version:
I am designing a vector object following the constructor below:
The center of the coordinate system is placed at (x1,y1). From there, I draw the vector with coordinates (x,y) by masking the solid to generate an upright arrow of length (base to tip) of sqrt(x^2+y^2) and then i rotate it by the necessary angle to get a vector with coordinate (x,y). To achieve that rotation, i need the anchor point of the solid to coincide with the center of the base of the arrow (like in the drawing).
I have been unable to place the shape a.
My end goal: is to be able to animate different vectors, draw grids (that are not necessarily orthogonal), lengthen and add vectors (lengthening by lenghtening the side vertices of the shape).
I am a mathematician, so the mathematical concepts shouldn’t be the issue here.
Here is the ugly code:
//The origin is supposed to be the place on screen where the arrow gets placed.
function Vector(x,y,origin,r,g,b) {
this.x = x;
this.y = y;
this.angle = -myAngle(x,y);
this.origin = origin;
velen = Math.round(length(x,y));
this.length = velen;
this.r = r;
this.g = g;
this.b = b;
this.lname = “(” + this.x.toString() + “,” + this.y.toString() + “)”; //So that the name layer matches the coordinates of the vector.
mySolid = comp.layers.addSolid([r,g,b], this.lname, 2*comp.width , 2*comp.height,1);
newMask = mySolid.Masks.addProperty(“Mask”);
Shape = newMask.property(“maskShape”).value;
this.large = 10; //The arrow base it twice as large
this.arrowwidth = 7; //
this. arrowheight = 20;
Shape.closed = true;
//The following line is me trying things out :
Shape.vertices = [2*origin – [this.large,0],2*origin + [this.large,0], 2*origin + [this.large,velen-this.arrowheight], 2*origin + [this.large + this.arrowwidth,velen-this.arrowheight], 2*origin + [0,velen],2*origin + [-this.large – this.arrowwidth,velen-this.arrowheight], 2*origin + [-this.large,velen-this.arrowheight],2*origin – [this.large,0]];
newMask.property(“maskShape”).setValue(Shape);
mySolid.property(“rotation”).setValue(this.angle – 90); //This is made so that the vector (100,200) point 100 pixels to the right and 200 up.
mySolid.property(“position”).setValue(origin);
//mySolid.anchorPoint.setValue(origin);
}
<div>This code works as long as the origin is the middle of the screen, but fails whenever i move the origin (the second image shows what happens when origin = [0,0] and the vector is supposed to be (100,100) (the arrow should be top left of the screen, pointing outside, 100 pixels to the right and 100 up).</div><div>
I am posting because this is driving me insane.
</div>
-
3 Replies
-
I think if you move your solid, you should not put the origin in the vertices part. So maybe Shape.vertices should look like this:
Shape.vertices = [
- [this.large, 0],
[this.large, 0],
[this.large, velen - this.arrowheight],
[this.large + this.arrowwidth, velen - this.arrowheight],
[0, velen],
[-this.large - this.arrowwidth, velen - this.arrowheight],
[-this.large, velen - this.arrowheight],
- [this.large, 0]
];But I would not use solid. Why not use shape layer instead? Something like this may work:
//The origin is supposed to be the place on screen where the arrow gets placed.
function Vector(x, y, origin, r, g, b) {
this.x = x;
this.y = y;
this.angle = -myAngle(x, y);
this.origin = origin;
velen = Math.round(length(x, y));
this.length = velen;
this.r = r;
this.g = g;
this.b = b;
this.lname = "(" + this.x.toString() + "," + this.y.toString() + ")"; //So that the name layer matches the coordinates of the vector.
this.large = 10; //The arrow base it twice as large
this.arrowwidth = 7; //
this.arrowheight = 20;
var myShape = new Shape;
myShape.closed = true;
//The following line is me trying things out :
myShape.vertices = [
- [this.large, 0],
[this.large, 0],
[this.large, velen - this.arrowheight],
[this.large + this.arrowwidth, velen - this.arrowheight],
[0, velen],
[-this.large - this.arrowwidth, velen - this.arrowheight],
[-this.large, velen - this.arrowheight],
- [this.large, 0]
];
myShapeLayer = createShape(this.lname, myShape);
myShapeLayer.rotation.setValue(this.angle);
myShapeLayer.position.setValue(this.origin);
//mySolid.anchorPoint.setValue(origin);
function createShape(shapeName, shapeValue) {
var myShape = app.project.activeItem.layers.addShape();
myShape.name = shapeName;
var myShapeGroup = myShape.property("ADBE Root Vectors Group");
var path1 = myShapeGroup.addProperty("ADBE Vector Shape - Group")("ADBE Vector Shape");
path1.setValue(shapeValue);
//var myStroke = myShape("Contents").addProperty("ADBE Vector Graphic - Stroke");
var myFill = myShape("Contents").addProperty("ADBE Vector Graphic - Fill");
myFill("ADBE Vector Fill Color").setValue([r,g,b]);
return myShape;
}
}
var myVector = new Vector(12, 12, [0, 0], 1, 1, 1)I have tested this without the angle and the length part, as I am missing those functions (I just used square root of the sum of squares for a few tests for length, ignored the angle part).
Also, as a suggestion. If you do not intend to use your variable outside the function (eg: use myVector.arrowWitdh, myVector.origin etc after declaring myVector) do not declare them with “this.”. That declaration makes them public, and I am not sure you want that.
LE: What’s up with the thread name? 😀
-
Thank you for your answer!
I fixed my issue Yesterday, but now that i saw your Post, I am implementing it.
Wome of what you did with the properties is black magic to me.
I have another question. I want to change lengthen the vector, by changing the shape path.
So far, i have implemented a button that creates a vector and one that scales it and they work using setValue, as long as they are constant in time. Any suggestion on how i can go at some time, press the scale button and have my vector scaled?
Somehow i feel like i should use “setValueAtTime()”, but so far haven’t managed to make it work.
The thread name is my mistake: It was a question i had earlier in the day and i forgot to change it accordingly.
-
Update. I made it work. As an update of what i’ve done so far, the picture shows the result.
I can place vectors, and animate how they scale through time.
I realize however now that this project is becoming quite the endeavor.
Now i need for the objects to keep track of what after effect is doing. So that the properties of my object reflects what it is in after effects. I will probably have to rethink my entire approach. If someone has any vague suggestion of how to achieve that, i’d be thankful. This still was a good exercise.
Reply to this Discussion! Login or Sign Up