วาดรูปด้วยภาษาโลโก้ : ตอนที่ 2 – เส้น และ รูปร่าง (2)
ตอนนี้เราจะมาวาดรูปกันต่อครับ โดยคำสั่งที่น้องๆ จะเจอในบทนี้คือ
คำสั่ง | ความสามารถ | ตัวอย่าง |
fd ระยะทาง | forward = เดินหน้า | fd 100 = เดินหน้า 100 pixel |
bk ระยะทาง | backward = ถอยหลัง | bk 50 = ถอยหลัง 50 pixel |
rt องศา | right turn = หมุนขวา | rt 90 = หมุนไปทางขวา 90 องศา |
lt องศา | left turn = หมุนซ้าย | lt 45 = หมุนไปทางซ้าย 45 องศา |
cs | clear screen = ล้างหน้าจอ |
หมายเหตุ: Tutorial นี้จะเขียนโปรแกรมภาษา LOGO ผ่านเว็บไซต์นี้ครับ http://www.calormen.com/jslogo/ (ขอบคุณเจ้าของเว็บไซต์มา ณ โอกาสนี้ด้วยครับ)
จากตอนที่แล้วเราได้วาดรูปบันไดกันไปแล้ว แต่ถ้าสังเกตดีๆ จะพบว่า คำสั่ง rt 270 (หมุนขวา 270 องศา) จะได้ผลลัพธ์เหมือนกับ lt 90 (หมุนซ้าย 90 องศา)
![LOGO EP2 Left Turn](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Left-Turn-300x225.png)
หรือในกรณีที่เราต้องการเดินถอยหลัง จะพบว่า คำสั่ง rt 180 fd 100 (กลับหลังหัน แล้วเดินหน้า 100 pixel) จะได้ผลลัพธ์เหมือนกับ bk 100 (เดินถอยหลัง 100 pixel)
![LOGO EP2 Backward](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Backward-300x205.png)
คำสั่งเดินถอยหลัง (bk)
![LOGO EP2 - Forward Backward](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Forward-Backward-300x202.png)
คำสั่งหมุนซ้าย (lt)
![LOGO EP2 - Right Turn Left Turn](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Right-Turn-Left-Turn-300x201.png)
เพื่อความเข้าใจคำสั่งใหม่ เราจะมาวาดรูปกันต่อครับ โดยเริ่มจากรูปบันไดจากตอนที่แล้ว
fd 50 rt 90 fd 50 lt 90
fd 50 rt 90 fd 50 lt 90 fd 50 rt 90 fd 50 lt 90 fd 50 rt 90 fd 50 lt 90 |
โปรแกรมที่ 2-1 (บันได) |
![LOGO EP2 - Program 1](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-1.png)
จากโปรแกรมที่ 2-1 (บันได) เราจะมาอธิบายการวาดรูปนี้แต่ละขั้นตอนอย่างละเอียดกันครับ
- (ครั้งที่ 1) fd 50 = เดินหน้า 50 pixel rt 90 = หมุนขวา 90 องศา
fd 50 = เดินหน้า 50 pixel lt 90 = หมุนซ้าย 90 องศา - (ครั้งที่ 2) fd 50 = เดินหน้า 50 pixel rt 90 = หมุนขวา 90 องศา
fd 50 = เดินหน้า 50 pixel lt 90 = หมุนซ้าย 90 องศา - (ครั้งที่ 3) fd 50 = เดินหน้า 50 pixel rt 90 = หมุนขวา 90 องศา
fd 50 = เดินหน้า 50 pixel lt 90 = หมุนซ้าย 90 องศา - (ครั้งที่ 4) fd 50 = เดินหน้า 50 pixel rt 90 = หมุนขวา 90 องศา
fd 50 = เดินหน้า 50 pixel lt 90 = หมุนซ้าย 90 องศา
![LOGO EP2 - Program 1 Steps](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-1-Steps-1024x576.png)
คำสั่งล้างหน้าจอ (cs)
เมื่อเราวาดรูปเสร็จแล้ว หากต้องการล้างหน้าจอ ให้ใช้คำสั่ง cs (clear screen) ครับ รูปภาพที่เคยวาดจะถูกลบ และเต่าก็จะกลับมาอยู่ที่ตำแหน่งเริ่มต้น (ถ้าต้องการแค่ลบหน้าจอ แต่เต่าอยู่ที่ตำแหน่งเดิม ให้ใช้คำสั่ง clean)
![LOGO EP1 - Clear Screen](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP1-Clear-Screen.png)
รูปภาพต่อไป เราจะมาประยุกต์ใช้คำสั่ง lt (left turn) เพื่อให้การวาดรูปง่ายขึ้น กันครับ
fd 100
rt 90 fd 100 lt 90 fd 50 rt 90 fd 100 rt 90 fd 100 lt 90 fd 100 rt 90 fd 50 rt 90 fd 300 |
โปรแกรมที่ 2-2 |
![LOGO EP2 - Program 2](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-2.png)
จากโปรแกรมที่ 2-2 เราจะมาอธิบายการวาดรูปนี้แต่ละขั้นตอนอย่างละเอียดกันครับ
- fd 100 = เดินหน้า 100 pixel
- rt 90 = หมุนขวา 90 องศา | fd 100 = เดินหน้า 100 pixel
- lt 90 = หมุนซ้าย 90 องศา | fd 50 = เดินหน้า 50 pixel
- rt 90 = หมุนขวา 90 องศา | fd 100 = เดินหน้า 100 pixel
- rt 90 = หมุนขวา 90 องศา | fd 100 = เดินหน้า 100 pixel
- lt 90 = หมุนซ้าย 90 องศา | fd 100 = เดินหน้า 100 pixel
- rt 90 = หมุนขวา 90 องศา | fd 50 = เดินหน้า 50 pixel
- rt 90 = หมุนขวา 90 องศา | fd 300 = เดินหน้า 300 pixel
![LOGO EP2 - Program 2 Steps](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-2-Steps-1024x576.png)
รูปภาพต่อไป เราจะมาประยุกต์ใช้คำสั่ง bk (backward) เพื่อให้การวาดรูปง่ายขึ้น กันครับ
rt 45 fd 100 bk 100
rt 45 fd 100 bk 100 rt 45 fd 100 bk 100 rt 45 fd 100 bk 100 rt 45 fd 100 bk 100 rt 45 fd 100 bk 100 rt 45 fd 100 bk 100 rt 45 fd 100 bk 100 |
โปรแกรมที่ 2-3 |
![LOGO EP2 - Program 3](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-3.png)
จากโปรแกรมที่ 2-3 เราจะมาอธิบายการวาดรูปนี้แต่ละขั้นตอนอย่างละเอียดกันครับ
- (ครั้งที่ 1) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 2) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 3) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 4) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 5) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 6) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 7) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
- (ครั้งที่ 8) rt 45 = หมุนขวา 45 องศา | fd 100 = เดินหน้า 100 pixel | bk 100 = เดินถอยหลัง 100 pixel
![LOGO EP2 - Program 3 Steps](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-3-Steps-1024x576.png)
รูปภาพต่อไป เป็นตัวอย่างโจทย์ที่มีคำตอบมากกว่า 1 วิธี (ซึ่งโจทย์ปัญหาในชีวิตจริงมักจะอยู่ในรูปแบบนี้ ที่มีวิธีแก้ปัญหามากกว่า 1 วิธี) เป็นอย่างไร? เรามาดูกันเลยครับ
วาดรูปสี่เหลี่ยมติดกัน 4 รูป (วิธีที่ 1)
rt 90
fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 |
โปรแกรมที่ 2-4 |
![LOGO EP2 - Program 4](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-4.png)
จากโปรแกรมที่ 2-4 เราจะมาอธิบายการวาดรูปนี้แต่ละขั้นตอนอย่างละเอียดกันครับ
- rt 90 = หมุนขวา 90 องศา
- fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 = วาดรูปสี่เหลี่ยม ขนาด 50 pixel
- fd 100 = เดินหน้า 100 pixel
- fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 = วาดรูปสี่เหลี่ยม ขนาด 50 pixel
- fd 100 = เดินหน้า 100 pixel
- fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 = วาดรูปสี่เหลี่ยม ขนาด 50 pixel
- fd 100 = เดินหน้า 100 pixel
- fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 = วาดรูปสี่เหลี่ยม ขนาด 50 pixel
![LOGO EP2 - Program 4 Steps](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-4-Steps-1024x576.png)
วาดรูปสี่เหลี่ยมติดกัน 4 รูป (วิธีที่ 2)
rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50
rt 90 fd 100 rt 90 fd 50 rt 90 fd 100 rt 90 fd 50 rt 90 fd 150 rt 90 fd 50 rt 90 fd 150 rt 90 fd 50 rt 90 fd 200 rt 90 fd 50 rt 90 fd 200 rt 90 fd 50 |
โปรแกรมที่ 2-5 |
![LOGO EP2 - Program 5](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-5.png)
จากโปรแกรมที่ 2-5 เราจะมาอธิบายการวาดรูปนี้แต่ละขั้นตอนอย่างละเอียดกันครับ
- rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 = วาดรูปสี่เหลี่ยม ขนาด 50×50 pixel
- rt 90 fd 100 rt 90 fd 50 rt 90 fd 100 rt 90 fd 50 = วาดรูปสี่เหลี่ยม ขนาด 100×50 pixel
- rt 90 fd 150 rt 90 fd 50 rt 90 fd 150 rt 90 fd 50 = วาดรูปสี่เหลี่ยม ขนาด 150×50 pixel
- rt 90 fd 200 rt 90 fd 50 rt 90 fd 200 rt 90 fd 50 = วาดรูปสี่เหลี่ยม ขนาด 200×50 pixel
![LOGO EP2 - Program 5 Steps](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Program-5-Steps-1024x576.png)
น่าสนใจ: ถ้าเราสังเกตจากโปรแกรมที่ 2-4 และโปรแกรมที่ 2-5 จะพบว่า ทั้งสองคำสั่งนี้ให้ผลลัพธ์เป็นรูปสี่เหลี่ยมเหมือนกัน
fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 |
rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 rt 90 fd 50 |
มีคำสั่งหลายอย่างเลยครับ ที่ลำดับไม่เหมือนกัน แต่ผลลัพธ์สุดท้ายเหมือนกัน (ก็เช่นเดียวกับโลกใบนี้ แม้จุดมุ่งหมายเดียวกัน แต่ก็ไม่จำเป็นต้องเดินบนเส้นทางเดียวกันก็ได้)
ในตอนต่อไปเราจะมาวาดรูปนี้กันครับ…
![LOGO EP2 - Next EP](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Next-EP.png)
…แล้วเราจะวาดรูปนี้โดยไม่ยกปากกาได้ยังไงกันละ?
มาวาดรูปกันเถอะ!
ก่อนจากกันมีรูปอยากให้น้องๆ ไปลองวาดกันดูครับ (อย่าแอบเปิดเฉลยนะ ลองวาดเองก่อนนะ)
![LOGO EP2 - Quiz 1](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Quiz-1.png)
![LOGO EP2 - Quiz 2](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Quiz-2.png)
![LOGO EP2 - Quiz 3](http://karnlab.com/wp-content/uploads/2018/02/LOGO-EP2-Quiz-3.png)
น้องๆ สามารถติดตามต่อตอนไปได้ที่นี่ครับ //karnlab.com/tag/ภาษาโลโก้
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
เฉลย
fd 100 rt 90 fd 100 rt 90 fd 100 rt 90 fd 100 rt 90
fd 100 rt 90 fd 300 rt 90 fd 100 rt 90 fd 300 rt 90 fd 100 rt 30 fd 100 rt 120 fd 100 lt 60 fd 200 lt 120 fd 100 lt 60 fd 200 |
fd 100 rt 90 fd 100 lt 90
fd 100 rt 90 fd 100 rt 90 fd 100 lt 90 fd 100 rt 90 fd 100 rt 90 fd 100 lt 90 fd 100 rt 90 fd 100 rt 90 fd 100 lt 90 fd 100 rt 90 |
fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90
fd 75 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 bk 150 rt 90 fd 75 lt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 bk 150 rt 90 fd 75 lt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 fd 75 rt 90 |