BAB 3 IMPLEMENTASI VISUALISASI INFORMASI PASUT BERBASIS WEB

(1)

22

BAB 3

IMPLEMENTASI VISUALISASI INFORMASI PASUT BERBASIS WEB

Pada bab ini akan diuraikan tahapan yang dilakukan dalam implementasi visualisasi informasi pasut berbasis web, yang terdiri dari:

a. Identifikasi kebutuhan (dibahas pada sub bab 3.1). b. Perancangan basis data (dibahas pada sub bab 3.2). c. Pembangunan basis data (dibahas pada sub bab 3.3).

d. Implementasi antarmuka berbasis web (dibahas pada sub bab 3.4). e. Uji coba aplikasi web (dibahas pada sub bab 3.5).

3.1 Identifikasi Kebutuhan

Identifikasi kebutuhan merupakan dasar dari keberhasilan implementasi SIG (Prahasta, 2002), dimana identifikasi ini bertujuan untuk mengakomodir permintaan akan kebutuhan dari pihak pengguna. Pengguna disini yaitu orang yang memerlukan informasi pasut untuk keperluan navigasi (keselamatan pelayaran) dan kerekayasaan laut. Analisis kebutuhan dalam tugas akhir ini diperoleh dengan cara studi literatur baik buku, artikel maupun internet..

3.1.1 Kebutuhan Informasi

Untuk mendapatkan gambaran mengenai informasi data pasut bisa didapatkan dari berbagai sumber yang ada. Selama ini, untuk kebutuhan navigasi (keselamatan pelayaran) digunakan buku daftar pasut yang dikeluarkan oleh JANHIDROS AL dan BAKOSURTANAL. Secara umum kebutuhan informasi data pasut untuk keperluan navigasi (keselamatan pelayaran) digunakan untuk mengetahui tinggi pasut saat tertentu di atas Chart Datum dan untuk keperluan kerekayasaan digunakan dalam pendefinisian koreksi pasut untuk pembuatan peta batimetrik atau peta laut. Informasi pasut yang dibutuhkan biasanya adalah muka air tertinggi, muka air terendah dan tinggi pasut dalam sehari (lihat sub bab 2.1.4).

(2)

23

3.1.2 Kebutuhan Pengguna

Kebutuhan pengguna yang diperoleh melalui identifikasi kebutuhan adalah sebagai berikut:

a. Menampilkan informasi mengenai pasut seperti definisi, jenis atau karakteristik serta manfaat dari informasi pasut.

b. Menampilkan informasi stasiun pasut seperti lokasi geografis stasiun pasut, denah atau sketsa stasiun pasut, peta rupa bumi stasiun pasut, foto stasiun pasut, dan jenis alat yang digunakan.

c. Menampilkan informasi komponen harmonik pasut.

d. Menampilkan tinggi prediksi pasut harian beserta grafiknya yang dapat digunakan untuk berbagai kegiatan kelautan.

3.2 Perancangan Basis Data

Prahasta (2002) menjelaskan bahwa basis data merupakan komponen terpenting sistem informasi geografis (SIG) dan perancangan basis data yang baik akan menyebabkan basis data dapat melayani kebutuhan-kebutuhan aplikasi-aplikasinya dengan baik.

Pada tugas akhir ini desain basis data dibagi dalam 3 tahapan sebagai berikut [Syafi’i, 2000]:

a. Desain konseptual : Membangun representasi konseptual dari basis data, dimana terdiri atas identifikasi entitas.

b. Desain logis : Menterjemahkan representasi konseptual ke dalam struktur logis dari basis data, dimana terdiri atas desain antar hubungan.

c. Desain fisik : Menampilkan bagaimana struktur logis menjadi implementasi secara fisik dalam bentuk tabel di sistem manajemen basis data.

3.2.1 Desain Konseptual

Tujuan dari desain konseptual adalah mendapatkan pandangan dari sisi pengguna mengenai sistem basis data yang akan dibangun. Tahap ini sangat penting pada proses desain basis data karena pada tahap ini harus dipahami dengan benar aplikasi yang akan dibangun.

