Learning Processing: A Beginner's Guide to Programming Images ...

More documents

Recommendations

Info

13.6 Perlin Noise Mathematics 207 One of the qualities of a good random number generator is that the numbers produced appear to have no relationship. If they exhibit no discernible pattern, they are considered random . In programming behaviors that have an organic, almost lifelife quality, a little bit of randomness is a good thing. However, we do not want too much randomness. Th is is the approach taken by Ken Perlin, who developed a function in the early 1980’s entitled “ Perlin noise ” that produces a naturally ordered (i.e., “ smooth ” ) sequence of pseudo-random numbers. It was originally designed to create procedural textures, for which Ken Perlin won an Academy Award for Technical Achievement. Perlin noise can be used to generate a variety of interesting eff ects including clouds, landscapes, marble textures, and so on. Figure 13.3 shows two graphs,—a graph of Perlin noise over time (the x -axis represents time; note how the curve is smooth) compared to a graph of pure random numbers over time. (Visit this book’s web site for the code that generated these graphs.) fi g. 13.3 } void draw() { background(0); float r = random(1); ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ____________________________________________________ ellipse(width/2,y,16,16); Perlin Noise Random
208 Learning Processing Noise Detail If you visit the Processing.org noise reference, you will fi nd that noise is calculated over several “ octaves. ” You can change the number of octaves and their relative importance by calling the noiseDetail( ) function. Th is, in turn, can change how the noise function behaves. See http://processing.org/reference/noiseDetail_.html. You can read more about how noise works from Ken Perlin himself: http://www.noisemachine.com/talk1/. Processing has a built-in implementation of the Perlin noise algorithm with the function noise( ) . Th e noise( ) function takes one, two, or three arguments (referring to the “ space ” in which noise is computed: one, two, or three dimensions). Th is chapter will look at one-dimensional noise only. Visit the Processing web site for further information about two-dimensional and three-dimensional noise. One-dimensional Perlin noise produces as a linear sequence of values over time. For example: 0.364, 0.363, 0.363, 0.364, 0.365 Note how the numbers move up or down randomly, but stay close to the value of their predecessor. Now, in order to get these numbers out of Processing , we have to do two things: (1) call the function noise( ) , and (2) pass in as an argument the current “ time. ” We would typically start at time t � 0 and therefore call the function like so: “ noise(t); ” float t = 0.0; float noisevalue = noise(t); // Noise at time 0 We can also take the above code and run it looping in draw( ) . float t = 0.0; void draw() { float noisevalue = noise(t); println(noisevalue); } Th e above code results in the same value printed over and over. Th is is because we are asking for the result of the noise( ) function at the same point in “ time ” —0.0—over and over. If we increment the “ time ” variable t, however, we will get a diff erent result. float t = 0.0; void draw() { float noisevalue = noise(t); println(noisevalue); } t + = 0.01; Time moves forward! Output: 0.28515625 0.28515625 0.28515625 0.28515625 Output: 0.12609221 0.12697512 0.12972163 0.13423012 0.1403218
Page 2 and 3:
Learning Processing A Beginner’s
Page 4 and 5:
Learning Processing A Beginner’s
Page 6 and 7:
Contents Acknowledgments vii Introd
Page 8 and 9:
Acknowledgments In the fall of 2001
Page 10 and 11:
Introduction What is this book? Th
Page 12 and 13:
Introduction xi While both of these
Page 14 and 15:
Introduction xiii Th e book is desi
Page 16 and 17:
Introduction xv Th is book’s web
Page 18 and 19:
Introductory Exercise: Write instru
Page 20 and 21:
Lesson One The Beginning 1 Pixels 2
Page 22 and 23:
1 Pixels “ A journey of a thousan
Page 24 and 25:
1.2 Simple Shapes Pixels 5 Th e vas
Page 26 and 27:
0 1 2 3 4 5 6 7 8 9 fi g. 1.9 top l
Page 28 and 29:
1.3 Pixels 9 Exercise 1-3: Reverse
Page 30 and 31:
Example 1-2: noFill ( ) background(
Page 32 and 33:
fi g. 1.19 Pixels 13 Exercise 1-5:
Page 34 and 35:
colorMode(RGB,100); Pixels 15 Th e
Page 36 and 37:
2 2.1 Processing “ Computers in t
Page 38 and 39:
fi g. 2.2 Once you have opened the
Page 40 and 41:
Let’s write a fi rst example ( se
Page 42 and 43:
Line 9 fi g. 2.6 Processing is case
Page 44 and 45:
fi g. 2.7 Processing 25 Processing
Page 46 and 47:
Example 2-1: Zoog again size(200,20
Page 48 and 49:
Processing 29 To see the applet wor
Page 50 and 51:
3 3.1 Interaction “ Always rememb
Page 52 and 53:
Let’s look at what will surely be
Page 54 and 55:
3.3 Variation with the Mouse Intera
Page 56 and 57:
Draw Zoog's eyes fill(0); ellipse(8
Page 58 and 59:
3.4 Mouse Clicks and Key Presses In
Page 60 and 61:
Draw Zoog's eyes fill(mo useX,0,mou
Page 62 and 63:
Lesson Two Everything You Need to K
Page 64 and 65:
4 4.1 Variables “ All of the book
Page 66 and 67:
4.2 Variable Declaration and Initia
Page 68 and 69:
A variable can also be initialized
Page 70 and 71:
x = 5; x = a + b; x = y - 10 * 20;
Page 72 and 73:
void draw() { // Draw the backgroun
Page 74 and 75:
4.6 Random: Variety is the spice of
Page 76 and 77:
4.7 Example 4-7: Filling variables
Page 78 and 79:
5 5.1 Conditionals Conditionals 59
Page 80 and 81:
Finally, for testing multiple condi
Page 82 and 83:
Conditionals 63 It is worth pointin
Page 84 and 85:
Conditionals 65 Getting into the ha
Page 86 and 87:
Our fi rst instinct might be to wri
Page 88 and 89:
5.5 Multiple Rollovers Conditionals
Page 90 and 91:
Conditionals 71 We can then check t
Page 92 and 93:
5.7 Conditionals 73 Exercise 5-8: E
Page 94 and 95:
Reversing the Polarity of a Number
Page 96 and 97:
One way to solve this problem is to
Page 98 and 99:
Display the square fill(0); noStrok
Page 100 and 101:
6 Loops “ Repetition is the reali
Page 102 and 103:
Loops 83 (see Chapter 5). However,
Page 104 and 105:
while (y < 100) { // Loop! } 3. Wha
Page 106 and 107:
while (x < = endLegs) { line(x,y,x,
Page 108 and 109:
Th e same exact loop can be program
Page 110 and 111:
Loops 91 Th is was a nice simplifi
Page 112 and 113:
6.6 Loop Inside the Main Loop Loops
Page 114 and 115:
6.7 float distance = abs(mouseX - i
Page 116 and 117:
Draw Zoog's legs stroke(0); line(x-
Page 118 and 119:
Lesson Three Organization 7 Functio
Page 120 and 121:
7 7.1 Functions “ When it’s all
Page 122 and 123:
7.2 “ User Defi ned ” Functions
Page 124 and 125:
Example 5-6: Bouncing ball // Decla
Page 126 and 127:
7.5 Functions 107 Exercise 7-3: Tak
Page 128 and 129:
Functions 109 It should be fairly a
Page 130 and 131:
int globalX = 0; int globalY = 100;
Page 132 and 133:
void setup() { println( "a"); funct
Page 134 and 135:
If we did not include a return stat
Page 136 and 137:
7.8 Zoog Reorganization Zoog is now
Page 138 and 139:
void draw() { } background(0); // D
Page 140 and 141:
8 8.1 Objects “ No object is so b
Page 142 and 143:
Setup: Draw: Initialize car color.
Page 144 and 145:
Objects 125 • The Class Name—Th
Page 146 and 147:
Objects 127 One other thing; with t
Page 148 and 149:
fi g. 8.1 fi g. 8.2 fi g. 8.4 fi g.
Page 150 and 151:
Objects 131 Nevertheless, this is q
Page 152 and 153:
void draw() { } background(100); ba
Page 154 and 155:
Objects 135 modular, reusable packa
Page 156 and 157:
Lesson Three Project Step 1. Take y
Page 158 and 159:
Lesson Four More of the Same 9 Arra
Page 160 and 161:
9 Arrays “ I might repeat to myse
Page 162 and 163:
Car myCar80 Car myCar81 Car myCar82
Page 164 and 165:
9.3 Declaring and Creating an Array
Page 166 and 167:
9.4 Initializing an Array One way t
Page 168 and 169:
Example 9-5: Using a for loop to in
Page 170 and 171:
Arrays 151 Now comes the hard part.
Page 172 and 173:
9.7 Arrays 153 Exercise 9-7: Rewrit
Page 174 and 175:
9.8 Interactive Objects Arrays 155
Page 176 and 177: Check if point is inside of Stripe
Page 178 and 179: alls[i].gravity(); balls[i].move();
Page 180 and 181: Draw Zoog's arms with a for loop fo
Page 182 and 183: Lesson Five Putting It All Together
Page 184 and 185: 10 10.1 Algorithms “ Lather. Rins
Page 186 and 187: Translating the preceding algorithm
Page 188 and 189: void draw() { background(255); stro
Page 190 and 191: Example 10-2: Bouncing ball class c
Page 192 and 193: Now that the function is complete,
Page 194 and 195: 10.6 // Constructor Ball(float temp
Page 196 and 197: Algorithms 177 With the above logic
Page 198 and 199: Drop() { r = 8; // All raindrops ar
Page 200 and 201: Example 10-7: Drops one at a time /
Page 202 and 203: Algorithms 183 Notice how every sin
Page 204 and 205: oolean intersecting = ball1.interse
Page 206 and 207: } void setLocation(float tempX, flo
Page 208 and 209: Algorithms 189 It is important to r
Page 210 and 211: 11 Debugging “ Th e diff erence b
Page 212 and 213: Debugging 193 Once all the code is
Page 214 and 215: 12 Libraries “ If truth is beauty
Page 216 and 217: or /Applications/Processing 0135/ c
Page 218 and 219: Lesson Six The World Revolves Aroun
Page 220 and 221: 13 Mathematics Mathematics 201 “
Page 222 and 223: Mathematics 203 Th erefore, modulo
Page 224 and 225: Th e probability of a coin fl ippin
Page 228 and 229: Mathematics 209 How quickly we incr
Page 230 and 231: It is fairly intuitive for us to th
Page 232 and 233: fi g. 13.9 y-axis sine(theta) � y
Page 234 and 235: Example 13-6: Oscillation float the
Page 236 and 237: Mathematics 217 In 1975, Benoit Man
Page 238 and 239: Mathematics 219 said about recursio
Page 240 and 241: Mathematics 221 A two-dimensional a
Page 242 and 243: Example 13-10: Two-dimensional arra
Page 244 and 245: } void display() { } // FILL IN Mat
Page 246 and 247: 14 14.1 Translation and Rotation (i
Page 248 and 249: Our fi rst instinct might be to add
Page 250 and 251: Example 14-3: A rectangle moving al
Page 252 and 253: When using the OPENGL mode, you mus
Page 254 and 255: Translation and Rotation (in 3D!) 2
Page 256 and 257: 14.5 fill(150,150); vertex(-t, t,-t
Page 258 and 259: 14.6 Example 14-5: Rectangle rotati
Page 266 and 267: fill(0,100); // Note the use of pus
Page 268 and 269: 14.9 Example 14-17: Nested push and
Page 270 and 271: stroke(0); fill(175); ellipse(0,0,d
Page 272 and 273: Lesson Seven Pixels Under a Microsc
Page 274 and 275: 15 Images Images 255 “ Politics w
Page 276 and 277:
And yet: PImage img = loadImage( "f
Page 278 and 279:
15.3 My Very First Image Processing
Page 280 and 281:
Images 261 Even better, if we just
Page 282 and 283:
Images 263 // Create a grayscale co
Page 284 and 285:
Images 265 15.6 Intro to Image Proc
Page 286 and 287:
Images 267 Since we are altering th
Page 288 and 289:
15.9 More on fi lter( ): fi lter(mo
Page 290 and 291:
Images 271 Example 15-13 performs a
Page 292 and 293:
Example 15-14: “ Pointillism ”
Page 294 and 295:
16 16.1 Video “ I have no memory.
Page 296 and 297:
Video 277 Th e above line of code i
Page 298 and 299:
void draw() { // Check to see if a
Page 300 and 301:
16.3 Recorded Video Video 281 Displ
Page 302 and 303:
16.4 Video 283 Exercise 16-3: Using
Page 304 and 305:
Video 285 For every square at colum
Page 306 and 307:
} } // Each rect is colored white w
Page 308 and 309:
16.5 Video as Sensor, Computer Visi
Page 310 and 311:
Now, we are ready to compare the co
Page 312 and 313:
16.6 Video 293 Exercise 16-5: Take
Page 314 and 315:
void setup() { size(320,240); video
Page 316 and 317:
Example 16-13: Simple motion detect
Page 318 and 319:
16.8 // Step 4, compare colors (pre
Page 320 and 321:
Lesson Seven Project Develop a soft
Page 322 and 323:
Lesson Eight The Outside World 17 T
Page 324 and 325:
17 17.1 Text “ I could entertain
Page 326 and 327:
Exercise 17-2: Loop through and pri
Page 328 and 329:
17.3 Displaying Text Text 309 We wi
Page 330 and 331:
println(PFont.list()); For demonstr
Page 332 and 333:
X = �50 fi g. 17.4 float w = text
Page 334 and 335:
Example 17-4: Text mirror import pr
Page 336 and 337:
textFont(f); // Set the font transl
Page 338 and 339:
Exercise 17-9: Using textWidth( ) ,
Page 340 and 341:
Example 17-7: Boxes along a curve P
Page 342 and 343:
Text 323 Exercise 17-10: Create a s
Page 344 and 345:
18 Data Input “ A million monkeys
Page 346 and 347:
Example 18-1: User input PFont f; /
Page 348 and 349:
Data Input 329 Th e reverse of spli
Page 350 and 351:
Example 18-2: Graphing comma separa
Page 352 and 353:
Data Input 333 Th e rollover( ) fun
Page 354 and 355:
18.4 diameter = diameter_; } // Tru
Page 356 and 357:
} // Find the index of the end tag
Page 358 and 359:
void mousePressed() { // Increment
Page 360 and 361:
18.6 for (int i = 0; i < kinglear.l
Page 362 and 363:
Create and make an asynchronous req
Page 364 and 365:
� student � � id � 002 �
Page 366 and 367:
Requests for XML data are made via
Page 368 and 369:
18.8 Using the Processing XML Libra
Page 370 and 371:
XMLElement diameterElement = childr
Page 372 and 373:
Example 18-10: A Yahoo search impor
Page 374 and 375:
However, if you request a URL on a
Page 376 and 377:
19 19.1 Data Streams “ I’m mad
Page 378 and 379:
import processing.net.* ; Server se
Page 380 and 381:
Data Streams 361 Once the server is
Page 382 and 383:
19.4 void draw() { background(255);
Page 384 and 385:
Data Streams 365 must be networked
Page 386 and 387:
Data Streams 367 will send X , Y co
Page 388 and 389:
Data Streams 369 Here is the full S
Page 390 and 391:
Here is the entire client sketch: 1
Page 392 and 393:
Data Streams 373 Serial communicati
Page 394 and 395:
Data Streams 375 of information, ca
Page 396 and 397:
Corresponding Arduino code: int sen
Page 398 and 399:
Lesson Nine Making Noise 20 Sound 2
Page 400 and 401:
20 Sound “ Check. Check. Check 1.
Page 402 and 403:
void setup() { Sonia.start(this); }
Page 404 and 405:
void mousePressed() { // If the use
Page 406 and 407:
Sound 387 check and see if a sound
Page 408 and 409:
Is a point inside the doorbell (use
Page 410 and 411:
Pressing the mouse stops and starts
Page 412 and 413:
20.6 void draw() { background(255,1
Page 414 and 415:
In code, this translates to: // If
Page 416 and 417:
21 Exporting “ Wait a minute. I t
Page 418 and 419:
Th is code can be inserted anywhere
Page 420 and 421:
void setup() { size(400, 400); begi
Page 422 and 423:
Exporting 403 save( ) takes one arg
Page 424 and 425:
Exporting 405 Example 21-5 records
Page 426 and 427:
Lesson Ten Beyond Processing 22 Adv
Page 428 and 429:
22 Advanced Object-Oriented Program
Page 430 and 431:
class Point { float x,y; Point(floa
Page 432 and 433:
Advanced Object-Oriented Programmin
Page 434 and 435:
Advanced Object-Oriented Programmin
Page 436 and 437:
class Circle extends Shape { // inh
Page 438 and 439:
for (int i = 0; i < dogs.length; i
Page 440 and 441:
22.5 Example 22-2: Polymorphism //
Page 442 and 443:
23 23.1 Java “ I l o ve c off ee,
Page 444 and 445:
Java 425 instead of Processing , sp
Page 446 and 447:
fi g. 23.2 Java 427 Just as with th
Page 448 and 449:
Particle p = parray[i]; p.run(); p.
Page 450 and 451:
Hint: Add a function that returns a
Page 452 and 453:
Example 23-4: Super fancy ArrayList
Page 454 and 455:
Java 435 It is sad when these error
Page 456 and 457:
Th e tutorials will cover the same
Page 458 and 459:
Appendix: Common Errors Appendix 43
Page 460 and 461:
Error: No accessible fi eld named
Page 462 and 463:
void draw() { thing.display(); } Co
Page 464 and 465:
Error: Perhaps you wanted the overl
Page 466 and 467:
Index AIFF (Audio Interchange File
Page 468 and 469:
Fill( ) function 10 , 11 , 256 , 30
Page 470 and 471:
One-dimensional Perlin noise 208 OP
Page 472:
solar system, processing 247-9 vert
show all

Learning Processing: A Beginner's Guide to Programming Images ...

You also want an ePaper? Increase the reach of your titles

Delete template?

Save as template?