chapter 5 morphological image processing 54 การประมวลผลภาพ...

สํานักพัฒนาเทคโนโลยีเพื่ออุตสาหกรรม มหาวิทยาลัยเทคโนโลยีพระจอมเกลาพระนครเหนือ

54 Chapter 5 Morphological Image Processing

Morphological Image Processing เปนการประมวลผลภาพโดยการเปล่ียนแปลงลักษณะรูปรางหรือ

โครงสรางของภาพ โดยใชโอเปอรเรชั่นพื้นฐานไดแก การทํา Dilation และ Erosion โดยกระบวนการของ

การทํา Dilation คือการขยายพิกเซลที่สวางโดยมีสัดสวนเทากันทั่วทั้งภาพ (Uniform) และการทํา Erosion

คือการลดขนาดพิกเซลโดยมีสัดสวนเทากันทั่วทั้งภาพดวยเชนกัน นอกจากโอเปอรเรชั่นพื้นฐานดังที่ได

กลาวมาขางตนแลวยังประกอบดวยโอเปอรเรชั่นอื่นๆ ซ่ึงไดแกการทํา Opening และ Closing เปนตน

การประมวลผลภาพในเรื่องของ Morphological จะใชโปรเจ็ค ImageProcessing ซึ่งในบทที่ผานมา

ไดเตรียมความสามารถพื้นฐานตางๆของโปรแกรมแลว ดังนั้นสามารถแกไขหรือเพิ่มโคดโปรแกรมในสวน

ของการทํา Dilation และ Erosion ลงในคลาส CMyAlgorithm และทําการเพิ่มรายละเอียดของเมนู ใหมี

ความสามารถเรียกใชคําสั่งการประมวลผลภาพในสวนของ Morphological โดยมีขั้นตอนดังนี้

ขั้นตอนที่ 1 การเพิ่มฟงกชันลงในคลาส CMyAlgorithm

ภาพที่ 1 การเพิ่มฟงกชันลงในคลาส CMyAlgorithm

การประมวลผลภาพดิจิตอลดวยโปรแกรม

Mr.Nattaphol Jasungnuen Institute of Technological Development for Industry (ITDI)

King Mongkut’s University of Technology North Bangkok

1.1 เปดหนาตาง Class View แสดงรายละเอียดคลาสทั้งหมดของโปรเจ็ค

1.2 เลือกคลาส CMyAlgorithm คลิ๊กขวา เลือกการ Add Function จะปรากฎ

ไดอะล็อกดังภาพที่ 2

1.3 เพิ่มฟงกชันตางๆดังตารางที่ 1 ลงในไดอะล็อกดังภาพที่ 2

ตารางที่1 ฟงกชันตางๆ

Return type: Function name: Access: Parameter

void Dilation public -

void Erosion public -

void ExchangeImg public CMyAlgorithm & img

1.4 การเพิ่มฟงกชันที่มีพาริเตอรเชน ExchangeImg(CMyAlgorithm & img) ให

พิมพชนิดของ Parameter type และชื่อตัวแปร Parameter name ดังภาพที่ 2

1.5 เลือก Finish เมื่อเสร็จสิ้นขั้นตอน



ภาพที่ 2 ไดอะล็อกสําหรับเพิ่มฟงกชัน ภาพที่ 3 แสดงรายละเอียดคลาส

เมื่อทําการเพิ่มฟงกชันเรียบรอยแลว ในสวนของ Tap Class View จะแสดงรายละเอียดของฟงกชัน

ที่เพิ่มเขามาดังภาพที่ 3 ผูเขียนโปรแกรมสามารถใชเมาทคลิ๊กที่ชื่อฟงกชันตางๆใน Class View เพื่อแกไข

หรือเพิ่มโคดโปรแกรมภายในฟงกชันได

ขั้นตอนที่ 2 การเพิ่มรายละเอียดของเมนู (Menu)

ภาพที่ 4 แสดง Resource View ภาพที่ 5 การ Insert New เมนู

การเพิ่มเมนูเปนการสรางสวนติดตอกับผูใชงาน เพื่อใหผูใชงานสามารถเลือกใชเมนูการทํางานได

ตามตองการ การเพิ่มเมนูมีขั้นตอนดังนี้

