ĐỒ án môn học minh họa trực quan bằng giao diện đồ họa các thuật toán tìm thành phần liên thông của đồ thị duyệt đồ thị theo chiều rộng và theo chiều sâu

BỘ GIÁO DỤC VÀ ĐÀO TẠO

TRƯỜNG ĐẠI HỌC SƯ PHẠM TP HỒ CHÍ MINH

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN MÔN HỌC

Minh họa trực quan bằng giao diện đồ họa các thuật toánTìm thành phần liên thông của đồ thị

Duyệt đồ thị theo chiều rộng và theo chiều sâu

Học phần: COMP170101 – Lý thuyết đồ thị và ứng dụng

Thành phố Hồ Chí Minh, ngày 24 tháng 10 năm 2021

TIEU LUAN MOI download : skknchat@gmail.com

BỘ GIÁO DỤC VÀ ĐÀO TẠO

TRƯỜNG ĐẠI HỌC SƯ PHẠM TP HỒ CHÍ MINH

KHOA CÔNG NGHỆ THÔNG TIN

ĐỒ ÁN MÔN HỌC

Minh họa trực quan bằng giao diện đồ họa các thuật toánTìm thành phần liên thông của đồ thị

Duyệt đồ thị theo chiều rộng và theo chiều sâu

Học phần: COMP170101 – Lý thuyết đồ thị và ứng dụng

Nhóm sinh viên thực hiện: I_Lalisa_4

Họ và tên : Nguyễn Phước Thịnh − 46.01.104.176 Họ và tên : Khổng Tín Hào − 46.01.104.048 Họ và tên : Nguyễn Huỳnh Thị Tuyết My − 46.01.104.109

Họ và tên : Dư Thị Như Quỳnh − 46.01.104.151

Giảng viên hướng dẫn: TS.Nguyễn Viết Hưng , ThS Lương Trần Ngọc Triết

MỤC LỤC

MỞ ĐẦU 6

1 Lý do chọn đề tài 6

2 Mục tiêu nghiên cứu 6

a Đối tượng và phạm vi nghiên cứu: 7

b Phương pháp nghiên cứu 7

c Kết cấu của đề tài 7

NỘI DUNG 8

CHƯƠNG 1: TỔNG QUAN VỀ 1 SỐ KIẾN THỨC CỦA LÝ THUYẾT ĐỒ THỊ 8

1.1 Graph (đồ thị) 8

1.2 Ma trận kề 10

1.3 Thuật toán BFS ( Duyệt theo chiều rộng) 10

1.4 Thuật toán DFS ( Duyệt theo chiều sâu ) 11

1.5 Đồ thị liên thông và các thành phần liên thông 11

CHƯƠNG 2: MÔ PHỎNG THUẬT TOÁN BẰNG NGÔN NGỮ LẬP TRÌNH C# 13

2.1 Thuật toán BFS ( Duyệt theo chiều rộng) 13

2.2 Thuật toán DFS ( Duyệt theo chiều sâu ) 14

2.3 Tìm thành phần liên thông 15

CHƯƠNG 3 : MINH HỌA TRỰC QUAN THUẬT TOÁN BẰNG GIAO DIỆN ĐỒ HỌA 16 3.1 Thiết kế giao diện thông tin sản phẩm Thiết kế giao diện trang chủ 16

CODE : sử dụng C# để thiết lập giao diện: 16

3.2 Thiết kế giao diện thông tin sản phẩm 21

CODE: sử dụng C# để thiết lập giao diện Thông Tin Sản Phẩm: 21

3.3 Thiết kế giao diện đồ thị và ma trận 22

CODE: dùng C# để thiết kế giao diện đồ thị và ma trận 22

Giao diện đồ thị và ma trận sẽ bao gồm các chức năng: 23

TỔNG KẾT 55

1 Kết quả sản phẩm 55

2 Tự đánh giá 55

TÀI LIỆU THAM KHẢO 56

TIEU LUAN MOI download : skknchat@gmail.com

THÔNG TIN THÀNH VIÊN NHÓM, PHÂN BỔ CÔNG VIỆC, TỰ ĐÁNH GIÁ

1 Nguyễn Phước Thịnh 46.01.104.176 Code chính, sửa lỗi Hoàn thành tốt

2 Nguyễn Huỳnh Thị 46.01.104.109 Làm video demo, Hoàn thành tốt

giao diện, kiểm thử chương trình, báo

