Harpsichord (Music)

size (500, 500);//เป็นการกำหนดขนาดของcanvas โดย  size (ขนาดของแกนx, ขนาดของแกนy);
background (000, 000, 102);//เป็นการเพิ่มสีให้กับพื้นหลัง โดย background(สีแดง, สีเขียว, สีน้ำเงิน); ค่าของสีแต่ละตัวมีได้สูงสุดไม่เกิน 255 และต่ำสุดที่ 000
//variables  เป็นบรรทัดที่ประกาศ และกำหนดตัวแปร โดย int คือค่าของตัวแปรที่เป็นจำนวนเต็ม หลักการคือนำค่าทางด้านขวาของเครื่องหมาย = ไปใส่ให้ทางด้านซ้ายเรียกว่า Assingment Operator
int x = 130;//ความหมายคือ นำ 130 ซึ่งเป็นจำนวนเต็ม ทางด้านขวาของเครื่องหมาย = ไปใส่ค่าให้กับตัวแปรทางด้านซ้าย คือตัวแปร x นั่นเอง
int y = 90;
int s = 395;
int r = 10;

//draw Lowest strings วาดเส้นเสียง
stroke (255, 255, 000); //คือคำสั่งเกี่ยวกับการเติมสีเส้น โดย stroke (ค่าของสีแดง, ค่าของสีเขียว, ค่าของสีน้ำเงิน);
strokeWeight(1); //เป็นการกำหนดความหนาของเส้น โดยstrokeWeight(ค่าความหนาของเส้น);
line (x+20, y, x+20, s-10); //เป็นการสร้างเส้น โดย line (ค่าพิกัดจุดเริ่มของx, ค่าพิกัดจุดเริ่มของy, ค่าพิกัดจุดสิ้นสุดของx, ค่าพิกัดจุดสิ้นสุดของy); แต่ในกรณีนี้ใช้การกำหนดค่าเพิ่มขึ้น หรือลดลง จากตัวแปรที่มีอยู่ แทนการใส่ค่าไปตรงๆ เพื่อสะดวกในการปรับเปลี่ยน
line (x+35, y-10, x+35, s-30);
line (x+50, y-15, x+50, s-50);
line (x+65, y-10, x+65, s-70);
line (x+80, y-5, x+80, s-80);
line (x+95, y, x+95, s-100);
line (x+110, y+10, x+110, s-110);
line (x+125, y+20, x+125, s-130);
line (x+140, y+30, x+140, s-150);
line (x+155, y+40, x+155, s-170);
line (x+170, y+50, x+170, s-190);
line (x+185, y+60, x+185, s-210);
line (x+200, y+70, x+200, s-220);

//draw Harmonic Curve วาดส่วนโค้งด้านบนของฮาร์ป
stroke (255, 204, 051);
strokeWeight(20);
noFill (); //คือคำสั่งที่ใช้ยกเลิกการเติมสีให้กับรูปร่าง
curve(x, 800, x+5, 100, x+240, 150, x+150, -200); //เป็นคำสั่งที่ใช้สร้างเส้นโค้ง โดย curve (จุดxเริ่มต้นกำหนดความโค้ง, จุดyเริ่มต้นกำหนดความโค้ง, จุดแรกที่จะเริ่มวาดโค้งพิกัดx, จุดแรกที่จะเริ่มวาดโค้งพิกัดy, จุดสุดท้ายที่จะเริ่มวาดโค้งพิกัดx, จุดสุดท้ายที่จะเริ่มวาดโค้งพิกัดy, จุดxสิ้นสุดกำหนดความโค้ง, จุดyสิ้นสุดกำหนดความโค้ง);

//draw Soundboard วาดแกนที่ยื่นเฉียงออกมาจากตัวฮาร์ป
stroke (255, 204, 051);
strokeWeight(25);
fill (255, 135, 000); );//เป็นการเติมสีให้กับรูปร่างที่เราสร้าง โดยfill(ค่าของสีแดง, ค่าของสีเขียว, ค่าของสีน้ำเงิน);
line (x+20, 420, x+250, 150);
line (x+10, 420, x+250, 150);
strokeWeight(5);
ellipse (x+250, 150, r+5, r+5); //คือคำสั่งที่ใช้ในการวาดรูปทรงกลม หรือทรงรีก็ได้ โดย ellipse (ค่าxที่เป็นจุดศูนย์กลางวงกลม, ค่าyที่เป็นจุดศูนย์กลางวงกลม, ขนาดความยาวของวงกลมตามแกนx, ขนาดความยาวของวงกลมตามแกนy); ถ้าขนาดความยาวของวงกลมตามแกนx กับ ขนาดความยาวของวงกลมตามแกนy เท่ากันจะเป็นวงกลม แต่ถ้าไม่จะเป็นวงรี

//draw Pillar วาดแกนแนวตรงของฮาร์ป
strokeWeight (15);
line (x, 100, x, 400);
strokeWeight (5);
ellipse (x, 100, r, r);
ellipse (x, 400, r, r);
ellipse (x, 85, r+5, r+5);
ellipse (x, 415, r+5, r+5);
ellipse (x, 65, r+10, r+10);
ellipse (x, 435, 60, 20);