2 หลักการทำงานและการแสดงผลของภาพคอมพิวเตอร์กราฟิก

หลกั การทางานและการแสดงผลของภาพ คอมพวิ เตอรก์ ราฟกิ นางสาวสุจติ รา ทองดี แผนกวชิ าคอมพวิ เตอร์ธุรกจิ หน่วยท่ี 2

ใบความรู้ท่ี 2 รหัสวิชา 2204-2105 ชอื่ วชิ า โปรแกรมกราฟิก ช่ือหนว่ ย หลกั การทางานและการแสดงผลของภาพคอมพิวเตอรก์ ราฟิก เร่ือง หลักการทางานและการแสดงผลของภาพคอมพวิ เตอรก์ ราฟิก จานวนชว่ั โมง 4 ชวั่ โมง ประเภทของภาพกราฟิก ภาพกราฟิกสามารถเเบง่ ได้ออกเป็น 2 ประเภท คอื เวกเตอร์กราฟกิ ส์ (Vector Graphics) เเละ ราสเตอรก์ ราฟิกส์ (Raster Graphics) การเลือกชนิดรูปภาพทเ่ี หมาะสมกับประเภทของภาพกราฟกิ เปน็ สง่ิ สาคัญหนึง่ ท่จี ะทาผลงานดูนา่ สนใจ 1. เวกเตอรก์ ราฟิกส์ (Vector Graphics) ภาพแบบเวกเตอร์ หรือ Object-Oriented Graphics หรือ เรยี กวา่ เปน็ รูปภาพ Resolution- Independent เปน็ ภาพที่มีลักษณะของการสรา้ งจากคอมพวิ เตอรท์ ี่มกี ารสร้างใหแ้ ต่ละสว่ นของภาพ เปน็ อิสระต่อกนั โดยแยกช้นิ สว่ นของภาพทัง้ หมดออกเป็นเส้นตรง รูปทรง หรือ สว่ นโค้ง โดยอ้างอิงตาม ความสัมพนั ธ์ทางคณิตศาสตร์ หรืออาศัยการคานวณทางคณิตศาสตร์ โดยมสี แี ละตาแหน่งของสีท่ี แน่นอน ฉะนนั้ ไมว่ า่ จะมีการเคลื่อนย้าย หรอื ย่อขยายขนาดของภาพ กจ็ ะไมเ่ สียรปู ทรง และความ ละเอียดของภาพจะไม่ลดลง จึงทาใหภ้ าพยังคงชดั เจนเหมือนเดมิ แมข้ นาดของภาพจะมีขนาดใหญข่ น้ึ หรือเลก็ ลงก็ตาม แต่มีข้อเสียทีไ่ มส่ ามารถใชเ้ อฟเฟคในการปรับแตง่ ภาพไดเ้ หมือนกับภาพแบบ Raster การประมวลผลภาพแบบ Vector ได้แก่ภาพท่มี ี นามสกลุ .AI, .DRW, .CDR , .EPS, .PS ซง่ึ โปรแกรมที่ใชใ้ นการวาดภาพก็มมี ากมายหลายโปรแกรม เชน่ Illustrator, CorelDraw และ ภาพ .WMF ซึง่ เป็นภาพคลปิ อารต์ ในโปรแกรม Microsoft Word และภาพ .DWG ในโปรแกรมการออกแบบ AutoCAD เปน็ ตน้

ตัวอยา่ งโปรอกรมที่ใช้สร้างเวกเตอร์กราฟิกส(์ Vector Graphics) รูปภาพตวั อยา่ งเวกเตอร์ กราฟิกส์(Vector Graphics) 2. ราสเตอรก์ ราฟิกส์ (Raster Graphics) การประมวลผลแบบ Raster หรือแบบ บิตแมป(Bitmap) หรือเรียกวา่ เป็นภาพแบบ Resolution Dependent โดยหลกั การทางาน คอื จะเปน็ การประมวลแบบอาศยั การอ่านค่าสใี นแตล่ ะ พกิ เซล ซึ่งมีชอ่ื เรียกอีกอย่างหนงึ่ วา่ Bitmap ซ่งึ จะเกบ็ ค่าของขอ้ มูลเปน็ คา่ 0 และ 1 และในแต่ละ พิกเซลจะมีการเกบ็ ค่าสีที่เจาะจงในแต่ละตาแหน่ง ลกั ษณะสาคัญของภาพประเภทน้ี คือ จะประกอบ ขึ้นดว้ ยจดุ สีต่างๆทม่ี ีจานวนคงท่ีตายตวั ตามการสรา้ งภาพที่มีความละเอยี ดแตกต่างกันไป ภาพแบบ Bitmap นี้ มขี ้อดี คือ เหมาะสาหรับภาพท่ตี อ้ งการระบายสี สร้างสี หรือกาหนดสที ี่ต้องละเอยี ดและ สวยงามได้งา่ ย ข้อจากัดคือ เมื่อมีพกิ เซลจานวนคงที่ นาภาพมาขยายให้ใหญ่ข้ึน ความละเอยี ดก็จะ ลดลง มองเห็นภาพเป็นแบบจุด และถ้าเพมิ่ ความละเอยี ดให้แก่ภาพ จะทาให้ไฟลม์ ีขนาดใหญ่ และ เปลอื งเน้ือทีห่ นว่ ยความจามาก ไฟล์ของรูปภาพทเ่ี กดิ จากการประมวลผลแบบ Raster คือ ไฟล์พวกที่มี นามสกุล เปน็ .BMP .PCX .TIF .JPG .GIF .MSP .PNG .PCT โดยโปรแกรมทีใ่ ชจ้ ัดการกับภาพประเภท น้ี คือ โปรแกรมประเภทจัดการภาพ ตกแต่งภาพ ซงึ่ ปจั จบุ ันน้ีมโี ปรแกรมมากมายใหเ้ ราได้ใช้กนั เช่น Photoscape , Paint , Photoshop , และอีกมากมาย