2.1 เลือก Tap Resource View แสดงรายละเอียดเมนูดังภาพที่ 4

2.2 ดับเบิ้ลคลิ๊กที่ IDR_ImageProcessingTYPE จะปรากฎเมนูดังภาพที่ 5

2.3 คลิ๊กขวาบนเมนูบารเพ่ิมรายละเอียดของเมนูทั้งหมดดังภาพที่ 6

คลิ๊กขวาบนเมนูบาร



ภาพที่ 6 แสดงรายละเอียดของเมนู

ขั้นตอนที่ 3 การเชื่อมโยงเมสเสจใหกับเมนู (Menu)

การกําหนดฟงกชันใหสามารถเรียกใชดวยเมนูตางๆท่ีเราสรางขึ้นนั้นจะเรียกวา แม็พเมสเสจ

ในบทนี้จําเปนตองแม็พฟงกชันจํานวน 4 ฟงกชันดังตารางที่ 2

ตารางที่ 2 กําหนด Member function Menu Message map Member function

Dilation COMMAND OnMorphologicalDilation

Erosion COMMAND OnMorphologicalErosion

Opening COMMAND OnMorphologicalOpening

Closing COMMAND OnMorphologicalClosing

สําหรับการแม็พเมสเสจ มีขั้นตอนดังนี้

คลิ๊กขวาที่เมนูยอยจะปรากฎ pop-up เมนู ใหเลือกรายการ Add Event Handler จะปรากฎ

ไดอะล็อก Add Event Handler Wizard ดังภาพที่ 8

ชอง Messages type เลือกที่เมสเสจ COMMAND

ชอง Class list เลือกคลาส CImageProcessingView

ฟงกชัน Function handler name: ปรกติวิซารดจะตั้งชื่อฟงกชันใหอัตโนมัติ

คลิ๊กปุม Add and Event เพื่อเพิ่มฟงกชัน คลาสวิซารดจะทําการเพิ่มฟงกชันใหอัตโนมัติ

ใหทําการเพิ่มฟงกชันดังตารางที่ 2 ทั้งหมด

รายเอียดเมนูดังนี ้

1. Dilation แสดงการขยายพิกเซล

2. Erosion แสดงการลดขนาดพิกเซล

3. Opening แสดงการเปดพิกเซลของภาพ

4. Closing แสดงการปดพิกเซลของภาพ

ภาพที่ 7 Pop-up รายการ Add Event Handler

ภาพที่ 8 แสดง Event Handler Wizard



เมื่อทําการแม็พเมสเสจใหกับเมนูทั้งหมดแลว ผูใชงานก็จะสามารถเรียกใชฟงกชันตางๆผานทาง

เมนูได ในขั้นตอนตอไปนี้จะเพิ่มโคดโปรแกรมลงในฟงกชันตางๆเพื่อใหทํางานตามที่ตองการ

ขั้นตอนที่ 4 การเพิ่มโคดโปรแกรมลงในคลาส CMyAlgorithm

ในการเพิ่มโคดโปรแกรมลงในฟงกชันตางๆของคลาส CMyAlgorithm ประกอบดวยฟงกชัน

Dilation และ Erosion ดังนี้

การขยายพิกเซล CMyAlgorithm::Dilation(void)

ฟงกชันนี้จะใช Structure Element ท่ีมีขนาด Kernel 3x3 ใชสําหรับกระทําตอพิกเซลทั้งหมดภายใน

ภาพ เริ่มตนดวยการกําหนดคาระดับต่ําสุดใหกับคาแมสีทุกสี ดังนั้นตัวแปร (redM= 0, greenM= 0, blue= 0)

