Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
howard-liao-generative [2021/06/20 18:27] – howard.liao | howard-liao-generative [2021/06/29 01:35] (current) – renick | ||
---|---|---|---|
Line 1: | Line 1: | ||
=====Howard Liao's crazyDog.js===== | =====Howard Liao's crazyDog.js===== | ||
+ | by [[: | ||
< | < | ||
- | <iframe src=https:// | + | <iframe src=https:// |
</ | </ | ||
+ | |||
+ | ===== about my crazyDog.js ===== | ||
+ | |||
+ | This is my crazy dog.js, this is what I learned this semester, We try to make a lot of dogs and an animation background or a dog. | ||
+ | |||
+ | The animation code is released under the [[https:// | ||
+ | |||
+ | ===== the code for my crazyDog.js ===== | ||
+ | |||
+ | < | ||
+ | function setup() { | ||
+ | createCanvas(1920, | ||
+ | //noLoop() | ||
+ | } | ||
+ | |||
+ | class Dog { | ||
+ | // dogSize is the number of times bigger | ||
+ | constructor (xposition, yposition, dogSize) | ||
+ | { | ||
+ | this.xposition = xposition; | ||
+ | this.yposition = yposition; | ||
+ | this.dogSize = dogSize; | ||
+ | } | ||
+ | draw () { | ||
+ | fill(2, 25, 2) | ||
+ | square(this.xposition + (200 * this.dogSize), | ||
+ | square(this.xposition + 90, this.yposition + 80, this.dogSize * 50); | ||
+ | square(this.xposition + 130, this.yposition + 130, this.dogSize * 140); | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | square(this.xposition + 98, this.yposition + 121, this.dogSize * 35); | ||
+ | square(this.xposition + 162, this.yposition + 122, this.dogSize * 35); | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | square(this.xposition + 99, this.yposition + 126, this.dogSize * 24); | ||
+ | square(this.xposition + 163, this.yposition + 126, this.dogSize * 24); | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | square(this.xposition + 100, this.yposition + 126, this.dogSize * 17); | ||
+ | square(this.xposition + 164, this.yposition + 126, this.dogSize * 17); | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | square(this.xposition + 100, this.yposition + 126, | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | square(this.xposition + 110, this.yposition + 196, this.dogSize * 200, 1, 50) | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | square(this.xposition + 140, this.yposition + 326, this.dogSize * 48, 10); | ||
+ | square(this.xposition + 200, this.yposition + 355, this.dogSize * 41, 10); | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | fill(Math.random() * 255, Math.random() * 255, Math.random() * 255) | ||
+ | noStroke(); | ||
+ | noFill(); | ||
+ | |||
+ | } | ||
+ | } | ||
+ | |||
+ | |||
+ | class BackgroundPattern { | ||
+ | // dogSize is the number of times bigger | ||
+ | constructor (xposition, yposition, patternSize, | ||
+ | { | ||
+ | this.xposition = xposition; | ||
+ | this.yposition = yposition; | ||
+ | this.patternSize = patternSize; | ||
+ | this.hairColor = hColor; | ||
+ | this.eyeColor = eColor | ||
+ | } | ||
+ | draw () { | ||
+ | fill(255, | ||
+ | square(this.xposition + 24, this.yposition + 126, | ||
+ | fill(245, 152, 181); | ||
+ | square(this.xposition + 10, this.yposition + 134, this.patternSize * 10); | ||
+ | fill(19, 121, 50); | ||
+ | noStroke(); | ||
+ | smooth(); | ||
+ | ellipse(this.xposition + 30, this.yposition + 59, this.patternSize * 36, this.patternSize * 36); | ||
+ | noSmooth(); | ||
+ | ellipse(this.xposition + 70, this.yposition + 50, this.patternSize * 36, this.patternSize * 36); | ||
+ | } | ||
+ | } | ||
+ | |||
+ | | ||
+ | let outputArray = []; | ||
+ | for (let i = 0; i < n ; i++) { | ||
+ | outputArray.push(new BackgroundPattern (0 + (i*120),0 + y, 1," | ||
+ | } | ||
+ | return outputArray | ||
+ | } | ||
+ | |||
+ | function dogArray (n, y) { | ||
+ | let outputArray = []; | ||
+ | | ||
+ | for (let i = 0; i < n ; i++) { | ||
+ | outputArray.push(new Dog (0 + (200*i), | ||
+ | } | ||
+ | } | ||
+ | return outputArray | ||
+ | } | ||
+ | |||
+ | |||
+ | function draw() { | ||
+ | background(255, | ||
+ | // | ||
+ | //let myDog2 = new Dog (0, 0, 0.5, " | ||
+ | // | ||
+ | //let myPattern1 = new BackgroundPattern (0, 0, 1, " | ||
+ | // | ||
+ | // | ||
+ | |||
+ | | ||
+ | for(let i = 0; i < 15 ; i++){ | ||
+ | let myBackgroundPattern = backgroundPatternArray(15, | ||
+ | for(let i = 0; i < myBackgroundPattern.length ; i++){ | ||
+ | myBackgroundPattern[i].draw() | ||
+ | } | ||
+ | } | ||
+ | | ||
+ | let howardsDogs = dogArray (10,0); | ||
+ | // | ||
+ | for(let i = 0; i< howardsDogs.length; | ||
+ | howardsDogs[i].draw(); | ||
+ | } | ||
+ | | ||
+ | //let myDog = new Dog (0, 0, 1); | ||
+ | // | ||
+ | } | ||
+ | </ | ||
+ |