รปู ภาพตวั อย่างโปรแกรมสร้างภาพแบบราสเตอร์กราฟกิ ส์ รปู ภาพตัวอย่าง ราสเตอร์กราฟิกส์(Raster Graphics) ภาพกราฟกิ 2 มติ แิ บบ Raster และ แบบ Vector มคี วามแตกตา่ งกนั ดังนี้ ภาพกราฟิกแบบ Raster ภาพกราฟิกแบบ Vector 1. ภาพกราฟิกเกิดจากจดุ สเี่ หลีย่ มเลก็ ๆ 1. ภาพเกิดจากการอ้างอิงความสัมพนั ธท์ าง หลากหลายสี (Pixels) มาเรียงตอ่ กนั จน คณติ ศาสตร์หรือการคานวณ โดยองค์ประกอบของ กลายเปน็ รปู ภาพ ภาพมอี สิ ระต่อกนั 2. การขยายภาพกราฟิกให้มีขนาดใหญข่ นึ้ จะ 2. การขยายภาพกราฟิกใหม้ ีขนาดใหญ่ขึ้น ภาพ ทาใหค้ วามละเอียดของภาพลดลง ทาใหม้ องเหน็ ยังคงความละเอียดคมชดั เหมือนเดมิ ภาพเปน็ จดุ สเี่ หลี่ยมเล็ก ๆ 3. การตกแต่งและแกไ้ ขภาพ สามารถทาไดง้ า่ ย 3. เหมาะกับงานออกแบบตา่ ง ๆ เชน่ งาน และสวยงาม เชน่ การ Retouching ภาพคนแก่ สถาปัตย์ ออกแบบโลโก้ เป็นต้น ให้หน่มุ ขึน้ การปรบั สีผิวกายใหข้ าวเนียนขึน้ เปน็ ตน้ 4. การประมวลผลภาพสามารถทาได้รวดเร็ว 4. การประมวลผลภาพจะใช้เวลานาน เน่ืองจากใช้ คาสัง่ ในการทางานมาก

ระบบสี (Color Model) ระบบสี คือระบบจาลองทสี่ รา้ งข้ึนเพอ่ื อธิบายสที ี่มนุษย์สามารถมองเห็น โดยแยกสอี อกเป็น องค์ประกอบพ้นื ฐานตา่ งๆ ดงั นี้ 1. โมเดลอาร์จบี ี (Model RGB) เป็นระบบสที ป่ี ระกอบดว้ ยแม่สี 3 สีคอื แดง (Red), เขยี ว (Green) และ นา้ เงนิ (Blue) ใน สดั ส่วนความเขม้ ข้นท่ีแตกต่างกัน เม่ือนามาผสมกันทาให้เกดิ สีต่างๆ บนจอคอมพวิ เตอร์ได้มากถึง 16.7 ลา้ นสี ซงึ่ ใกลเ้ คียงกบั สีท่ตี าเรามองเหน็ ได้โดยปกติ และจดุ ทส่ี ีท้ังสามสีรวมกนั จะกลายเป็นสขี าว นิยม เรียกการผสมสีแบบนว้ี ่าแบบ “Additive” หรอื การผสมสแี บบบวก ซึ่งเปน็ การผสมสขี นั้ ที่ 1 หรือถา้ นาเอา Red Green Blue มาผสมคร้งั ละ 2 สี ก็จะทาใหเ้ กิดสใี หม่ Model RGB: สตี ่างๆ เกดิ จากการผสมของสหี ลัก 3 สี คือ สแี ดง (Red) สเี ขยี ว (Green) สนี ้าเงนิ (Blue)