void CMyAlgorithm::Dilation(void) { if (IsIndexed()) return; BYTE se[3][3]={ { 0, 1, 0},

{ 1, 1, 1}, { 0, 1, 0} }; CMyAlgorithm image; VERIFY(image.CreateEx(GetWidth(),GetHeight(), GetBPP(),BI_RGB)); BYTE redM, greenM, blueM; int maxHigh = GetHeight()-1;

int maxWidth = GetWidth()-1 ; BYTE *p ; BYTE *pDes; int center = 1; int nRedVal, nGreenVal, nBlueVal; for (int y =1; y < maxHigh; y++) { for (int x =1; x < maxWidth; x++) { redM = greenM = blueM = 0;

pDes = (BYTE*)image.GetPixelAddress(x,y); for(int j=0;j<3;j++) { for(int i = 0; i <3; i++) { p = (BYTE*)GetPixelAddress(x+i-center,y+j-center); nRedVal = (BYTE)p[2]+se[j][i]; nGreenVal =(BYTE)p[1]+se[j][i]; nBlueVal = (BYTE)p[0]+se[j][i]; if (nRedVal > 255) nRedVal = 255; if (nRedVal < 0) nRedVal = 0; if (nGreenVal > 255) nGreenVal = 255; if (nGreenVal < 0) nGreenVal = 0; if (nBlueVal > 255) nBlueVal = 255; if (nBlueVal < 0) nBlueVal = 0; redM = (BYTE)max(redM,nRedVal); greenM = (BYTE)max(greenM,nGreenVal); blueM = (BYTE)max(blueM,nBlueVal); } } *pDes++ = blueM; *pDes++ = greenM; *pDes = redM; } } ExchangeImg(image); }

สมการ Dilation แสดงดังนี้

, ,max ( , ) ( , )i j i jA H A x i y j H i j

เมื่อ คา A เปนคา Pixel ณ ตําแหนง x,y ใดๆ

คา H เปนคา Structure Element ขนาด i*j

คา ,A R H R เปนจํานวนจริง

Structure Element (Kernel 3x3)



ตอไปจะทําการคํานวณหาคาพิกเซลบริเวณรอบๆพิกเซลนั้น โดยเอาคาของพิกเซลบวกดวยคา Structure

Element แลวเก็บคาที่คํานวณไดลงในตัวแปร nRedVal, nGreenVal, nBlueVal จากนั้นจึงหาคํานวณคา

พิกเซลสูงสุดโดยใชแมโคร max แลวเก็บไวในตัวแปร redM, greenM, blueM เพื่อนําคาพิกเซลที่ไดนี้มาใช

ในการแสดงภาพใหม

การลดพิกเซล CMyAlgorithm::Erosion(void)

ฟงกชันนี้จะใช Structure Element ท่ีมีขนาด Kernel 3x3 ใชสําหรับกระทําตอพิกเซลทั้งหมดภายใน

ภาพ เริ่มตนดวยการกําหนดคาระดับสูงสุดใหกับคาแมสีทุกสี ดังนั้นตัวแปร (redM= 255, greenM= 255,

blue= 255) ตอไปจะทําการคํานวณหาคาพิกเซลบริเวณรอบๆพิกเซลนั้น โดยเอาคาของพิกเซลลบดวยคา

Structure Element แลวเก็บคาที่คํานวณไดลงในตัวแปร nRedVal, nGreenVal, nBlueVal จากนั้นทําการ

void CMyAlgorithm::Erosion(void) { if (IsIndexed()) return; BYTE se[3][3]={ { 0, 1, 0}, { 1, 1, 1}, { 0, 1, 0} }; CMyAlgorithm image; VERIFY(image.CreateEx(GetWidth(),GetHeight(), GetBPP(),BI_RGB)); BYTE redM, greenM, blueM; int maxHigh = GetHeight() -1; int maxWidth = GetWidth() -1 ; BYTE *p ; BYTE *pDes; int center = 1; int nRedVal, nGreenVal, nBlueVal; for (int y =1; y < maxHigh; y++) { for (int x =1; x < maxWidth; x++) { redM =greenM = blueM =255; pDes = (BYTE*)image.GetPixelAddress(x,y); for(int j=0;j<3;j++) { for(int i = 0; i <3; i++) { p = (BYTE*)GetPixelAddress(x+i-center,y+j-center); nRedVal = (BYTE)p[2]-se[j][i]; nGreenVal =(BYTE)p[1]-se[j][i]; nBlueVal = (BYTE)p[0]-se[j][i]; if (nRedVal > 255) nRedVal = 255; if (nRedVal < 0) nRedVal = 0; if (nGreenVal > 255) nGreenVal = 255; if (nGreenVal < 0) nGreenVal = 0; if (nBlueVal > 255) nBlueVal = 255; if (nBlueVal < 0) nBlueVal = 0; redM = (BYTE)min(redM,nRedVal); greenM = (BYTE)min(greenM,nGreenVal); blueM = (BYTE)min(blueM,nBlueVal); } } *pDes++ = blueM; *pDes++ = greenM; *pDes = redM; } } ExchangeImg(image); }

