# Trig Confusion

• 09-17-2003, 08:55 PM
Capoeirista
Trig Confusion
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.

Thanks,

Lee
• 09-17-2003, 09:51 PM
jonmack
Re: Trig Confusion
Quote:

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 :p

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.
• 09-17-2003, 11:12 PM
Capoeirista

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.:confused:

Have a great day,

Lee
• 09-18-2003, 04:06 AM
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);
• 09-18-2003, 09:30 AM
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
• 09-19-2003, 01:46 AM
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?)
• 09-19-2003, 08:59 AM
Capoeirista
Oh Wow!

That's cool!

I'm going to try it right now!

Thanks!

Lee

PS is Doyle's still in Sydney?
• 09-19-2003, 08:06 PM
jonmack

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();
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() :D
• 09-19-2003, 08:51 PM
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