2. โมเดลซีเอ็มวายเค (Model CMYK) เปน็ ระบบสีทีใ่ ช้กบั เคร่ืองพิมพ์ท่พี ิมพ์ออกทางกระดาษ ซึง่ ประกอบด้วยสพี น้ื ฐาน คอื สฟี ้า (Cyan), สมี ่วงแดง (Magenta), สีเหลือง (Yellow), และเม่ือนาสีทงั้ 3 สีมาผสมกนั จะเกิดสเี ป็น สดี า (Black) แตจ่ ะไม่ดาสนทิ เนื่องจากหมึกพมิ พม์ ีความไม่บริสทุ ธ์ิ โดยเรียกการผสมสที ั้ง 3 สขี ้างต้นวา่ “Subtractive Color” หรือการผสมสีแบบลบ หลกั การเกิดสขี องระบบนค้ี ือ หมึกสีหนง่ึ จะดูดกลนื สี จากสีหนงึ่ แลว้ สะท้อนกลับออกมาเป็นสตี า่ งๆ เช่น สฟี า้ ดดู กลนื สมี ว่ งแลว้ สะท้อนออกมาเป็นสีน้าเงนิ ซึ่ง จะสังเกตได้ว่าสที ่สี ะท้อนออกมาจะเป็นสีหลักของระบบ RGB การเกิดสีนีใ้ นระบบน้จี งึ ตรงขา้ มกับการ เกดิ สีในระบบ RGB Model CMYK: สีต่างๆ เกดิ จากการผสมของสีหลกั คือ สฟี า้ (C) สีม่วงแดง (M) และสีเหลอื ง (Y) ซง่ึ 3 สนี ีไมส่ ามารถแสดงผลเปน็ สีดา้ (K) ได้ จงึ ตอ้ งเพ่ิมสดี ้าใหส้ ามารถพิมพง์ านสีขาวด้าได้ 3. โมเดลแอลเอบี (Model LAB) ระบบสีแบบ Lab เป็นคา่ สีที่ถูกกาหนดขึน้ โดย CIE (Commission Internationale d’ Eclarirage) เพ่ือใหเ้ ป็นสีมาตรฐานกลางของการวดั สที ุกรปู แบบ ครอบคลุมทุกสใี น RGB และ CMYK

และใช้ได้กบั สที เ่ี กิดจากอปุ กรณท์ ุกอย่างไม่วา่ จะเปน็ จอคอมพวิ เตอร์ เครือ่ งพิมพ์ เคร่ืองสแกนและอนื่ ๆ สว่ นประกอบของโหมดสีนี้ได้แก่ L หรอื Luminance เป็นการกาหนดความสว่างซึ่งมคี า่ ตง้ั แต่ 0 ถึง 100 ถา้ กาหนดที่ 0 จะ กลายเปน็ สีดา แต่ถ้ากาหนดที่ 100 จะกลายเปน็ สขี าว A เป็นคา่ ของสที ่ีไลจ่ ากสเี ขียวไปสีแดง B เปน็ ค่าของสที ี่ไลจ่ ากสนี ้าเงินไปสเี หลือง รปู ภาพประกอบ Model LAB 4. โมเดลเอชเอสบี (Model HSB) เป็นระบบสีพ้ืนฐานในการมองเหน็ สีดว้ ยสายตาของมนษุ ย์ ประกอบด้วยลกั ษณะของสี 3 ลักษณะ คือ - Hue คอื สตี ่างๆ ที่สะท้อนออกมาจากวัตถุเขา้ มายังตาของเรา ทาให้เราสามารถมองเห็น วัตถุเปน็ สีต่างๆ ได้ ซ่ึงแต่ละสีจะแตกตา่ งกันตามความยาวของคลืน่ แสงท่ีมากระทบวตั ถุและสะท้อน กลบั ท่ตี าของเรา Hue ถกู วัดโดยตาแหนง่ การแสดงสีบน Standard Color Wheel ซ่ึงถูกแทนดว้ ยองศา 0 ถงึ 360 องศา แต่โดยทัว่ ๆ ไปแล้วมักจะเรียกการแสดงสีน้นั ๆ เป็นชือ่ ของสเี ลย เชน่ สแี ดง สมี ว่ ง สี เหลือง - Saturation คือ ความสดของสี โดยค่าความสดของสีจะเริ่มท่ี 0 ถงึ 100 ถ้ากาหนด