สมการ Erosion แสดงดังนี้

, ,min ( , ) ( , )i j i jA H A x i y j H i j

เมื่อ คา A เปนคา Pixel ณ ตําแหนง x,y ใดๆ

คา H เปนคา Structure Element ขนาด i*j

คา ,A R H R เปนจํานวนจริง

Structure Element (Kernel 3x3)



คํานวณหาคาพิกเซลต่ําสุดโดยใชแมโคร min แลวเก็บไวในตัวแปร redM, greenM, blueM เพื่อนําคาพิกเซล

นี้มาใชในการแสดงผลภาพใหม

ขั้นตอนที่ 5 การเพิ่มโคดโปรแกรมลงในคลาส CImageProcessingView

ในสวนของคลาสวิวทําหนาที่แสดงขอมูลภาพบนจอภาพบนหนาจอคอมพิวเตอร โดยแสดงภาพ

เทากับภาพตนฉบับ ฟงกชันหลักในการแสดงขอมูลภาพจะใชฟงกชัน GetDocument เพื่ออานขอมูลจาก

คลาสด็อกคิวเมนต จากนั้นคลาสวิวก็จะทําการวาดภาพออกทางจอภาพดวยฟงกชัน OnDraw นอกจากนั้น

คลาสวิวจะทําหนาที่สงขอมูลไปยังคลาส CMyAlgorithm เพื่อทําการประมวลผล Dilation, Erosion,

Opening และ Closing โดยมีการเพิ่มขอมูลลงในฟงกชันตางๆที่ไดทําการแม็พเมสเสจในขั้นตอนที่ 3 เพิ่ม

โคดโปรแกรมลงในฟงกชันตางๆดังนี้

เพิ่มโคด CImageProcessingView::OnMorphologicalDilation()ดังนี้

ฟงกชันการทํา Dilation ของภาพ เริ่มดวยการใชฟงกชัน GetDocument เพื่อเก็บคาพอยนเตอรของ

คลาสด็อกคิวเมนต มาเก็บไวในตัวพอยนเตอร *pDoc จะใชตัวแปรนี้ชี้ไปยังฟงกชัน GetImage เพื่ออาน

ขอมูลภาพเขามาเก็บไวใน *pImage จากนั้นทําการตรวจสอบคาของตัวแปรแบบพอยนเตอรตองไมมีคาเปน

ศูนย แสดงวาขณะนี้ตัวแปร *pImage มีขอมูลในหนวยความจํา แลวใชพอยนเตอรชี้ไปยังฟงกชัน Dilation

ในคลาส CMyAlgorithm เพื่อทําการประมวลผลภาพ เมื่อคํานวณคาเสร็จสิ้น ใหทําการเรียกฟงกชัน

UpdateAllViews เพื่อใหวิวแสดงคาปจจุบันออกทางจอภาพ เราจึงมองเห็นภาพที่ผานกระบวนการ Dilation

ในทํานองเดียวกันฟงกชันของการทํา Erosion ก็มีกระบวนการทํางานเหมือนกันทุกประการ ตางกันก็เพียง

การสงคาพอยเตอรใหคลาส CMyAlgorithm เพื่อทําการประมวลผลภาพในฟงกชันตางๆที่ตองการ

ในการทําภาพแบบ Opening ก็เชนเดียวกันสามารถทําไดโดยการเรียกฟงกชันการ Erosion() ตาม

ดวย Dilation() และในการทําภาพแบบ Closing ทําไดโดยการเรียกฟงกชัน Dilation() แลวตามดวย

Erosion() สามารถเพิ่มโคดโปรแกรมไดดังนี้

void CImageProcessingView::OnMorphologicalDilation() { CImageProcessingDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); CMyAlgorithm* pImage = pDoc->GetImage(); if(pImage == NULL) return; pImage->Dilation(); pDoc->UpdateAllViews(NULL); }



เพิ่มโคด CImageProcessingView::OnMorphologicalErosion() ดังนี้

เพิ่มโคด CImageProcessingView::OnMorphologicalOpening() ดังนี ้

