Homework 3

Short Description:

This assignment is worth 20 points.

Goals

• Have generated a basic image using a simple graphics API.
• Have worked with polar coordinates.
• Have built an interface which allows users to interact with the simulation.
• Have dealt with a nearest neighbor condition.

Formal Description

The basic idea is to start with a fixed structure, to which particles will attach. In our simulation this will be a single particle fixed at the center of the canvas. The simulation proceeds by releasing a number of particles into the media. The particles will perform a random walk until:

• It comes in contact with another particle and becomes fixed.
• It falls off the edge of the media
• It times out by taking too many steps.

A DLA image on a 600x600 canvas, 10,000 point seeds with a maximum of 10,000 steps each. Colored by age

Your assignment is to create a DLA figure using javascript and the HTML canvas. You should use only two canvas commands:

• fillStyle
• fillRect

You should provide an interface which allows the user to change

• The foreground and background colors of the image
• The number of particles generated
• The maximum number of steps each particle can take.

Some Thoughts

• I kept track of the "radius" of the figure. This was the distance from the center to the furthest point.
  • This was initially set to 2 (arbitrary value)
  • It was modified to be 75% of the distance from the center to the furthest point.
    • This tended to make the figure generated more balanced.
    • 
    • You might want to allow the user the ability to change the radius modifier as changing this value radically changes the picture.
  • As the simulation proceeded, I dropped new particles along a circle described by this radius.
    • This is easy to do using polar coordinates r and Θ
    • Where 0 ≤ Θ ≤ 2Π
    • x = center.x + r cos(Θ);
    • y = center.y + r sin(Θ);
    • Remember sin and cos use angles in radians, if you want to work with angles in degrees the conversion factor is
      • b radians = a degrees * 2 * Π radians / 360 degrees
  • After a particle is dropped, it will perform a random walk.
    • Generate a random number between 1 and 4 (or 0 and 3)
    • If the number is 1, add 1 to x coordinate,
    • If the number is 2, subtract 1 from x coordinate
    • If the number is 3, add 1 to the y coordinate
    • If the number is 4, subtract 1 from the y coordinate.
    • 
    • One option would be to allow the particle to travel diagonally as well. This would allow 8 possible destinations.
  • The random walk stops after one of the following conditions is met.
    • The particle falls of the edge of the simulation area
    • The particle comes close to a fixed particle
      • This is determined by checking the 4 (or 8) nearest neighbors.
      • 
      • In the figure
        • the black dot represents the particle
        • The green squares represent the 4-connected nearest neighbors.
        • The 8-connected nearest neighbors include the 4-connected nearest neighbors and the blue squares.
      • An option would be to allow the particle to connect for either of these two schemes.
    • A maximum iteration count for the particle is reached.
• I used a 2d array to store the results of the simulation
  • All cells were initialized to -1
  • When a particle attached to the structure, I set the value of the cell to the particle id
    • (for (id = 1; id<= particleMax; id++) {)
  • This will allow for coloration by age. (See first picture)

Documentation

• Problems encountered
• Interesting techniques employed
• Sources of information
• Collaborators
• Notes on additions
• Screen shots of interesting results.

Extras

If you do decide to continue some interesting additions might include

• Start with multiple attachment points, for example the corners of a square. This will require you to modify where you drop particles in the simulation, but will produce interesting results. The Wikipedia article had a picture where the figure started with a fixed line.
• Change the boundary conditions. Right now we are using a fixed boundary condition. In periodic boundary conditions the left and right side are connected and the top and bottom are connected. This allows a particle which falls off the left side to appear on the the right and vice versa. Using periodic boundary conditions will create different results.
• Adding gravity to the random walk will make it less random but should create a more symmetric figure. Change the random walk step to make it more likely the particle will move towards the "center" of the canvas or possibly of the figure.
• We will deal with color later (soon) but adding different colorization schemes may provide interesting results.
• We will deal with simple animation later. This is probably not an ideal situation for animation as it requires too many steps. However, it might be interesting to animate the growth of the image by showing particle trails for the last n particles.
• Anything else you think of.

Submission

Submit your tar file as an attachment to a message to dbennett@edinboro.edu. Please include your name, and the fact that this is homework 1 in the title of the message.