Drawing a star

Discussion in 'Mac Programming' started by MorphingDragon, Aug 19, 2010.

  1. MorphingDragon macrumors 603

    MorphingDragon

    Joined:
    Mar 27, 2009
    Location:
    The World Inbetween
    #1
    For most of the year, because of my previous Objective-C/C experience I've been flying through my CS labs but I'm stuck on this particular exercise.

    We have to make a program which draws a 5 sided star and eventually change it into a program that draws spiralgraphs. Now the following point of a star is defined as (Where i is the point of a star)

    xi + 1 = xi + LineLength * cos(theta)
    yi + 1 = yi + LineLength * sin(theta)

    I get this little tiny blob in the corner of my window. I have no clue whats wrong with my code.

    This is actually C#, but whatever, its similar to Java.

    Code:
    //Declare Variables
    double starLength = numericLength.Value;
    double x = 0, y = 0, xi = 0, yi = 0;
    const double angle = 4 * Math.PI / 5;
    Graphics paper = picStar.CreateGraphics();
    Pen pen1 = new Pen(Color.Black, 5);
    
    //Draw the star
    for (int i = 1; i <= 5; ++i)
    {
         //Calculate xi +1, yi + 1
         xi = x + (starLength * Math.Cos(angle));
         yi = y + (starLength * Math.Sin(angle));
    
        //Draw the line
        paper.DrawLine(pen1, (int)x, (int)y, (int)xi, (int)yi);
    
        //Make x, y -> xi, yi
        x = xi;
        y = yi;
    }
    
     
  2. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #2
    Sounds like you've just got your units wrong. Can you make starLength longer.

    B
     
  3. MorphingDragon thread starter macrumors 603

    MorphingDragon

    Joined:
    Mar 27, 2009
    Location:
    The World Inbetween
    #3
    Any value makes a blob appear, just thicker. I would post a screen shot but I still haven't got bootcamp set up and my laptop's USB ports are faulty. XD
     
  4. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #4
    Hmm. How's picStar created?

    I'd get rid of the for loop and focus on making a single line appear the way you want it.

    EDIT: http://msdn.microsoft.com/en-us/library/aa327556(v=VS.71).aspx

    DrawLine is supposed to take Point structures, why are you calling it with separate coordinates?

    Code:
    [C#] 
    public void DrawLinePoint(PaintEventArgs e)
    {
    // Create pen.
    Pen blackPen = new Pen(Color.Black, 3);
    // Create points that define line.
    Point point1 = new Point(100, 100);
    Point point2 = new Point(500, 100);
    // Draw line to screen.
    e.Graphics.DrawLine(blackPen, point1, point2);
    }
    
    EDIT: NVM I didn't see the overload a bit further down the page.
    B
     
  5. MorphingDragon thread starter macrumors 603

    MorphingDragon

    Joined:
    Mar 27, 2009
    Location:
    The World Inbetween
    #5
    picStar is a picture box on the form.

    Because you just can, I'm not sure why but C# lets you and its perfectly valid.

    If I manually put in coordanates it works fine.
     
  6. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #6
    5 line segments, 10 points shared between the line segments.

    Is something wrong with the values you calculate?

    B
     
  7. robvas macrumors 68030

    Joined:
    Mar 29, 2009
    Location:
    USA
    #7
    Put some debugging outputs in there so you can see what the actual X, Y values are.

    I ran this program through QBASIC
    Code:
    X = 0
    Y = 0
    Xi = 0
    Yi = 0
    CONST PI = 3.14159
    CONST STARLENGTH = 50
    
    angle = (4 * PI) / 5
    
    FOR i = 1 TO 5
            Xi = X + (STARLENGTH * COS(angle))
            Yi = Y + (STARLENGTH * SIN(angle))
    
            'LINE (320 + X, 240 + Y)-(320 + Xi, 240 + Yi), 14
            PRINT "X,Y = "; X; Y; ", Xi, Yi = "; Xi; Yi
            PRINT "ANGLE ="; angle
    
            X = Xi
            Y = Yi
    NEXT i
    I ended up with:
    Code:
    X,Y =  0  0 , Xi, Yi = -40.45079  29.38935
    ANGLE = 2.513272
    X,Y = -40.45079  29.38935 , Xi, Yi = -80.90158  58.77869
    ANGLE = 2.513272
    X,Y = -80.90158  58.77869 , Xi, Yi = -121.3524  88.16804
    ANGLE = 2.513272
    X,Y = -121.3524  88.16804 , Xi, Yi = -161.8032  117.5574
    ANGLE = 2.513272
    X,Y = -161.8032  117.5574 , Xi, Yi = -202.254  146.9467
    ANGLE = 2.513272
    Get some graph paper out, all those points are on the same line! It draws one big line, in 5 segments
     
  8. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #8
    Your math is wrong. HINT: each line segment is going at the same angle. (as robvas also points out).

    B
     
  9. MorphingDragon thread starter macrumors 603

    MorphingDragon

    Joined:
    Mar 27, 2009
    Location:
    The World Inbetween
    #9
    To be completely honest, I don't know how that equation works. Its just provided in the pseudo code in the lab manual.
     
  10. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #10
    Check it again. HINT: Somehow the loop counter should be involved, and it's not.

    B
     
  11. robvas macrumors 68030

    Joined:
    Mar 29, 2009
    Location:
    USA
    #11
    Some gotchas:

    1. You're calculating the angle the same every time.
    2. Your coordinate system is goofy. Where on the screen is -180? +180?
    3. C uses radians, not degrees. To convert you have to do radians = degrees * (PI * 180)
     
  12. robvas macrumors 68030

    Joined:
    Mar 29, 2009
    Location:
    USA
    #12
    Also, one more thing. When you do get some points up on the screen, and you've converted to radians, you're going see a pentagon on the screen instead of a star!

    Which is close, but not what you want ;)
     
  13. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #13
    Agree fully on 1 and 2, but 3 is already correct.

    From his code.

    Code:
    angle = 4 * Math.PI / 5;
    is in radians and is equivalent to 144 degrees (720/5);

    I got a star with some very simple modifications to his code.

    1) Make sure your formulas are correct.
    2) Understand the coordinate system and make sure all your points are within it (change the starting point and scale (length) if you need to).

    See? ;)

    EDIT: BTW drawing n C# was on my todo list, so thanks for making me look into it.

    B
     

    Attached Files:

  14. robvas macrumors 68030

    Joined:
    Mar 29, 2009
    Location:
    USA
    #14
    Try changing the amount of times the loop runs, the angle, etc and you will get all kinds of spirograph type effects.

    Also try incrementing/de-incrementing the line length variable.
     
  15. MorphingDragon thread starter macrumors 603

    MorphingDragon

    Joined:
    Mar 27, 2009
    Location:
    The World Inbetween
    #15
    I got it although not by fiddling with code.

    Jeez, I cant believe I've forgotten so much or High School geometry.
     
  16. balamw Moderator

    balamw

    Staff Member

    Joined:
    Aug 16, 2005
    Location:
    New England
    #16
    ;) Always good to step back and check what the code is supposed to be doing.

    For the record here's the changes I made to your original code besides drawing straight on the form.

    Code:
    double x = 100, y = 100, xi = 100, yi = 100;
    
    ...
    
    xi = x - (starLength * Math.Cos(i*angle));
    yi = y + (starLength * Math.Sin(i*angle));
    
    B
     

Share This Page