เพิ่มโคด CImageProcessingView::OnMorphologicalClosing() ดังนี้

เมื่อทําการแกไขโคดโปรแกรมเสร็จทุกขั้นตอน ใหเลือกบนัทึกทั้งหมด(Save all) จากนั้นทําการ

คอมไฟลโปรแกรมดวยเมนู Build ImageProcessing ถาไมมีขอผิดพลาด ก็จะสามารถรัน(Run) โปรแกรมได

void CImageProcessingView::OnMorphologicalErosion() { CImageProcessingDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); CMyAlgorithm* pImage = pDoc->GetImage(); if(pImage == NULL) return; pImage->Erosion(); pDoc->UpdateAllViews(NULL); }

void CImageProcessingView::OnMorphologicalOpening() { CImageProcessingDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); CMyAlgorithm* pImage = pDoc->GetImage(); if(pImage == NULL) return; pImage->Erosion(); pImage->Dilation(); pDoc->UpdateAllViews(NULL); }

void CImageProcessingView::OnMorphologicalClosing() { CImageProcessingDoc* pDoc = GetDocument(); ASSERT_VALID(pDoc); CMyAlgorithm* pImage = pDoc->GetImage(); if(pImage == NULL) return; pImage->Dilation(); pImage->Erosion(); pDoc->UpdateAllViews(NULL); }



ขั้นตอนที่ 6 ทดสอบผลการทํางานของโปรแกรม

การทํางานของโปรแกรมเริ่มตนดวยการเลือกไฟลภาพบิตแมพที่ตองการเปดเขามาในโปรแกรม

ImageProcessing ในบทนี้ทดสอบดวยภาพบิตแมพ ซึ่งขอมูลในแตละภาพมีคุณสมบัติเหมือนกันทุกประการ

เพื่อที่จะแสดงใหเห็นถึงการเปลี่ยนแปลงของภาพเมื่อผานกระบวนการประมวลผลภาพดวยอัลกอริทึม

Dilation, Erosion, Opening, และ Closing ที่สรางขึ้น มีขั้นตอนการทดสอบดังนี้

เลือกรัน(Run) โปรแกรม จะแสดงหนาตางของโปรแกรม ImageProcessing ใหทําการเปดไฟลขอมูล

ภาพ จะปรากฎไดอะล็อกสําหรับเปดไฟลภาพ เลือกภาพที่ตองการ ดังภาพที่ 9

ภาพที่ 9 หนาตางโปรแกรม Image Processing

ทําการเปดภาพตนฉบับจํานวน 3 ภาพ เลือกเมนู Morphological ใหเลือกทําการ Dilation และ Erosion

จะไดผลการทดลองดังภาพที ่10 และภาพท่ี 11

ภาพที่ 10 ผลการทํา Dilation และ Erosion

การทํา Dilation การทํา Erosion



ภาพที่ 11 ผลการทํา Dilation และ Erosion

ทําการเปดภาพตนฉบับใหมจํานวน 3 ภาพ เลือกเมนู Morphological ใหเลือกทําการ Opening และ

Closing จะไดผลการทดลองดังภาพที ่12

ภาพที่ 12 ภาพการทํา Opening และ Closing



สรุป

การสรางโปรแกรมในบทนี้ทุกทานไดศึกษาถึงกระบวนการประมวลผลภาพเบื้องตนดวยโปรแกรม

Microsoft Visual C++.NET 2003 แสดงถึงรายละเอียดในการสรางอัลกอริทึม ในเรื่อง Morphological

Image Processing ซึ่งจะประกอบดวยการขยายพิกเซลของภาพ (Dilation) การลดขนาดพิกเซล (Erosion)

การเปดพื้นที่วางภายในภาพ (Opening) และการปดพื้นที่วางภายในภาพ (Closing) ซ่ึงจะมีประโยชนมากใน

การปรับปรุงขอมูลภาพที่มีรายละเอียดไมชัดเจนเชน การทําเสนลายนิ้วมือใหชัดเจน กอนนําขอมูล

ลายนิ้วมือบันทึกเพื่อตรวจสอบวาเปนลายนิ้วมือของใคร เปนตน

chapter 5 morphological image processing 54 การประมวลผลภาพ...

Documents