javascript - Algorithm to generate a starfield - Stack Overflow

admin管理员组

文章数量:1318021

I just learned about Logo yesterday. Being born in the nineties I never came across it before. So I started using an online Logo Interpreter written by Joshua Bell and I decided to write a circle function to make concentric circles. This is what I wrote:

cs

to circle
penup forward :radius right 90
pendown repeat 360 [forward 3.14 * :radius / 180 right 1]
penup left 90 back :radius pendown
end

make "radius 30

repeat 160 [circle make "radius :radius + 30]

Interestingly the drawing canvas is a toroidal array. Hence the circles end up overlapping. By drawing 160 concentric circles with increasing radii in multiples of 30 I ended up getting an image like this:

This is truly astonishing. At first glance it looks like a genuine picture of the night sky, and it got me thinking - is there a general algorithm to draw a starfield?

BTW if you look closely you can see a grid of 30 x 30 pixel squares. The boundaries are black so it's a little hard to notice.

I just learned about Logo yesterday. Being born in the nineties I never came across it before. So I started using an online Logo Interpreter written by Joshua Bell and I decided to write a circle function to make concentric circles. This is what I wrote:

cs

to circle
penup forward :radius right 90
pendown repeat 360 [forward 3.14 * :radius / 180 right 1]
penup left 90 back :radius pendown
end

make "radius 30

repeat 160 [circle make "radius :radius + 30]

Interestingly the drawing canvas is a toroidal array. Hence the circles end up overlapping. By drawing 160 concentric circles with increasing radii in multiples of 30 I ended up getting an image like this:

This is truly astonishing. At first glance it looks like a genuine picture of the night sky, and it got me thinking - is there a general algorithm to draw a starfield?

BTW if you look closely you can see a grid of 30 x 30 pixel squares. The boundaries are black so it's a little hard to notice.

• javascript
• algorithm
• canvas
• graphics
• logo-lang

Share Improve this question Follow edited Feb 5, 2015 at 21:31 Steven Doggart 43.7k88 gold badges7070 silver badges107107 bronze badges asked May 6, 2013 at 15:56 Aadit M ShahAadit M Shah 74.2k3131 gold badges175175 silver badges307307 bronze badges 3

• 2 I don't "do" logo, and I don't know of a general algorithm for generating a starfield, but if I were to "roll my own", I'd just go for the straightforward solution, i.e. generate a random x, a random y and set that as the position of one star. I'd do that in a loop until I hit some sentinel value and quit. I've done it before, and I generally got reasonable results (i.e. it looked like a "real" starfield). – Frecklefoot Commented May 6, 2013 at 18:33
• 2 This truly is astonishing. Thanks! Did you think of that yourself? – likeitlikeit Commented May 14, 2013 at 0:14
• 2 @likeitlikeit - I just kept drawing concentric circles on a toroidal array. The result looked like a starfield. =) – Aadit M Shah Commented May 14, 2013 at 14:30

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

The normal way to do a starfield is to choose points randomly in the x/y plane, in psuedocode something like:

fill image with black
for (however many stars you want)
   x = random() * width
   y = random() * height
   plot star at position x,y 
loop 

If you want to get fancy, you can plot stars with random brightnesses as as well. Also remember that stars flicker slightly, so if you are doing an animation then varying the brightness a bit each frame can make them look a more realistic.

As an avid player of Dwarf Fortress, I would go for a fractal formula to generate the stars. Computer random is just not good enough, in my opinion. Borrowing from DF game again, I would add various steps to enhance the starfield such as randomizing the shape, color, size, glow, cluster (intentionally adding a clump of stars together).

If you wanna go with realism, also simulate gas background. Space is not white dots on a solid black background.

Finally, I would suggest you get some space images (from our old friend Hubble telescope) and try to copy it as faithfully as possible. Then play with the parameters to get to your liking (perhaps you want to make a game out of this).

P.S: I have not specified any coding language because I believe its not a question regarding code (its pretty basic) but a question of design. You WOULD be doing this much easier in Flash / Actionscript than Java, trust me.

本文标签： javascriptAlgorithm to generate a starfieldStack Overflow