(3)

24

Pada tahap ini dilakukan identifikasi terhadap semua kemungkinan entitas-entitas yang terkait dengan permasalahan, entitas-entitas yang terkait dengan permasalahan ini adalah sebagai berikut:

1. Stasiun pasut

2. Alat pengamatan pasut 3. Data pengamatan

4. Komponen harmonik pasut 5. Prediksi pasut

3.2.2 Desain Logis

Tujuan dari desain logis adalah menyediakan fokus bagi perancang basis data. Desain logis membahas kebutuhan-kebutuhan yang diberikan oleh desain konseptual. Model penyimpanan basis data yang digunakan dalam pembangunan web ini adalah model relasional, dimana basis data dipilih kedalam beberapa tabel yang saling berhubungan (relationship). Hal ini penting untuk diketahui pengguna sebab ketika pengguna sedang melakukan transaksi atau updating data maka hal ini akan berpengaruh pada tabel-tabel yang berelasi dengan tabel aktif yang sedang di-update.

Pada tahap ini akan dihasilkan diagram ER (Entity-Relationship) dari basis data yang akan dibangun. Secara ringkas, terdapat lima entitas di dalam pembangunan basis data, dengan penjabaran sebagai berikut:

1. Hubungan entitas stasiun pasut dengan entitas alat • Diagram ER

Enterprise Rules

Setiap stasiun pasut pasti memiliki alat dan setiap alat pasti dimiliki oleh setiap stasiun pasut, sehingga hubungan kedua entitas ini adalah obligatory dengan obligatory.

Setiap stasiun pasut dapat memiliki lebih dari satu alat dan setiap alat hanya terletak pada satu stasiun pasut.

(4)

25

2. Hubungan entitas alat dengan entitas data pengamatan • Diagram ER

• Enterprise Rules

Setiap alat pasti menghasilkan data pengamatan, dan setiap data pengamatan pasti dihasilkan oleh setiap alat, sehingga hubungan kedua entitas ini adalah obligatory dengan obligatory.

Setiap alat dapat menghasilkan lebih dari satu data pengamatan dan setiap data pengamatan hanya dihasilkan oleh satu alat.

3. Hubungan entitas data pengamatan dengan komponen harmonik • Diagram ER

Setiap data pengamatan pasti menghasilkan komponen harmonik, dan setiap komponen harmonik pasti dihasilkan dari data pengamatan, sehingga hubungan kedua entitas ini adalah obligatory dengan obligatory.

Setiap data pengamatan dapat menghasilkan lebih dari satu komponen harmonik dan setiap komponen harmonik dapat dihasilkan dari beberapa data pengamatan.

4. Hubungan entitas komponen harmonik dengan entitas prediksi pasut • Diagram ER

Setiap komponen harmonik pasti menghasilkan prediksi pasut, dan setiap prediksi pasut pasti dihasilkan oleh komponen harmonik, sehingga hubungan kedua entitas ini adalah obligatory dengan obligatory.

(5)

26

Setiap komponen harmonik dapat menghasilkan lebih dari satu prediksi pasut, dan setiap prediksi pasut hanya dihasilkan oleh satu komponen harmonik.

Keterangan :

Setelah masing-masing hubungan antar tabel entitas terdefinisi, maka akan diperoleh diagram ER yang lengkap dengan derajat hubungannya. Visualisasi diagram ER dapat dilihat pada gambar 3.1 berikut :

Gambar 3.1 Diagram ER

3.2.3 Desain Fisik

Desain fisik menentukan implementasi dari desain logis. Tahap ini merupakan spesifikasi yang membantu pembuatan kode program. Pada tahap ini perancang menentukan komponen atau atribut yang diperlukan untuk memenuhi kebutuhan pengguna yang didapatkan dari menganalisa masalah. Desain fisik telah spesifik terhadap DBMS yang digunakan mencakup penamaan file, penentuan tipe data atribut dan

(6)

27