3 Khổng Tín Hào 46.01.104.048 Làm word báo cáo Hoàn thành tốt 4 Dư Thị Như Quỳnh 46.01.104.151 Làm Word báo cáo Hoàn thành tốt

DANH MỤC CÁC HÌNH ẢNH

Hình 6 Giao diện trang chủ 17

Hình 7 Giao diện thông tin sản phẩm 22

Hình 8 Giao diện đồ thị 23

Hình 9 Giao diện ma trận 23

TIEU LUAN MOI download : skknchat@gmail.com

MỞ ĐẦU

1 Lý do chọn đề tài

Lý thuyết đồ thị là một ngành khoa học được phát triển từ lâu nhưng lại có nhiều ứng dụng hiện đại Những tư tưởng cơ bản của lý thuyết đồ thị được đề xuất vào những năm đầu của thế kỷ 18 bởi nhà toán học lỗi lạc người Thụy Sỹ Lenhard Euler Đồ thị được sử dụng để giải các bài toán trong nhiều lĩnh lực khác nhau Chẳng hạn , đồ thị có thể sử để xác định mạch vòng trong vấn đề giải tích mạch điện Đồ thị có trọng số trên các cạnh có thể sử dụng để giải các bài toán như: Tìm đường đi ngắn nhất giữa hai thành phố trong mạnh giao thông Chúng ta cũng có thể sử dụng đồ thị để giải các bài toán về lập lịch , thời khoa biểu… Đặc biệt trong khoảng vài mươi năm trở lại đây, cùng với sự ra đời của máy tính điện tử và sự phát triển nhanh chóng của tin học, lí thuyến đồ thị càng được quan tâm đến nhiều hơn Các thuật toán trên đồ thị đã có nhiều ứng dụng trong nhiều lĩnh vực khác nhau như: Mạng máy tính, Lí thuyết mã, Tối ưu hoá,…

Chính vì thế nhóm em đã lựa chọn đề tài “ Minh họa trực quan bằng giao diện đồ họa các thuật toán tìm thành phần liên thông của đồ thị, duyệt đồ thị theo chiều rộng và theo chiều sâu” để nghiên cứu, tìm hiểu tạo ra một giao diện trực quan giúp cho người dùng dễ tiếp cận và sử dụng , hiểu hơn về các thuật toán tìm đường đi duyệt theo chiều sâu (DFS) hay duyệt theo chiều rộng (BFS) và tìm thành phần liên thông của của đồ thị.

2 Mục tiêu nghiên cứu

Mục tiêu của đồ án này nhằm giúp chúng em có được sự hiểu biết sâu hơn về các thuật toán tìm đường đi duyệt theo chiều sâu (DFS) hay duyệt theo chiều rộng (BFS) và tìm thành phần liên thông của của đồ thị Đồng thời cũng tạo ra một giao diện trực quan để giúp cho người dùng có hướng tiếp cận dễ dàng hơn cũng như có cách nhìn trực quan hơn về các thuật toán này.

a Đối tượng và phạm vi nghiên cứu:

Đối tượng nghiên cứu của đồ án này là : - Thuật toán duyệt theo chiều sâu của đồ thị - Thuật toán duyệt theo chiều rộng của đồ thị - Thuật toán tìm thành phần liên thông của đồ thị

- Thiết kế giao diện trực quan bằng ngôn ngữ lập trình C# Phạm vi nghiên cứu là : - Các khái niệm cơ bản , các thuật toán nằm trong vùng kiến thức của môn lý thuyết đồ thị và ứng dụng.

- Mô tả thuật toán và giao diện trực quan bằng ngôn ngữ lập trình C# b Phương

pháp nghiên cứu

Sử dụng phương pháp phân tích và tổng hợp để thực hiện đề tài nghiên cứu.

c Kết cấu của đề tài

Nội dung bài tiểu luận được xây dựng gồm các phần sau: Mở đầu

Chương 1: Tổng quan về 1 số kiến thức của lý thuyết đồ thị Chương 2: Mô phỏng thuật toán bằng ngôn ngữ lập trình C#

Chương 3: Minh họa trực quan thuật toán bằng giao diện đồ họa Tổng kết

Tài liệu tham khảo

TIEU LUAN MOI download : skknchat@gmail.com

- V là tập hợp khác rỗng mà các phần tử của nó gọi là đỉnh (vertex) của G.

- E là đa tập hợp gồm các cặp không sắp thứ tự của hai đỉnh Mỗi phần tử của E được gọi là một cạnh (edge) của G Ký hiệu uv.

Hình 1 Đồ thị

