Differences

This shows you the differences between two versions of the page.

--- oliver-wang-generative [2021/06/20 18:22] – created oliver.wang
+++ oliver-wang-generative [2021/06/29 01:39] (current) – renick
@@ Line 1: / Line 1: @@
+========Oliver Wang's crazyDog.js========
+by [[oliver-wang|Oliver]]
 <HTML>
-<iframe src="https://editor.p5js.org/oliver07280/sketches/6xKaivlJM" width=99% height=799px></iframe>
+<iframe src="https://editor.p5js.org/renick/present/EBb8_xfW7" width=99% height=799px></iframe>
 </HTML>
+===== about my crazyDog.js =====
+I think my dog code is very different with other, cause I want to have a good score of program dog, so I think a lot and type a lot of code. My dog is different with other is because they just use triangle, square, circle, and I use a code name is "noStroke" it can make the shape be no line around it, and that can make shape be closer and then look two shape like one shape. After that I use line to make the dog better, but cost is when I want change whole dog I need to put a lot of time in and that's hard to make thing.
+The animation code is released under the [[https://www.gnu.org/licenses/old-licenses/lgpl-2.1.en.html|GNU Lesser General Public License v2.1]].
+===== the code for my crazyDog.js =====
+<Code:js>
+function setup() {
+createCanvas(1800, 780);
+x = width;
+y = height / 2;
+}
+class DogBackground{
+constructor(y, numberOfDog){
+this.positionY = y;
+this.numberDog = numberOfDog
+}draw(){
+let x = 0;
+let X = x;
+let positionX = x;
+let movingX = 100;
+let movingY = 100;
+//sun
+fill('yellow')
+noStroke(0)
+circle(398, this.positionY-100, 100)
+//sky
+  for(let i = 0; i < this.numberDog+10 ; i++){
+//grass
+noStroke()
+fill(103, 222, 103)
+rect(positionX, this.positionY+200, 400, 480)
+positionX += 200
+}
+  //tree
+for(let i =0; i <this.numberDog+1; i++){
+x += 200
+fill(120, 74, 0)
+rect(x-77, this.positionY+100, 30, 100)
+triangle(x-75, this.positionY+200, x-30, this.positionY+200, x-50, this.positionY+175)
+triangle(x-70, this.positionY+200, x-96, this.positionY+200, x-76, this.positionY+176)
+fill('pink')
+ellipse(x-62, this.positionY+35, 100, 200)
+x += 60
+}
+for(let i = 0 ; i < this.numberDog+1; i++){
+fill(246, 98, 135)
+circle(x-118, this.positionY-7, 20)
+circle(x-121, this.positionY+3, 20)
+circle(x-104, this.positionY-7, 20)
+circle(x-112, this.positionY+9, 20)
+circle(x-102, this.positionY+3, 20)
+fill('yellow')
+circle(x-111, this.positionY-1, 10)
+x -= 290
+}}}
+class Dog {
+constructor(x, y, colorOfDog1, colorOfDog2, colorOfDog3, numberOfDog, space){
+this.DogColor1 = colorOfDog1;
+this.DogColor2 = colorOfDog2;
+this.DogColor3 = colorOfDog3;
+this.positionX = x;
+this.positionY = y;
+this.numberDog = numberOfDog;
+this.dogSpace = space;
+}draw (){
+for(let i = 0; i < this.numberDog; i++){
+noStroke()
+//body
+fill(Math.random()*255, Math.random()*255, Math.random()*255)
+rect(this.positionX-3, this.positionY+163, 150, 40, 50)
+//feet
+rect(this.positionX+30, this.positionY-425, 50,  20, 50);
+rect(this.positionX+82, this.positionY+189, 70, 20, 50);
+rect(this.positionX+19, this.positionY+191, 40, 20, 50)
+//head
+rect(this.positionX+116, this.positionY+146, 40, 35, 15)
+//mouth
+rect(this.positionX+138, this.positionY+160, 30, 20, 10)
+stroke(1)
+noFill()
+curve(this.positionX+23, this.positionY+202, this.positionX+142, this.positionY+208, this.positionX+96, this.positionY+208, this.positionX+43, this.positionY+208)
+curve(this.positionX+207, this.positionY+183, this.positionX+96, this.positionY+208, this.positionX+92, this.positionY+191, this.positionX+126, this.positionY+209)
+curve(this.positionX+73, this.positionY+208, this.positionX+145, this.positionY+208, this.positionX+125, this.positionY+190, this.positionX-60, this.positionY+244)
+curve(this.positionX+44, this.positionY+217, this.positionX+53, this.positionY+196, this.positionX+49, this.positionY+211,  this.positionX-51, this.positionY+227)
+curve(this.positionX+48, this.positionY+201, this.positionX+49, this.positionY+211, this.positionX+19, this.positionY+203, this.positionX+38, this.positionY+135)
+curve(this.positionX+202, this.positionY+144, this.positionX+23, this.positionY+203, this.positionX+28, this.positionY+163, this.positionX+299, this.positionY+223)
+curve(this.positionX+138, this.positionY+227, this.positionX+116, this.positionY+163, this.positionX+144, this.positionY+146, this.positionX+221, this.positionY+183)
+curve(this.positionX+79, this.positionY+138, this.positionX+144, this.positionY+146, this.positionX+156, this.positionY+160, this.positionX+144, this.positionY+154)
+curve(this.positionX+92, this.positionY+152, this.positionX+158, this.positionY+180, this.positionX+156, this.positionY+160, this.positionX+31, this.positionY+187)
+curve(this.positionX+142  , this.positionY+170, this.positionX+146, this.positionY+191, this.positionX+145, this.positionY+180, this.positionX+123, this.positionY+197)
+line(this.positionX+158, this.positionY+180, this.positionX+141, this.positionY+180)
+line(this.positionX+28, this.positionY+163,this.positionX+116, this.positionY+163)
+line(this.positionX+85, this.positionY+202, this.positionX+59, this.positionY+202)
+//eye
+fill('black')
+circle(this.positionX+142, this.positionY+157, 5)
+//ear
+ellipse(this.positionX+127, this.positionY+157, 15, 20)
+//nose
+square(this.positionX+158, this.positionY+162, 11, 20)
+fill(Math.random()*255, Math.random()*255, Math.random()*255)
+noStroke()
+stroke(1)
+curve(this.positionX+24, this.positionY+202, this.positionX+6, this.positionY+167, this.positionX+16, this.positionY+164, this.positionX+155, this.positionY+482)
+this.positionX = this.positionX + this.dogSpace
+}}}
+class Cloud{
+constructor(x, y){
+this.positionX = x;
+this.positionY = y;
+}draw(){
+let positionX = this.positionX
+for(let i = 0; i < 10; i++){
+noStroke()
+fill('white')
+//cloud
+ellipse(x+this.positionX, 24, 50, 30)
+rect(x+this.positionX-10, 19, 50,  30, 20)
+rect(x+this.positionX-30, 19, 50,  30, 20)
+ellipse(x+positionX+4, 49, 50, 30)
+this.positionX = this.positionX + 200
+}
+}
+}
+</Code>