Public Group

# Why does my sine wave look jagged when blown up? (eg. newbie question)

This topic is 5202 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

## Recommended Posts

I'm doing a Scorched Earth type of game and I'm a bit unhappy with my landscape. Right now I'm generating it using a sine wave like this:
  // Create the wave
for x := 0 to _bitmap.Width do begin
_points[x].x := x;
_points[x].y := Round((sin((x) * pi / 180.0) + 1) / 8 * 200) + 125;

// Fill in the bottom of the wave (eg. make solid ground)
for y := _points[x].y + 1 to _bitmap.height do begin
_bitmap.Canvas.pixels[x, y] := 255;
end;
end;

// Draw the wave
_bitmap.Canvas.Polyline(_points);

Basically all this does is generate a Y value for each X value and then draw a line connecting each point. I think that because the points are connected via a line that it looks all jaggedy and generally ugly. Should I be doing this a different way? I've read something about drawing it based on frame times (eg. the time it takes to draw a frame) or something, but I'm very confused about the whole thing...

##### Share on other sites
I've never used that language, but I guess the Round function is the bad guy. Or are you refering to the nont anti-aliased effect you get? I.e. the pixel-sized jaggings?

##### Share on other sites
Yeah. I agree. Remove the round() call and you should have smooth terrain.

Mr. Creamy.

##### Share on other sites
Well, (x, y) coordinates need to be integers so thats why I'm rounding. I can't say I want a pixel at (4.126, 10.390), right?

##### Share on other sites
With jagged, do you mean not antialiased?

##### Share on other sites
What you are seeing is likely loss of data.

For many things, all calculations should be performed using floating point values, which preserve non-integral parts of the data.

This is especialy important when scaling is used.

example:

Original Data 1.5f
Scale Factor 20.0f

(1.5 becomes 1)
(20.0 becomes 20)
1 * 20 = 20

Scaled using floating points:(good)

1.5 * 20.0 = 30 (A very different answer)

The jagged effect you are seeing from the sine function is because sine returns values in the range of -1 to +1, if the fractional parts of the data are not maintained then your data will be far more 'discreet' (jagged chunks).

In short when doing operations that contain scaling of floating point values, be sure that all of your operations are floating point (unless you intend otherwise)

##### Share on other sites
Not really but anti-aliasing would definitely help.

All I mean is that they look really ugly and jagged (I'm not sure why they are jagged, maybe it's because of no anti-aliasing)

In a small window it looks fine, but in full-screen 1024x768 it looks nasty.

##### Share on other sites
Quote:
 Original post by sofakngWell, (x, y) coordinates need to be integers so thats why I'm rounding. I can't say I want a pixel at (4.126, 10.390), right?

You want you final values to be integers, but not the intermediate operations.

I am not familiar with the language you are using, but you should insure that your operations are floating point.

##### Share on other sites
Everything is calculated in float except for the final (+125). The (+125) is done to drop the sine wave to the lower part of the screen.

##### Share on other sites
Since the Round-routine is calculated on (sin((x) * pi / 180.0) + 1) / 8 * 200 my conclusion was that the precision of the sin()-function would not be lost. However, are you scaling the image to fit fullscreen? Then you have to create a bigger version of the wave so you use it for much higher resolution-views.

• ### Game Developer Survey

We are looking for qualified game developers to participate in a 10-minute online survey. Qualified participants will be offered a \$15 incentive for your time and insights. Click here to start!

• 9
• 11
• 15
• 21
• 26