1.1.2 Đồ thị có hướng

Đồ thị có hướng G =(V,E) gồm:

- V là tập hợp khác rỗng mà các phần tử của nó gọi là đỉnh của G.

- E là đa tập hợp gồm các cặp có sắp thứ tự của hai đỉnh Mỗi phần tử của E được gọi là một cung (cạnh) của G.

- Đồ thị có hướng không chứa các cạnh song song.

Hình 2 Đồ thị có hướng

1.1.3 Đồ thị vô hướng

Đồ thị vô hướng G=(V,E) gồm:

- Tập hợp V ≠ ∅ được gọi là tập các đỉnh của đồ thị.

1.2 Ma trận kề

Định nghĩa:

Giả sử G = (V, E) là một đơn đồ thị có số đỉnh là n Ma trận kề là ma trận vuông A=aij cấp n x n với n là số đỉnh của đồ thị Trong đó: aij ={1 nếu i,j∈ E 0 nếu i,j∉E

Một số tính chất:

Đồ thị vô hướng aij = aji (ma trận đối xứng qua đường chéo chính) Đường chéo chính aii= 0 (do không có khuyên).

1.3 Thuật toán BFS ( Duyệt theo chiều rộng)

Định nghĩa : Trong lý thuyết đồ thị , tìm kiếm theo chiều rộng (BFS) là một thuật toán

tìm kiếm trong đồ thị trong đó việc tìm kiếm chỉ bao gồm 2 thao tác: (a) cho trước một đỉnh của đồ thị; (b) thêm các đỉnh kề với đỉnh vừa cho vào danh sách có thể hướng tới tiếp theo Có thể sử dụng thuật toán tìm kiếm theo chiều rộng cho hai mục đích: tìm kiếm đường đi từ một đỉnh gốc cho trước tới một đỉnh đích, và tìm kiếm đường đi từ đỉnh gốc tới tất cả các đỉnh khác.

Các bước duyệt đồ thị như sau:

Cho G là đồ thị liên thông với tập đỉnh {v1, v2, , vn}

Bước 1 Xuất phát từ 1 đỉnh cho trước nào đó.

Bước 2 Xử lý đỉnh này và đánh dấu để không xử lý lần sau.

Bước 3 Đưa tất cả các đỉnh kề với nó vào danh sách xử lý và lần lượt xử lý các đỉnh kề

với đỉnh đang xét

Bước 4 Quay lại Bước 2 cho đến khi không còn đỉnh trong danh sách.

Cây T thu được là cây khung của đồ thị.

1.4 Thuật toán DFS ( Duyệt theo chiều sâu )

Định nghĩa: Tìm kiếm ưu tiên chiều sâu hay tìm kiếm theo chiều sâu( Depth-first search -

DFS) là một thuật toán duyệt hoặc tìm kiếm trên một cây hoặc một đồ thị Thuật toán khởi đầu tại gốc (hoặc chọn một đỉnh nào đó coi như gốc) và phát triển xa nhất có thể theo mỗi nhánh.

Thông thường, DFS là một dạng tìm kiếm thông tin không đầy đủ mà quá trình tìm kiếm được phát triển tới đỉnh con đầu tiên của nút đang tìm kiếm cho tới khi gặp được đỉnh cần tìm hoặc tới một nút không có con Khi đó giải thuật quay lui về đỉnh vừa mới tìm kiếm ở bước trước Trong dạng không đệ quy, tất cả các đỉnh chờ được phát triển được bổ sung vào một ngăn xếp.

Các bước duyệt đồ thị như sau:

Cho G là đồ thị liên thông với tập đỉnh {v1, v2, , vn}

Bước 1: Xuất phát từ 1 đỉnh cho trước nào đó.

Bước 2: Xử lý đỉnh này và đánh dấu đã duyệt để không xử lý lần sau.

Bước 3: Đưa tất cả các đỉnh kề với nó vào danh sách xử lý và chọn 1 đỉnh để xử lý

tiếp theo.

Bước 4: Quay lại Bước 2 cho đến khi không còn đỉnh trong danh sách.

Cây T thu được là cây khung của đồ thị.

1.5 Đồ thị liên thông và các thành phần liên thông1.5.1 Đồ thị liên thông

Định nghĩa: là đồ thị chỉ có 01 thành phần liên thông, hay nói cách khác giữa 2 đỉnh bất

kỷ trong đồ thị luôn có đường đi từ đỉnh này tới đỉnh kia (trực tiếp hay gián tiếp qua các đỉnh trung gian).

TIEU LUAN MOI download : skknchat@gmail.com

Hình 4 Đồ thị có hướng liên thông

1.5.2 Các thành phần liên thông: Một đồ thị không liên thông sẽ bao gồm nhiều đồ thị

con liên thông, các đồ thị con này được gọi là các thành phần liên thông (connected component).

Đồ thị liên thông khi và chỉ khi có một thành phần liên thông.

Hình 5 Các thành phần liên thông

CHƯƠNG 2: MÔ PHỎNG THUẬT TOÁN BẰNG NGÔN NGỮ LẬP TRÌNH C#

2.1 Thuật toán BFS ( Duyệt theo chiều rộng) public void BFS(int s)

for (int i = 0; i < this.sodinh; i++)

if (this.visited[i] == 0 && this.a[s, i] != 0)

//Khởi tạo giá trị ban đầu, tất cả các địh chư đuợc duyệt và chưa lưu vết for (int i = 0; i < this.sodinh; i++)

return kq; }

