BAB III ANALISA DAN PERANCANGAN SISTEM. algoritma djikstra, beberapa kebutuhan yang diperlukan meliputi : f. Menyimpan data titik, garis dan gambar

Transkripsi

1 BAB III ANALISA DAN PERANCANGAN SISTEM 3.1 Analisa Kebutuhan Aplikasi Untuk membangun aplikasi lintasan terpendek dengan menggunakan algoritma djikstra, beberapa kebutuhan yang diperlukan meliputi : a. Interaksi mouse pada layar b. Membuat titik dan garis c. Menghapus titik dan garis d. Perancangan membersihkan layar e. Menampilkan gambar pada layar f. Menyimpan data titik, garis dan gambar g. Menampilkan data titik, garis dan gambar h. Perancangan algoritma djikstra i. Perancangan alur lintasan 3.2 Perancangan algoritma sistem Komponen yang dibutuhkan dalam menggambarkan alur proses pada aplikasi ini dengan menggunakan flowchart Perancangan interaksi mouse Alur proses interaksi mouse digambarkan dengan menggunakan flowchart sebagai berikut: 23

2 Mulai Mendeteksi tombol mouse Tombol mouse ditekan Ya Shift=1 Ya BenarMode Hapus=true Tidak X mouse ditekan =x Y mouseditekan=y Mendeteksipergerakan mouse Tombol mouse dilepas Tidak Mouse Bergerak Ya Tombol mouse tidak dilepas ya Ya tidak B Tidak BenarPointer Dibuat objpointer.x2 = x objpointer.y2 = y Ya BenarPointer Dibuat Ya Me.Controls.Remove "pointer" Ya Tidak Memeriksa titik terdekat BenarDitemukan TitikTerdekat BenarDitemukan TitikTerdekat Tidak BenarProsesTarik Gagal=true BenarMode Hapus=true Ya str = grddata3.textmatrix(noe lementitikasal, noelementitiktujuan) A Tidak SimpanData Garis t Ya BuatPointer Selesai Gambar 3.1 Perancangan Interaksi Mouse 24

3 Gambar 3.2. Perancangan Interaksi Mouse (Lanjutan) Gambar 3.3 Perancangan Interaksi Mouse (Lanjutan) 25

4 1. Proses mouse ditekan Fungsi benar mouse ditekan bernilai true. Memeriksa apakah tombol shif ditekan. Jika ya maka benar mode hapus bernilai true. Nilai kordinat x dan y yang didapat ditampung pada parameter X dan Y. 2. Mendeteksi pergerakan mouse a) Mouse tidak bergerak dan dilepas Cek apakah pointer sudah dibuat, jika sudah maka pointer dihapus. Kemudian cek fungsi benar ditemukan titik terdekat. Apabila benar mode hapus bernilai false maka akan memanggil fungsi simpan data garis, jika benar mode hapus bernilai true maka cek nilai pada grid Grddata3.Jika nilai grid tidak kosong maka fungsi hapus garis akan dipanggil. Jika tidak benar proses tarik gagal dan tidak benar mode hapus (bernilai false) maka fungsi titik dipanggil, jika benar mode hapus bernilai true maka fungsi hapus titik dipanggil. b) Mouse bergerak dan ditekan Cek apakah sudah benar pointer dibuat. Jika ya maka object pointer x2= x dan object pointer y2=y, jika tidak cek apakah benar ditemukan titik terdekat. Jika ya fungsi buat pointer dipanggil, jika tidak benarprosestarikgagal = True 26

5 3.2.2 Perancangan bentuk titik dan garis Alur proses interaksi mouse dalam membuat titik dapat digambarkan dengan menggunakan flowchart sebagai berikut: Gambar 3.4 Perancangan Bentuk Titik 1. Deklarasikan parameter yang dibutuhkan untuk membuat titik 2. Buatlah bentuk sebagai titik dengan kelengkapan meliputi bentuk titik, ukuran titik, warna titik dan properti lainnya dan buatlah keterangan yang meliputi nama, ukuran, letak dan properti lainnya. Nama titik dan nilai berupa kordinat disimpan pada grid kordinat. 3. Nilai titik disimpan pada nilai no bentuk dan nilai akan bertambah sesuai dengan penambahan bentuk titik. 27

6 Alur proses interaksi mouse dalam membuat garis dapat digambarkan dengan menggunakan flowchart sebagai berikut: Gambar 3.5 Perancangan Garis 1. Deklarasikan semua parameter yang dibutuhkan untuk membuat garis. 2. Buat kontrol garis berdasarkan nilai x1,y1,x2,y2 yang didapat. 3. Atur kelengkapan garis berupa tebal, warna dan tipe garis. 28

