Trig Confusion

[Capoeirista]

Hi There--

Am dynamically generating a shape.

Let's say I'm making a zig-zag, starting at 0,0 with points at 10, 10, then and a point at 20,0, and a point at 40, -10, repeating. I want to continue this for several iterations.

Now I want to offset this zig zag by three degrees to make the rest of the dynamically generated object. It would be a zig-zag pie shape, with the point at the origin.

Undaunted by the news that rotation can only be applied to movieclips, I was sure that I could figure it out using trig from high school.

I figured I'd populate an array with the calculations and work backwards down the array to get the shape.

I hurt myself this morning trying to figure out the math for this, using sins, cosins and tangents, then they're different for each quadrant, then what if it crosses an axis.

I used up a lot of notebook paper.

Then I came up with the idea for Flash to create an empty movie clip, put its alpha to zero, draw a line from the origin to the coordinate, rotate that, and depending on what quadrant it's in, extract either the height and width or the new x and y coordinates and populate the array with that.

I thought I was pretty spiffy.

However, I bet there's an even cleverer way to do this. I bet you guys know how.

I bet there's an elegant way to do this mathematically and I just got stuck in cosine land after being away for so long.

Please help!

Thanks,

Lee

[jonmack]

Originally posted by Capoeirista
... Now I want to offset this zig zag by three degrees to make the rest of the dynamically generated object. It would be a zig-zag pie shape, with the point at the origin.

mmmm... pie....

I mean, Hi!

Could you perhaps draw this, i mean, what the heck is a zig-zag pie?!?! Having a little trouble visualising it. From the first description ( with numbers ), it sounds like a sine wave, but then it all goes pie shaped

Also, what version of flash are you using? If you've got MX, and you just want a line, you can use the drawing API that's build in. Yay! Or if not, then it just makes it a little harder.

[Capoeirista]

Hi There, and thanks for your reply. I appreciate it.

Actually, the shape I want to draw is more complex than just a line, but I figure that if I can get the zig zag thing going, then I can mess with that and tackle the more complex parts.

Have uploaded a gif for your perusal. Line one will be drawn using the drawing api. Then I want to take those points and, for argument's sake rotate them about the origin by a random number of degrees. I'm using three for the example, but I want to be able to do this at different angles, like angles greater than 90, 180, etc. But first, I'll settle for three.

Once I get the points, I can put them all into an array and use it to draw a pie-wedge shaped zig zag, like you'd get if you joined the endpoints at the far-right end where the lines are farthest apart.

So I'd start and end at zero, making a closed shape and filling with a gradient fill.

I'm making a series of these shapes. I want to start with the zig zag because it's the easiest and the math should be the least hairy.

Also, if you know how to upload a graphic and have it appear in the body of the message, I'd be really grateful if you, or someone, would tell me. I haven't been able to figure it out.

Have a great day,

Lee

[tonypa]

I probably didnt understand the idea at all, but this looks quite simple to me

//find distance from origin to point 1
d=Math.sqrt(x1*x1+y1*y1);
//apply angle A (its degrees so convert to radians)
piAngle=(Math.PI/180)*A;
//find new coordinates based on distance and angle
x2=d*Math.cos(piAngle);
y2=d*Math.sin(piAngle);

[Capoeirista]

You're wonderful!

I knew it would be obvious to someone else. I was just stuck in the wrong track.

You're terrific,

Thanks,

Lee

[iopred]

http://members.optushome.com.au/chri...s/lineCrank.as
http://members.optushome.com.au/chrisrhodes/sineWave.as

now you can call it with the draw API:

lineCrankTo(150,150,NUMBEROFLINES,SIZEOFLINES,INVE RTED?)

[Capoeirista]

Oh Wow!

That's cool!

I'm going to try it right now!

Thanks!

Lee

PS is Doyle's still in Sydney?

[jonmack]

Wow, sorry, totally forgot about this thread. But you got some very capable people joined anyway

Here's another way of rotating a point ( vector ) which i use - just for continuity and other people interested. ( from the top of my head, but should work )

code:

---

/* Vector - class */

function Vector(x, y) {

    this.x = x;

    this.y = y;

}

Vector.prototype.toString = function() {

    return "{ x:" + this.x + ", y:" + this.y + " }";

};

/* VectorMath - abstract tool class */

VectorMath = new Object();

VectorMath.rotate = function(V, rad) {

    var sina = Math.sin(rad);

    var cosa = Math.cos(rad);

    var x = V.x*cosa + V.y*sina;

    var y = V.y*cosa - V.x*sina;

    return new Vector(x, y);

};



// usage

var a = new Vector(1, 0);

trace(VectorMath.rotate(a, Math.PI/2).toString());

---

Means you dont have to use evil sqrt()

[Capoeirista]

That is also very very cool!

Maybe this thread can become a repository for such methods. Now, wouldn't that be cool!

Hope you're having a great day. Thanks for posting. I appreciate it!

Lee