2.2 Thuật toán DFS ( Duyệt theo chiều sâu ) public void DFS(int s)

this.visited[s] = 1;

for (int i = 0; i < this.sodinh; i++)

if (this.visited[i] == 0 && this.a[s, i] != 0) {

this.LuuVet[i] = s; //Lưu trước đỉnh i là đỉnh s this.DFS(i);//gọi đệ quy tiến hành xét tiếp

//Khởi tạo giá trị ban đầu, tất cả các địh chư đuợc duyệt và chưa lưu vết for (int i = 0; i < this.sodinh; i++){

/ đặt số miền liên thông ban đầu la 0 this.nTPLT = 0;

/ dùng một vòng for i để tìm đỉnh chưa xét, gọi hàm duyệt cho đỉnh này for (int i = 0; i < this.sodinh; i++)

if (this.visited[i] == 0) {

/ nSoMienLienThong là nhãn sẽ gán cho các đỉnh trong lần duyệt này this.visitedLT(i, this.nTPLT);

CHƯƠNG 3 : MINH HỌA TRỰC QUAN THUẬT TOÁNBẰNG GIAO DIỆN ĐỒ HỌA

3.1 Thiết kế giao diện thông tin sản phẩm Thiết kế giao diện trang chủ

Giao diện trang chủ sẽ bao gồm :

1 Hiển thị thông tin : về khoa, học phần , mã lớp và giảng viên hướng dẫn , logo Trường Đại học Sư Phạm Thành Phố Hồ Chí Minh.

2 Hiển thị mục chức năng và Click chuột chọn chức năng người dùng cần (góc bên trái hình 3.1.1) : + Đồ thị

+ Thông tin về sản phẩm

Hình 6 Giao diện trang chủ

CODE : sử dụng C# để thiết lập giao diện:

using System;

using System.Collections.Generic;

private IconButton currentBtn; private Panel leftBorderBtn; private Form currentChildForm; //constructor

public Form1() {

InitializeComponent();

leftBorderBtn = new Panel(); leftBorderBtn.Size = new Size(7, 69);

panelMenu.Controls.Add(leftBorderBt n); this.Text = string.Empty;

this.ControlBox = false; this.DoubleBuffered = true;

public static Color color6 = Color.FromArgb(24, 161,

private void btnGraph_Click(object sender, EventArgs e){ ActivateButton(sender, RGBcolors.color1); openChildForm(new FormGraph());

panelMenu.BorderStyle = BorderStyle.FixedSingle; }

private void btnMatrix_Click(object sender, EventArgs e){ ActivateButton(sender, RGBcolors.color2); openChildForm(new FormMatrix());

panelMenu.BorderStyle = BorderStyle.FixedSingle; }

[DllImport("user32.DLL", EntryPoint =

"ReleaseCapture")] private extern static void ReleaseCapture(); [DllImport("user32.DLL", EntryPoint = "SendMessage")]

private extern static void

SendMessage(System.IntPtr hWnd, int wMsg, int wParam, int lParam);

private void pnlTittle_MouseDown(object sender, MouseEventArgs e){

SendMessage(this.Handle, 0x112, 0xf012, 0); }

private void logoHCMUE_Click(object sender, EventArgs e){ if(currentChildForm != null){

private void btnZoom_Click(object sender, EventArgs e){ if (WindowState == FormWindowState.Normal)

private void btnhide_Click(object sender, EventArgs e){ WindowState = FormWindowState.Minimized;

}private void label2_Click(object sender, EventArgs e){

3.2 Thiết kế giao diện thông tin sản phẩm

Từ giao diện trang chủ sau khi người dùng Click chuột chọn mục “ Thông tin sản phẩm” một giao diện mới sẽ được hiển thị như hình 3.1.2 :

Hình 7 Giao diện thông tin sản phẩm

CODE: sử dụng C# để thiết lập giao diện Thông Tin Sản Phẩm:

3.3 Thiết kế giao diện đồ thị và ma trận

Từ giao diện trang chủ sau khi người dùng Click chuột chọn mục “ Đồ thị ” một giao diện mới sẽ được hiển thị như hình 3.3.1 :

Hình 8 Giao diện đồ thị

Từ giao diện trang chủ sau khi người dùng Click chuột chọn mục “ Đồ thị ” một giao diện mới sẽ được hiển thị như hình 3.3.2 :

Hình 9 Giao diện ma trận

TIEU LUAN MOI download : skknchat@gmail.com

CODE: dùng C# để thiết kế giao diện đồ thị

rightBorderBtn = new Panel();

rightBorderBtn.Size = new Size(7, 37);

Matrix = new int[100, 100];

for (int i = 0; i < ListarrEgde.Count; i++)

Tạo Ma Trận Vô Hướng

private void TaolaiMaTranVH() {

Matrix = new int[100, 100];

for (int i = 0; i < ListarrEgde.Count; i++)

Nếu chức năng người dùng chọn là : Xét Liên Thông giao diện sẽ hiển thị :

BFS hoặc DFS giao diện sẽ hiển thị:

Thay Đổi Text Button Duyệt Theo Chức Năng

private void comboBox2_SelectedValueChanged(object sender, eventArgs e)

{

Vẽ Đường Đi BFS hoặc DFS Toàn Bộ

private void DanhDauDuongDiTB()

Vẽ Đường Đi BFS hoặc DFS Từng Bước

private void DanhDauDuongDiTB2() {

Tiến hành thêm đỉnh hoặc xóa đỉnh :

Để tiến hành thêm đỉnh click chuột vào ô thêm “ thêm” sau khi click xong trạng thái ô “ thêm” thay đổi thành “ Dừng” có nghĩ là chức năng “ thêm” đã được kích hoạt :

- Sau đó click chuột vào bảng màu xanh để thêm đỉnh Sau khi đã chọn đủ số lượng đỉnh ấn lại vào ô “ Dừng” để dừng trạng thái.

- Nếu muốn xóa đỉnh chỉ cần click chuột vào đỉnh cần xóa và chọn ô “xóa.”

Thay Đổi Trạng Thái Button Thêm Đỉnh

private void btnThemDinh_Click(object sender, EventArgs e)

Trạng Thái Buttton Thêm Đỉnh

private void ActivateButton(object senderBtn)

TIEU LUAN MOI download : skknchat@gmail.com

btn.Location = new Point(e.X, e.Y);

btn.Name = string.Format("{0},{1}", e.X, e.Y); btn.Text = string.Format("{0}", sodinh++); btn.Click += new

TIEU LUAN MOI download : skknchat@gmail.com

TIEU LUAN MOI download : skknchat@gmail.com

TIEU LUAN MOI download : skknchat@gmail.com

Vẽ cạnh cho đồ thị có hướng , đồ thị vô hướng

private void VeDoThi(Class_FS_Graph.Egde NodeG) {

if (cbxLoaiDoThi.Text == "Đồ Thị Vô Hướng" && NodeG.CheckEgde() && check(Dinh1, Dinh2))

Pen BlackPen = new Pen(Color.Black, 2); dc.DrawLine(BlackPen, NodeG.x, NodeG.y,

private void DrawArrowhead(Graphics gr, Pen pen, int x, int y, int z, int t)

float cyx = (cy + t) / 2f; PointF[] points =

new PointF (cxy - dx + p1x, cyx - dy + p1y), new PointF (cxy, cyx),

new PointF (cxy - dx + p2x, cyx - dy + p2y),

MessageBox.Show("Không Còn Cạnh Nào Để Xóa"); Nod = new

Pen BlackPen = new Pen(Color.Black, 2); dc.DrawLine(BlackPen, NodeG.x, NodeG.y,

DrawArrowhead(dc, BlackPen, NodeG.x, NodeG.y,

string Mtran = string.Empty;

for (int i = 0; i < ListarrNod.Count; i++)

string Mtran = string.Empty;

for (int i = 0; i < ListarrNod.Count; i++)