7 3.2.3 Perancangan menghapus titik dan garis Alur proses analisis dan perancangan menghapus titik dan garis dapat digambarkan dengan menggunakan flowchart sebagai berikut: Mulai 1 noelemenminimum = 0 jarakminimum = i = 1 Exit sub i < grddata.rows (((x - CSng(grdData.TextMatrix(noElemenMinimum, 1))) ^ 2 + (y - CSng(grdData.TextMatrix(noElemenMinimum, 2))) ^ 2) ^ 0.5) > 200 jarak = ((x - CSng(grdData.TextMatrix(i, 1))) ^ 2 + (y - CSng(grdData.TextMatrix(i, 2))) ^ 2) ^ 0.5 MsgBox "Tidak ada titik di sekitar tempat tersebut" Tidak jarak < jarakminimum notitik = grddata.textmatrix(noele menminimum, 0) Ya jarakminimum = jarak HapusBarisTitik HapusBentukTitik HapusMatriks noelemenminimum = i i = i + 1 Selesai 1 Gambar 3.6 Perancangan Menghapus Titik dan Garis 29

8 1. Tentukan jarak minimum dengan nilai paling besar. 2. Hitung nilai jarak antara dua titik. Lakukan perbandingan dengan nilai jarak minimum. Jika nilai jarak lebih kecil dari jarak minimum maka nilai jarak minimum diganti dengan nilai jarak tersebut. Catat no elemen minimumnya. 3. Jika no elemen = 0 maka proses berhenti, jika tidak lakukan pencarian nilai x dan y berdasarkan no elemen minimum pada grid nilai kordinat. Hitung jarak titiknya. Jika jarak > 200 maka tidak ada titik pada daerah tersebut. Jika < 200 maka titik didapat. 4. Titik yang akan dihapus didapat dari no titik pada grid kordinat berdasarkan kolom 0 dan baris ke elemen minimum 5. Pada saat no titik didapat fungsi hapusbaristitik, hapusbentuktitik, hapusmatriks dipanggil. Hapusbaristitik berisi perintah menghapus grid kordinat,hapusbarisbentuk berisi perintah menghapus titik dan keterangan pada layar dan hapusmatrik berisi perintah menghapus baris dan kolom pada grid matriks. 30

9 Hapus Baris Titik Gambar 3.7 HapusBaris Titik 1. Lakukan pencarian nilai titik pada grid kordinat yang sama dengan no titik yang akan dihapus. Apabila ditemukan maka hapus baris berdasarkan nilai baris yang didapat. 2. Lakukan pencarian sampai baris terakhir pada grid. 31

10 Hapus Bentuk Titik Gambar 3.8 Hapus Bentuk Titik 1. Deklarasikan semua parameter yang dibutuhkan. 2. Cari nilai titik dan keterangan berdasarkan no titik. 3. Hapus titik dan keterangan. 32

11 Hapus Matriks Gambar 3.9 Hapus Matriks 33

12 1. Deklarasikan semua parameter yang dibutuhkan. 2. Untuk menghapus kolom atur nilai baris dan kolom grid matriks (grddata3) sama dengan 0 3. Selama nilai kolom lebih sedikit dari jumlah kolom keseluruhan ditambah satu, cek apakah nilai pada grddata3 sama dengan nilai no titik. Jika sama maka deklarasikan baris = Selama nilai baris lebih kecil dari jumlah baris keseluruhan maka jarak diisi dengan nilai pada baris dan kolom dari grddata3. Apabila nilai tidak kosong maka cari nilai garisnya kemudian hapus garis tersebut. Jika nilai baris kurang dari jumlah baris keseluruhan dikurangi satu maka nilai baris ditambah satu. 5. Saat nilai baris sudah tidak lebih kecil dari jumlah baris keseluruhan maka ubah posisi kolom yang akan dihapus dengan satu kolom sebelum kolom terakhir., kemudian setelah bertukar posisi kolom tersebut dihapus. 6. Nilai kolom ditambah satu. 7. Untuk menghapus baris atur nilai baris dan kolom grid matriks (grddata3) sama dengan 0 8. Selama nilai baris lebih sedikit dari jumlah baris keseluruhan, cek apakah nilai pada grddata3 sama dengan nilai no titik. 9. Jika jumlah kolom keseluruhan sama dengan 1 maka hapus baris yang pertama. Jika tidak, nilai kolom dideklarasikan satu. 10. Selama nilai kolom lebih kecil dari jumlah kolom keseluruhan maka jarak diisi dengan nilai pada baris dan kolom dari grddata3. Apabila nilai tidak kosong maka cari nilai garisnya kemudian hapus garis tersebut. Jika nilai 34