Saturation ที่ 0 สีจะมคี วามสดนอ้ ย แตถ่ ้ากาหนดที่ 100 สีจะมคี วามสดมาก ถ้าถกู วดั โดยตาแหนง่ บน Standard Color Wheel คา่ Saturation จะเพิ่มขนึ้ จากจุดกง่ึ กลางจนถึงเส้นขอบ โดยคา่ ทเี่ ส้นขอบจะ มีสีท่ีชดั เจนและอม่ิ ตัวทีส่ ดุ - Brightness คือ ระดบั ความสว่างและความมดื ของสี โดยค่าความสวา่ งของสจี ะเริม่ ที่ 0 ถงึ 100 ถ้ากาหนดที่ 0 ความสวา่ งจะน้อยซงึ่ จะเป็นสีดา แต่ถ้ากาหนดที่ 100 สีจะมีความสวา่ งมากทสี่ ดุ ย่งิ มีคา่ Brightness มากจะทาให้สีนั้นสว่างมากขึน้ รปู ภาพเเสดง Model HSB ชนดิ ของไฟลร์ ูปภาพ ภาพดิจิทลั ท่ีใช้ในเคร่ืองคอมพิวเตอร์มหี ลายชนิดทม่ี ีสมบตั ิเเตกตา่ งกัน ทง้ั เรื่องขนาดของภาพ ความละเอยี ด จานวนสที ่ีเเสดงผล เทคนิคการจดั เก็บรายละเอียดหลงั จากกเสรจ็ สนิ้ การตกเเตง่ ภาพเเลว้ ซ่งึ การบนั ทึกรูปเเเบบไฟล์รูปภาพท่เี หมะสม สาหรบั งานเเสดงผลในเวบ็ เพจหรือบนจอคอมพิวเตอรน์ นั้ นยิ มใช้ฟอร์เเมตท่ีมีการบีบอัดเพื่อลดขนาดของข้อมลู ปจั จุบันรปู ภาพกราฟกิ ทีน่ ยิ มนามาใช้เเทรกภาพ ลงในเอกสารมี 3 ประเภท ได้เเก่ ไฟล์ที่มีนามสกลุ เป็น GIF,JPEG เเละ PNG

1. GIF (Graphics Interchange Format) ถกู สรา้ งขึน้ มาโดยบรษิ ัท Compu surve ซงึ่ เป็นบรษิ ัททใี่ ห้บรกิ ารด้านเครือข่ายของสหรัฐ เหมาะกบั การเกบ็ ไฟลร์ ปู ภาพขนาดเล็ก และมีจานวนของสีนอ้ ย มีขนาดไฟลเ์ ล็กเพราะสรา้ งขึ้นมาเพอ่ื ใช้ในระบบ เครอื ข่าย ตวั อยา่ งรูปภาพฟอร์แเมต GIF 2. JPEG(Joint Photographic Experts Group) เปน็ ไฟลท์ ถ่ี ูกสรา้ งข้ึนมาเพื่อบีบอดั ขอ้ มูลภาพ เพ่ือให้มขี นาดกระทดั รัด เพ่ือนาใชง้ านในระบบ อนิ เตอร์เนต นิยมมาใชใ้ นการแสดงผลรปู ภาพบนเครือขา่ ยอินเตอร์เนตเชน่ เดยี วกับ GIF แตม่ ี วัตถุประสงค์ในการใชง้ านแตกตา่ งกัน ตวั อยา่ งรูปภาพฟอร์แมต JPEG 3. PNG (Poetable Network Graphics) ย่อมากจา ( Portable Network Graphics ) ใชใ้ นการบันทกึ ไฟล์ภาพประเภท Vector บนั ทึก ส่วนทีโ่ ปร่งใส และ สามารถเลือกระดับสีไดถ้ ึง 16.7 ล้านสี ตัวอย่างไฟล์ภาพนามสกุล PNG ไม่วา่ จะใช้รปู ภาพแบบใด สิ่งที่ต้องพิจรณาก่อนการนามาใชง้ านคือ เรือ่ งขนาดท่ีมีความเหมาะสม ไมใ่ หญ่จนทาใหบ้ ดบังเหนื้อหา หรอื เลก็ จนไม่สามารถบอกรายละเอยี ดอะไรได้ โดยรูปภาพทใี่ ช้แสดงผล ออนไลนค์ วรมขี นาดไฟล์เฉลย่ี อย่รู ะหวา่ ง 10 KB ถึง 50 KB ถ้าภาพมขี นาดความกวา้ งใหญก่ ว่าเนอ้ื ท่ีที่ต้องการ ควรปรับขนาดของภาพดว้ ยโปรแกรมตกแตง่ ภาพ ใหม้ ขี นาดภาพเท่าทตี่ ้องการ จะไดข้ นาดไฟล์ท่เี ลก็ ลง