penentuan lebar atau ukuran data atribut tersebut. Desain fisik dapat berubah jika selama pengembangan terdapat informasi baru yang masuk.

Tahap fisik memperlihatkan tabel sekeleton dengan atribut yang sesuai. Dari tahapan hubungan antar entitas yang telah ditentukan, maka dihasilkan tabel skeleton sebagai berikut:

1. Stasiun_Pasut (Id_SP, Nama_SP, Lintang, Bujur, Propinsi, Ibu_Kota, Zona_Waktu, Akuisisi_Data, Titik_Ikat_Pasut, Denah, Peta_Rupa_Bumi, Foto)

2. Alat (Id_Alat, Nama_Alat, Tipe_Alat, Selang_Waktu_Rekam, Transfer_Via_Satelit, Data_ke_Komputer, Id_SP)

3. Data_Pengamatan (Id_Data_Pengamatan, Tahun, Bulan, Tanggal, Jam , Tinggi_Pasut, Id_Alat)

4. Data_Peng_Komp_Har (Id_Data_Pengamatan, Id_Komponen_Harmonik) 5. Komponen_Harmonik (Id_Komponen_Harmonik, Tahun, A_K1, A_O1, A_P1,

A_M2, A_S2, Ampl_N2, A_K2, A_M4, A_MS4, G_K1, G_O1, G_P1, G_M2, G_S2,

G_N2, G_K2, G_M4, G_MS4)