13 kolom kurang dari jumlah kolom keseluruhan dikurangi satu maka nilai kolom ditambah satu. 11. Saat nilai kolom sudah tidak lebih kecil dari jumlah kolom keseluruhan maka hapus baris 12. Nilai baris ditambah satu Perancangan membersihkan layar Alur proses membersihkan layar dapat digambarkan dengan menggunakan flowchart sebagai berikut: mulai Frame.Picture = LoadPicture("") bersihlayar MsgBox "Layar Sudah Dibersihkan", vbinformation Form2.Label3.Caption = "" Form2.Label4.Caption = "" selesai Gambar 3.10 Perancangan Membersihkan Layar 1. Frame layar dikosongkan. 2. Muncul pesan layar sudah dibersihkan 3. memanggil fungsi bersih layar 35

14 Fungsi bersih layar Gambar 3.11 Fungsi Bersih Layar 1. Deklarasikan semua parameter yang dibutuhkan 2. Selama no baris kurang dari jumlah keseluruhan baris kurang satu dan no kolom kurang dari jumlah keseluruhan kolom kurang satu, nilai setiap dari 36

15 baris dan kolom pada grid matriks (grddata3) ditampung pada variabel str. Jika nilai str tidak kosong, fungsi hapus garis dipanggil. 3. Selama no baris kurang dari jumlah keseluruhan baris kurang satu, nilai dari setiap baris dan kolom 0 pada grid kordinat (grddata) ditampung pada variabel str titik. Hapus titik dan keterangan berdasarkan nilai str titik. 4. Kembalikan nilai keseluruhan baris pada grid kordinat (grddata) dan nilai keseluruhan baris dan kolom pada grid matriks (grddata3 menjadi 1 dan nilai nobentuk dikembalikan menjadi Menampilkan gambar pada layar Alur proses menampilkan gambar pada layar dapat digambarkan dengan menggunakan flowchart sebagai berikut: Gambar 3.12 Menampilkan Gambar Pada Layar 37

16 1. Mengatur bahwa commondialog2 akan membaca file bertipe.jpg dan.bmp 2. Memanggil intruksi buka commondialog2 3. Pada saat commondialog2 titik kosong maka nama file diisi dengan file name commondialog, commondialog2 meload gambar ke layar. 4. Ukuran vertikal dan horizontal scroll disesuaikan dengan perbandingan tinggi dan lebar layar utama dan layar penampung gambar Menyimpan data titik, garis dan gambar Alur proses meyimpan data titik, garis dan gambar dapat digambarkan dengan menggunakan flowchart sebagai berikut: 38

17 Gambar 3.13 Menyimpan Data Titik, Garis dan Gambar 39

18 1. Periksa apakah layar kosong atau ada gambar titik, garis dan peta. Apabila layar kosong maka akan ada pesan belum ada data yang disimpan sebaliknya buka commondialog1. 2. Nama file pada commondialog1 diisi dengan nama file dari commondialog2. Nama file sudah dipenggal tanpa ada tipenya. 3. Filter commondialog2 adalah.txt lalu panggil fungsi simpan. 4. Jika nama file pada commondialog1 tidak kosong maka nama file dibuka untuk menghasilkan nilai output. 5. Print titik. Menampilkan data titik berupa nilai x dan nilai y 6. Print Matriks. Menampilkan data titik yang terhubung dan nilai jarak dari titik tersebut. 7. Jika nama file tidak kosong tampilkan nama filenya. 40

19 3.2.7 Menampilkan titik, garis dan gambar Alur proses menampilkan data titik, garis dan gambar digambarkan dengan menggunakan flowchart sebagai berikut: Gambar 3.14 Menampilkan Titik, Garis dan Gambar 1. layar dikosongkan terlebih dahulu 2. Nama file commondialog1 dikosongkan, filternya.txt lalu perintah open. 3. Apabila nama file kosong maka proses keluar jika tidak buka nama file untuk diinput. 41

20 4. Fungsi bersih layar dipanggil. 5. Selama tidak EOF, apabila data1 tidak sama dengan titik, tidak sama dengan matriks dan tidak sama dengan file maka grid kordinat titik dibuat, baris dan kolom diisi sesuai dengan data1 dan data2, fungsi membuat titik dijalankan berdasarkan data1 dan data2. Jika data1 bertuliskan matriks maka proses selesai. 6. Selain membuat grid kordinat titik, grid matriks juga dibuat dengan jumlah baris dan kolom sesuai dengan banyaknya jumlah titik. 7. Pada grid matriks,no garis diisi nilai 1. Selama tidak EOF, jika data1 tidak bernama file maka baris dan kolom grid matriks diisi dengan nilai data1 dan data2 dan nilai pada kolom tersebut diisi dengan data3 dan no garis. Nilai x1 diisi dengan data pada baris ke data1, kolom ke 1, nilai x2 diisi dengan data pada baris ke data2, kolom ke 1, nilai y1 diisi dengan dengan data pada baris ke data1, kolom ke 2,, nilai y2 diisi dengan dengan data pada baris ke data1, kolom ke 2. Lalu panggil fungsi menggambar garis berdasarkan nilai x1,y1,x2 dan y2. 8. Nilai no garis bertambah 1 9. Jika nilai data1 berisi file maka nama file diisi dengan data2, kemudian gambar dengan nama file tersebut ditampilkan dilayar. 42

21 3.2.8 Perancangan algoritma djikstra Alur proses algoritma djikstra digambarkan dengan menggunakan flowchart sebagai berikut: mulai 1 Dim infinity As Single ReDim dist(form1.grddata3.rows - 1, Form1.grdData3.Cols - 1) ReDim d(form1.grddata3.rows - 1) ReDim prev(form1.grddata3.rows - 1, Form1.grdData3.Rows ) ReDim visited(form1.grddata3.rows - 1) Dim i As Integer, j As Integer, s As String, asal As Integer Dim k As Integer Dim mini As Integer infinity = i = 1 To Form1.grdData3.Cols - 1 i = 1 To Form1.grdData3.Rows - 1 d(i) = infinity prev(i, 0) = 0 visited(i) = 0 j = 1 To Form1.grdData3.Cols - 1 Next i s = Form1.grdData3.TextMatrix(i, j) k = 1 To Form1.grdData3.Cols - 1 s <> "" mini = -1 dist(i, j) = Left(s, InStr(1, s, ",", _ vbtextcompare) - 1) i = 1 To (Form1.grdData3.Cols - 1) Next j mini = -1 Next i visited(i) = 0 (d(i) < d(mini)) And visited(i) = 0 1 mini = i mini = i Next i visited(mini) = 1 Gambar 3.15 Algoritma Djikstra 43

22 i = 1 To Form1.grdData3.Cols - 1 dist(mini, i) <> "" d(mini) + dist(mini, i)) < d(i) d(i) = (dist(mini, i) + d(mini)) tujuan = Form1.grdData3.TextMatrix(i, 0) prev(i, 0) = 1 prev(i, 1) = mini List2.AddItem tujuan sort (dist(mini, i) + d(mini)) = d(i) prev(i, 0) = prev(i, 0) + 1 prev(i, (prev(i, 0))) = mini Next i Next k selesai Gambar 3.16 Algoritma Djikstra (lanjutan) 1. Deklarasikan variabel dist (jarak antar titik), d( panjang lintasan dari sumber ke titik tujuan tertentu), prev (nilai titik sebelumnya yang telah dikunjungi), visited (titik yang sedang dikunjungi). 2. Tampung nilai jarak antar titik pada grid matriks kedalam dist. 3. Isi nilai d(i), prev(i,0) dan visited(i) dengan nilai 0. lakukan sampai i = nilai maksimum kolom grid matriks. 4.Untuk nilai k=1 sampai nilai k=jumlah maksimum kolom grid matriks lakukan 44

