dcsimg
A Flash Developer Resource Site

Results 1 to 9 of 9

Thread: Trig Confusion

Hybrid View

  1. #1
    Senior Member
    Join Date
    Jan 2001
    Location
    Location: Location
    Posts
    147

    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.

    Please help!

    Thanks,

    Lee
    "It's kind of fun to do the impossible."
    - Walt Disney

  2. #2
    avatar free
    Join Date
    Jul 2002
    Location
    UK
    Posts
    835

    Re: Trig Confusion

    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.
    jonmack
    flash racer blog - advanced arcade racer development blog

  3. #3
    Senior Member
    Join Date
    Jan 2001
    Location
    Location: Location
    Posts
    147
    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
    Attached Images Attached Images
    Last edited by Capoeirista; 09-17-2003 at 11:18 PM.
    "It's kind of fun to do the impossible."
    - Walt Disney

  4. #4
    Senior Member tonypa's Avatar
    Join Date
    Jul 2001
    Location
    Estonia
    Posts
    8,227
    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);

  5. #5
    Senior Member
    Join Date
    Jan 2001
    Location
    Location: Location
    Posts
    147
    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
    "It's kind of fun to do the impossible."
    - Walt Disney

  6. #6
    Heli Attack! iopred's Avatar
    Join Date
    Jun 2003
    Location
    Sydney, Australia
    Posts
    923
    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?)

  7. #7
    Senior Member
    Join Date
    Jan 2001
    Location
    Location: Location
    Posts
    147
    Oh Wow!

    That's cool!

    I'm going to try it right now!

    Thanks!

    Lee

    PS is Doyle's still in Sydney?
    "It's kind of fun to do the impossible."
    - Walt Disney

  8. #8
    avatar free
    Join Date
    Jul 2002
    Location
    UK
    Posts
    835
    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()
    Last edited by jonmack; 09-19-2003 at 08:10 PM.
    jonmack
    flash racer blog - advanced arcade racer development blog

  9. #9
    Senior Member
    Join Date
    Jan 2001
    Location
    Location: Location
    Posts
    147
    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
    "It's kind of fun to do the impossible."
    - Walt Disney

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center