6. Prediksi_Pasut (Id_Prediksi_Pasut, Tahun, Bulan, Tangal, Jam, Prediksi_Pasut,

(7)

28

Bentuk implementasi ke dalam tabel-tabel basis data adalah sebagai berikut:

Tabel 3.1 Struktur data tabel hasil konversi :

(a) tabel stasiun pasut, (b) tabel alat, (c) tabel data pengamatan,

(d) tabel periode pengamatan, (e) tabel komponen harmonik, (f) prediksi pasut

No. Nama Field Tipe Data No. Nama Field Tipe Data

1 Id_SP Varchar (30) 1 Id_Alat Varchar (20)

2 Nama_SP Varchar (50) 2 Nama_Alat Varchar (20)

3 Lintang Double 3 Tipe_Alat Varchar (10)

4 Bujur Double 4 Selang_Wkt_Rekam Varchar (10)

5 Propinsi Varchar (25) 5 Transfer_Via_Satelit Varchar (5)

6 Ibu_Kota Varchar (20) 6 Data_Ke_Komp. Varchar (5)

7 Zona_Waktu Varchar (20) 7 Id_SP Varchar (30)

8 Akuisisi_Data Varchar (5)

9 Titik_Ikat_Pasut Varchar (15) (b)

10 Denah Varchar (50)

11 Peta Rupa Bumi Varchar (50)

12 Foto Varchar (50)

No. Nama Field Tipe Data

(a) 1 Id_Komponen_Harmonik Varchar (20)

2 Tahun Int

No. Nama Field Tipe Data 3 A_K1 Float

1 Id_Data_Pengamatan Varchar (15) 4 A_O1 Float

2 Waktu Date Time 5 A_P1 Float

3 Tinggi_Pasut Float 6 A_M2 Float

4 Id_Alat Varchar (20) 7 A_S2 Float

8 A_N2 Float

(c) 9 A_K2 Float

10 A_M4 Float

No. Nama Field Tipe Data 11 A_MS4 Float

1 Id_Data_Pengamatan Varchar (20) 12 G_K1 Float

2 Id_Komponen_Harmonik Varchar (20) 13 G_O1 Float

14 G_P1 Float

(d) 15 G_M2 Float

16 G_S2 Float

No. Nama Field Tipe Data 17 G_N2 Float

1 Id_Prediksi_Pasut Varchar (20) 18 G_K2 Float

2 Waktu Date Time 19 G_M4 Float

3 Prediksi_Pasut Float 20 G_MS4 Float

4 Id_Komponen_Harmonik Varchar (30)

(e)

(8)

29

3.3 Pembangunan Basis Data

Hasil perancangan basis data yang telah disusun, kemudian dibuat dalam sebuah sistem manajemen basis data dengan menggunakan perangkat lunak MySQL versi 5.0.21. Proses pembangunan basis data bertujuan untuk menghasilkan basis data informasi pasut, secara garis besar proses pembuatan basis data tersebut digambarkan pada gambar 3.2.

Gambar 3.2 Tahap Pembangunan Basis Data

3.3.1 Pengumpulan Data

Data yang digunakan untuk tugas akhir ini terdiri dari: a. Data grafik yang terdiri dari:

1. Peta Indonesia dalam bentuk peta raster diperoleh dari BAKOSURTANAL. 2. Posisi stasiun pasut dalam sistem koordinat geodetik diperoleh dari buku daftar

pasut JANHIDROS-AL.

3. Denah stasiun pasut dalam bentuk peta raster diperoleh dari BAKOSURTANAL. 4. Peta rupa bumi stasiun pasut dalam bentuk peta raster diperoleh dari

BAKOSURTANAL.

(9)

30

b. Data atribut yang terdiri dari:

1. Data informasi dasar mengenai pasut diperoleh dengan cara studi literatur.

2. Data komponen harmonik pasut dan prediksi pasut diperoleh dari buku daftar pasut JANHIDROS AL.

3.3.2 Pemasukan Data

Setelah data dikumpulkan, kemudian data yang diperlukan seperti informasi lokasi geografis stasiun pasut, komponen harmonik pasut dan prediksi pasut yang diperoleh dari Buku Daftar Pasut JANHIDROS AL disimpan dalam bentuk digital menggunakan Microsoft Office Excel berekstensi.CSV.

3.3.3 Implementasi Basis Data Fisik

Implementasi basis data fisik menggunakan MySQL ini meliputi pembuatan basis data (create database), pembuatan tabel (create table), dan pemasukan data (insert data). Basis data yang dibuat bernama ta_mila dan terdiri dari 6 tabel yaitu tabel stasiun_ pasut, alat, data_pengamatan, data_peng_komp_har, komponen_harmonik, dan prediksi_pasut.

MySQL merupakan perangkat lunak berbasis teks, maka semua perintah pada MySQL seperti pembuatan tabel dapat dilakukan dengan cara menuliskan langsung pada

command prompt dengan menggunakan bahasa SQL Data Definition Language (DDL).

Perintah-perintah ini pada dasarnya merupakan structured query language (sql) yang telah disesuaikan dengan MySQL. Daftar DDL dapat dilihat pada lampiran.

Untuk pemasukan data yang telah dibuat di Microsoft Office Excel berekstensi.CSV yaitu dengan cara menuliskan alamat http://localhost/pasut/import.php/ maka secara otomatis data terbentuk pada DBMS MySQL.

3.4 Implementasi Antarmuka Berbasis Web

Proses ini terdiri dari beberapa tahapan dimulai dari lingkungan implementasi, pembuatan desain tampilan sampai dengan tahap akhir implementasi tampilan sistem informasi.

(10)

31

3.4.1 Lingkungan Implementasi

Dalam tugas akhir ini, perangkat lunak yang digunakan untuk membangun aplikasi ini adalah sebagai berikut:

a. Paket XAMPP (Linux, Apache, MySQL, PHP, PEAR) for windows versi 1.5.3a yang terdiri dari:

1. Apache 2.2.2 2. MySQL 5.0.21

3. XAMPP Control Version 2.3 4. PHP 5.1.4 + PHP 4.4.2-pl1 5. phpMyAdmin 2.8.1

b. Dreamweaver MX

c. Mozilla Firefox sebagai web browser .

d. Adobe.Photoshop.CS3 untuk membuat desain tampilan web.

e. CorelDRAW Graphics Suite X3 untuk membuat lokasi stasiun pasut pada peta indonesia.

Sedangkan perangkat keras yang digunakan untuk membangun aplikasi ini adalah sebagai berikut:

a. Processor : Intel Pentium Dual-Core 1.7 GHz b. Hardisk : 100 Gb

c. Monitor : BenQ 13.3" d. RAM : 1 Gb e. VGA Card : 256 Mb

3.4.2 Pembuatan Desain Tampilan

Penyusunan desain tampilan disesuaikan dengan apa yang dibutuhkan pada tahap identifikasi kebutuhan. Desain tampilan untuk purwarupa sistem informasi ini terbagi atas 5 halaman mayor dan 5 halaman minor, yaitu :

1. Desain Halaman Utama

Halaman ini merupakan halaman awal yang merupakan tampilan awal (cover) dari Sistem Informasi Pasut Indonesia.

(11)

32

Gambar 3.3 Desain Halaman Utama

Layer 1 : Judul halaman Layer 2 : Link tiap halaman Layer 3 : Isi halaman utama

Layer 4 : Logo institusi dan nama pembuat situs Layer 5 : Nama institusi ruang lingkup penelitian

2. Desain Halaman Informasi Dasar Mengenai Pasut

Halaman ini merupakan halaman yang berisi tentang informasi dasar mengenai pasut seperti definisi, tipe/jenis serta manfaat dari informasi pasut tersebut.

Layer 1 Layer 2

Layer 3

Layer 3 Layer 4

Layer 5

Gambar 3.4 Desain Halaman Informasi Dasar Mengenai Pasut

Layer 1 : Judul halaman Layer 2 : Link tiap halaman

Layer 3 : Deskripsi mengenai pasut

Layer 4 : Logo institusi dan nama pembuat situs Layer 5 : Nama institusi ruang lingkup penelitian

(12)

33

3. Desain Halaman Peta Stasiun Pasut

Halaman ini merupakan halaman yang berisi tentang Peta Stasiun Pasut Indonesia serta link lokasi stasiun pasut wilayah tertentu.

Layer 1 Layer 2

Layer 5

Layer 3 Layer 4

Gambar 3.5 Desain Halaman Peta Stasiun Pusat

Layer 3 : Peta stasiun pasut beserta link stasiun pasut wilayah tertentu Layer 4 : Fungsi keterdekatan lokasi stasiun pasut

Layer 5 : Nama institusi ruang lingkup penelitian

a. Desain Halaman Informasi Stasiun Pasut

Halaman ini merupakan halaman yang berisi deskripsi stasiun pasut wilayah tertentu. Layer 1 Layer 2 Layer 3 Layer 5 Layer 3 Layer 4

Gambar 3.6 Desain Halaman Informasi Stasiun Pusat

(13)

34

Layer 4 : Link denah stasiun pasut

b. Desain Halaman Denah atau Sketsa Stasiun Pasut

Halaman ini merupakan halaman yang berisi sketsa lokasi stasiun pasut wilayah tertentu. Layer 1 Layer 2 Layer 3 Layer 6 Layer 3 Layer 5 Layer 4

Gambar 3.7 Desain Halaman Denah atau Sketsa Stasiun Pusat

Layer 3 : Sketsa stasiun pasut wilayah tertentu Layer 4 : Link informasi stasiun pasut

Layer 5 : Link peta rupa bumi stasiun pasut Layer 6 : Nama institusi ruang lingkup penelitian

c. Desain Halaman Peta Rupa Bumi Stasiun Pasut

Halaman ini merupakan halaman yang berisi peta rupa bumi stasiun pasut wilayah tertentu. Layer 1 Layer 2 Layer 3 Layer 6 Layer 3 Layer 5 Layer 4

(14)

35

Layer 3 : Peta rupa bumi stasiun pasut wilayah tertentu Layer 4 : Link denah atau sketsa stasiun pasut

Layer 5 : Link foto stasiun pasut

d. Desain Halaman Foto Stasiun Pasut

Halaman ini merupakan halaman yang berisi foto stasiun pasut wilayah tertentu.

Layer 1 Layer 2 Layer 3 Layer 5 Layer 3 Layer 4

Gambar 3.9 Desain Halaman Foto Stasiun Pusat

Layer 3 : Foto stasiun pasut wilayah tertentu Layer 4 : Link peta rupa bumi stasiun pasut Layer 5 : Nama institusi ruang lingkup penelitian

4. Desain Halaman Komponen Harmonik Pasut

Halaman ini merupakan halaman yang berisi komponen harmonik pasut wilayah tertentu.

(15)

36 Layer 1 Layer 2 Layer 4 Layer 3 Layer 5 Layer 7 Layer 6

Gambar 3.10 Desain Halaman Komponen Harmonik Pasut

Layer 3 : Deskripsi tentang komponen harmonik pasut

Layer 4 : Link stasiun pasut wilayah tertentu dan tahun terpilih Layer 5 : Link OK

Layer 6 : Komponen harmonik pasut wilayah terpilih dan jenis pasut Layer 7 : Nama institusi ruang lingkup penelitian

5. Desain Halaman Prediksi Pasut

Halaman ini merupakan halaman yang berisi deskripsi prediksi pasut dan pencarian prediksi pasut harian wilayah tertentu.

Gambar 3.11 Desain Halaman Prediksi Pasut

Layer 3 : Deskripsi tentang prediksi pasut

(16)

37

Layer 5 : Link OK

a. Desain Halaman Pencarian Prediksi Pasut Harian

Halaman ini merupakan halaman yang berisi tinggi prediksi pasut harian wilayah tertentu beserta grafiknya.

Gambar 3.12 Desain Halaman Pencarian Prediksi Pasut Harian

Layer 3 : Stasiun pasut wilayah tertentu, tanggal prediksi pasut, periode data pengamatan, air tertinggi, air terendah dan tinggi air rata-rata Layer 4 : Grafik prediksi pasut harian

Layer 5 : Tinggi prediksi pasut harian perjam Layer 6 : Nama institusi ruang lingkup penelitian

(17)

38

3.4.3 Hasil Implementasi Tampilan

Sub bab hasil implementasi tampilan akan memperlihatkan contoh-contoh hasil implementasi tampilan.

1. Halaman Utama

Gambar 3.13 Halaman Utama 2. Halaman Informasi Dasar Mengenai Pasut

(18)

39

3. Halaman Peta Stasiun Pasut

Gambar 3.15 Halaman Peta Stasiun Pasut a. Halaman Informasi Stasiun Pasut

(19)

40

b. Halaman Denah atau Sketsa Stasiun Pasut

Gambar 3.17 Halaman Denah atau Sketsa Stasiun Pasut c. Halaman Peta Rupa Bumi Stasiun Pasut

(20)

41

d. Halaman Foto Stasiun Pasut

Gambar 3.19 Halaman Foto Stasiun Pasut 4. Halaman Komponen Harmonik Pasut

(21)

42

5. Halaman Prediksi Pasut

Gambar 3.21 Halaman Prediksi Pasut a. Halaman Pencarian Prediksi Pasut Harian

(22)

43

3.5 Uji Coba Aplikasi Web

Proses uji coba purwarupa aplikasi web sistem informasi pasut dilakukan untuk dapat mengetahui kekurangan ataupun kesalahan dari purwarupa yang telah dibuat. Untuk pengujian aplikasi web dilakukan dengan dua macam cara, yaitu:

a. Cara pertama dengan melakukan pengujian secara lokal yakni pengaksesan purwarupa aplikasi pada komputer server dari komputer server itu sendiri, dengan alamat http://localhost/pasut/.

b. Sedangkan cara kedua dengan melakukan pengujian secara non-lokal yakni pengaksesan purwarupa aplikasi pada komputer server dengan menggunakan komputer pengguna yang terpisah dari komputer server dengan alamat http://167.205.98.150/pasut/.

Proses uji coba jalannya program berkaitan dengan stabilitas dari server yang telah digunakan dalam aplikasi sistem ini dan berjalannya perangkat lunak yang digunakan. Parameter berhasilnya pembangunan purwarupa aplikasi web ini dapat dilihat dari berjalannya seluruh purwarupa sistem informasi dan juga stabilitas dari purwarupa sistem informasi.