23 Nilai mini diisi = -1 Untuk nilai i=1 sampai nilai i =jumlah maksimum kolom grid matriks Jika nilai mini=-1 dan jika nilai i yang dikunjungi (visited (i)) bernilai 0 maka nilai mini = i., jika tidak, jika jarak d(i) < d(mini) dan nilai visited(i)=0 maka nilai mini=i. Nilai visited (mini)=1 Untuk nilai i=1 sampai nilai i =jumlah maksimum kolom grid matriks Jika nilai pada dist (mini,i) tidak sama dengan 0 dan jika nilai (d (mini) + dist (mini,i)) < d(i) maka nilai d(i) = (dist(mini, i) + d(mini)). tujuan = Form1.grdData3.TextMatrix(i, 0) Nilai prev(i, 0) = 1 dan prev(i, 1) = mini. List2.AddItem tujuan sort Jika nilai (d (mini) + dist (mini,i)) = d(i) maka nilai prev(i, 0) = prev(i, 0) + 1 dan prev(i, (prev(i, 0))) = mini 45

24 3.2.9 Perancangan alur lintasan Perancangan alur lintasan dapat digambarkan dengan menggunakan flowchart sebagai berikut: Gambar 3.17 Perancangan Alur Lintasan 1. Selama nilai L kurang dari nilai jumlah keseluruhan baris 1, jika nilai pada list2.text = nilai pada baris ke L kolom 0 pada data grid matriks, maka nilai tujuan = L. 2. Label 3 akan menampilkan informasi jarak (d) berdasarkan nilai tujuan tersebut. 3. Memanggil fungsi alur lintasan (printpath) 46

25 Fungsi alur lintasan (printpath) Gambar 3.18 Alur Lintasan (printpath) 1. Fungsi printpath dipanggil berdasarkan nilai tujuan dan nilai kedalam 0 2. Text1 menampilkan nilai tujuan 3. Nilai L diinisialisasikan 1. Selama nilai L <= nilai prev(), j diinisialisai Selama nilai j<= nilai depth, maka tambahkan garis pada text1. 5. Jika nliai j sudah tidak <= nilai depth fungsi printpath dipanggil ulang. 47

26 3.3 Perancangan Antar Muka Dalam membuat aplikasi lintasan terpendek dengan algoritma djikstra beberapa fitur yang tersedia pada layar utama adalah sebagai berikut : Fitur pada form 1 1. layar 2. Grid kordinat titik 3. Grid matriks (hubungan antar titik) 4. Tombol navigator yang meliputi : Simpan data Ambil data Masukan gambar/peta Bersihkan gambar Cari perhitungan Fitur pada form 2 1. List penampil titik asal dan tujuan 2. List penampil alur lintasan 3. Text penampil alur lintasan 4. label 1, label 2, label 3 dan label 4 5. Tombol kembali 48

27 3.3.1 Fitur form layar Gambar 3.19 Layar layar digunakan untuk menampilkan gambar/peta, titik dan garis yang dibuat dengan mengklik mouse pada area yang kosong. Untuk membuat garis tarik jarak dari titik satu ke titik yang lain. Pada layar dilengkapi dengan scroll vertikal dan scroll horizontal apabila gambar yang dimuat ukurannya melebihi ukuran layar Grid kordinat titik TITIK X Y Gambar 3.20 Grid Kordinat Titik Grid kordinat titik digunakan untuk menampilkan jumlah titik yang dibuat dan data kordinat (x,y) dari titik yang dibuat di layar. 49

28 Grid Matriks (hubungan antar titik) TITIK Gambar 3.21 Grid Matriks Grid matriks digunakan untuk menampilkan jumlah titik yang dibuat pada layar dan menampilkan jarak antar titik yang terhubung satu sama lain dengan garis. Pada grid ini selain menampilkan nilai jarak antar titik, ditampilkan juga jumlah garisnya Tombol navigator Tombol navigator Simpan data Ambil data Masukan gambar Bersihkan gambar Cari perhitungan Gambar 3.22 Tombol Navigator Keterangan Tombol navigator terdiri dari Tombol simpan data digunakan untuk menyimpan gambar peta, titik dan garis dan data kordinat (x,y) serta jarak antar titik 50

29 3.3.2 Fitur form list penampil titik asal dan tujuan TITIK ASAL TITIK TUJUAN Gambar 3.23 List Penampil Titik Asal dan Tujuan List penampil berupa 2 listbox. Listbox1 untuk menampilkan nilai semua titik yang dibuat. Listbox2 untuk menampilkan titik mana saja yang bisa ditempuh / ada hubungan dengan titik pada listbox List penampil alur lintasan Lintasan Gambar 3.24 List Penampil Alur Lintasan List penampil alur lintasan berupa textbox1. Pada textbox1 akan menampilkan urutan titik yang dilewati untuk mencapai jarak terpendek dari titik asal ke titik tujuan. 51

30 Label 1, label 2 dan label 3 Label 1 untuk menampilkan kalimat TITIK ASAL Label 2 untuk menampilkan kalimat TITIK TUJUAN Label 3 untuk menampilkan kalimat LINTASAN Label 4 untuk menampilkan informasi total jaark terpendek dari suatu lintasan. Kalimat berupa Jarak dari titik (titik asal) ke (titik tujuan) adalah (total jarak) TITIK ASAL TITIK TUJUAN LINTASAN Jarak dari titik (titik asal) ke (titik tujuan) adalah (total Gambar 3.25 Label 1, Label 2 dan Label Tombol kembali kembali Gambar 3.26 Tombol Kembali Tombol kembali digunakan untuk kembali dari form2 ke form1 52