perancangan dan implementasi aplikasi pencarian layanan...

24
1 1 Perancangan dan Implementasi Aplikasi Pencarian Layanan Kesehatan Menggunakan HTML 5 Geolocation Artikel Ilmiah Peneliti : Bagas Prakoso Widodo (672011199) Hindriyanto Dwi Purnomo, Ph. D Program Studi Teknik Informatika Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Salatiga Februari 2016

Upload: trannga

Post on 04-May-2019

241 views

Category:

Documents


0 download

TRANSCRIPT

1

1 Perancangan dan Implementasi Aplikasi Pencarian Layanan

Kesehatan Menggunakan HTML 5 Geolocation

Artikel Ilmiah

Peneliti :

Bagas Prakoso Widodo (672011199)

Hindriyanto Dwi Purnomo, Ph. D

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

Februari 2016

2

2 Perancangan dan Implementasi Aplikasi Pencarian Layanan

Kesehatan Menggunakan HTML 5 Geolocation

Artikel Ilmiah

Diajukan kepada

Fakultas Teknologi Informasi

untuk memperoleh Gelar Sarjana Komputer

Peneliti :

Bagas Prakoso Widodo (672011199)

Hindriyanto Dwi Purnomo, Ph. D

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Salatiga

Februari 2016

3

4

5

Tidak

Plagiat

6

7

8

Perancangan dan Implementasi Aplikasi Pencarian Layanan

Kesehatan Menggunakan HTML 5 Geolocation

1)Bagas Prakoso Widodo, 2)Hindriyanto Dwi Purnomo

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

Jl. Diponegoro 52-60, Salatiga 50711, Indonesia

Email : 1)[email protected],2)[email protected]

Abstract Health is a primary need for humans. Salatiga city provides many health services

both individuals and institutions. The number of existing health services, on the one hand

cause problems for a person to obtain health care information in the surrounding precisely at

times when in need of health care on an emergency basis. It has now expanded location-

tracking technology one HTML5 Geolocation, this technology allows tracking of the user's

location via a device used through a browser. In this study combines HTML5 Geolocation

with Haversine Formula to calculate the distance between the user's location with the

location of health services are nearby. This research resulted in an application that can help

conduct a search of appropriate health services to the user when an urgent situation at a

given time

Keywords: HTML5, Salatiga, Haversine, Laravel, Health Facility

Abstrak Kesehatan merupakan kebutuhan primer bagi manusia. Kota Salatiga menyediakan

banyak layanan kesehatan baik perorangan maupun lembaga. Banyaknya layanan kesehatan

yang ada, di satu sisi menimbulkan permasalahan bagi seseorang untuk mendapatkan

informasi layanan kesehatan yang ada di sekitarnya secara tepat pada saat tertentu ketika

membutuhkan penanganan kesehatan secara darurat. Saat ini telah berkembang teknologi

pelacakan lokasi salah satunya HTML5 Geolocation, teknologi ini memungkinkan pelacakan

lokasi pengguna melalui perangkat yang digunakan melalui browser. Pada penelitian ini

memadukan HTML5 Geolocation dengan Haversine Formula untuk menghitung jarak antara

lokasi pengguna dengan lokasi layanan kesehatan yang ada disekitarnya. Penelitian ini

menghasilkan aplikasi yang dapat membantu melakukan pencarian layanan kesehatan yang

tepat untuk pengguna ketika keadaan mendesak pada waktu tertentu.

Kata Kunci: HTML5, Salatiga, Haversine, Laravel, Fasilitas Kesehatan

1) Mahasiswa Fakultas Teknologi Informasi Jurusan Teknik Informatika, Universitas Kristen Satya Wacana

Salatiga 2) Staff Pengajar Fakultas Teknologi Informasi, Universitas Kristen Satya Wacana Salatiga

9

1. Pendahuluan

Kesehatan merupakan kebutuhan primer manusia, di mana dengan kesehatan

manusia dapat menjalankan hidup dengan aktif dan produktif. Akan tetapi, manusia

tidak luput dari sakit, baik ringan, sedang maupun parah. Penyakit seseorang

terkadang hadir secara mendadak atau tiba – tiba. Ketika keadaan mendesak,

dibutuhkan layanan kesehatan untuk membantu mengatasi penyakitnya. Pemilihan

layanan kesehatan yang tepat tentunya dapat menyelematkan nyawa seseorang.

Seperti halnya Kota Salatiga yang merupakan kota kecil yang berada di Propinsi Jawa

Tengah, dengan luas wilayah 56,78 km² terdiri dari 4 kecamatan dan 22 kelurahan.

Layanan kesehatan di Kota Salatiga terdiri dari 23 puskesmas utama dan puskesmas

pembantu, 6 rumah sakit, 17 klinik dan 220 praktek dokter umum, dan 59 dokter

gigi [1]. Jumlah layanan kesehatan Kota Salatiga di satu sisi tentunya menimbulkan

permasalahan bagi seseorang untuk mendapatkan informasi lokasi dan jam praktik

layanan kesehatan yang ada di sekitarnya pada saat tertentu ketika membutuhkan

penanganan kesehatan secara mendesak. Peraturan Menteri Kesehatan No. 71 Tahun

2013 tentang pelayanan kesehatan pada jaminan kesehatan nasional, dimana pasal 14

menyebutkan bahwa pelayanan kesehatan bagi peserta dilaksanakan secara

berjenjang sesuai kebutuhan medis dimulai dari fasilitas kesehatan tingkat pertama.

Fasilitas Kesehatan tingkat pertama yang dimaksud yakni puskesmas atau yang

setara, praktik dokter mandiri, praktik dokter gigi dan klinik. Hal tersebut tentunya

memunculkan masalah baru yaitu memilih layanan kesehatan tingkat pertama yang

tepat terutama bagi penduduk Salatiga maupun yang berasal dari luar Kota Salatiga

ketika membutuhkan penanganan dalam keadaan mendesak.

Perkembangan teknologi informasi yang cukup pesat seharusnya dapat

membantu memecahkan masalah pemilihan layanan kesehatan tersebut.

Perkembangan aplikasi berbasis lokasi menggunakan teknologi HTML5 Geolocation

telah lama dikembangkan sebagai metode untuk melakukan pelacakan lokasi

pengguna[2]. Fery dengan sampel Kota Malang membangun sebuah aplikasi tentang

layanan kesehatan dengan aplikasi yang berbasis Responsive Web Design (RWD) dan

memanfaatkan HTML5 Geolocation untuk pelacakan lokasi pengguna [3].

Selain menentukan lokasi layanan kesehatan yang tepat, jarak tempuh menuju

layanan kesehatan menjadi satu masalah baru. Untuk melakukan pencarian layanan

kesehatan yang ada di sekitar pengguna tentunya diimbangi formula yang dapat

menghitung jarak menuju lokasi layanan kesehatan tersebut. Salah satu formula

tersebut adalah Haversine Formula. Pemanfaatan Haversine Formula pernah

dikembangkan untuk mendeteksi posisi minyak bumi di lepas pantai oleh Mwemezi

[4]. Selain Haversine metode yang digunakan untuk mencari jarak terdekat adalah

Euclidean. Budi [5] menggunakan Euclidean dan konsep penyelesaian jalur

terpendek untuk menemukan lokasi pelayanan gawat darurat berdasarkan rute waktu

tempuh terdekat dengan sampel kota Surakarta.

Dalam penelitian ini dikembangkan aplikasi pencarian layanan kesehatan

berdasarkan jadwal layanan yang ada di sekitar pengguna dengan memadukan

10

HTML5 Geolocation API untuk melacak lokasi pengguna dan Haversine Formula

untuk mengukur jarak antara lokasi pengguna dengan layanan kesehatan yang ada

disekitar pengguna. Batasan masalah pada penelitan ini adalah data layanan kesehatan

yang digunakan yakni data layanan kesehatan yang ada di Kota Salatiga. Pengukuran

jarak antara lokasi pengguna dan layanan kesehatan diukur secara point-to-point

tanpa menghitung simpangan jalan dan ketinggian suatu kontur jalan, penelitian ini

juga tidak membahas keamanan konten web dan keamanan data, penentuan jadwal

hari pelayanan layanan kesehatan mengacu pada hari kerja secara umum tanpa

memperhatikan hari libur nasional atau hari libur khusus.

2. Kajian Pustaka

Permasalahan yang berhubungan dengan pencarian informasi layanan

kesehatan telah di teliti oleh beberapa peneliti. Riegen [6] Melakukan penelitian

pembuatan sistem informasi layanan kesehatan Kota Salatiga berbasis webGIS

menggunakan Google Map API. Sistem ini menampilkan informasi pelayanan

kesehatan di Kota Salatiga dengan menggunakan permrograman PHP, basis data

MySQL serta menggunakan Google Map API untuk menampilkan data layanan

kesehatan [6]. Hasil penelitian ini menunjukkan sistem informasi ini dapat digunakan

untuk memberikan informasi layanan kesehatan di Kota Salatiga terbatas pada rumah

sakit dan puskesmas.

Bambang [7] melakukan penelitian pembuatan aplikasi pencarian tambal ban

terdekat menggunakan Location Based Services (LBS) berbasis android platform.

Metode pencarian jarak antara pengguna dan tambal ban menggunakan Haversine

Formula. Hasil penelitian ini yakni Aplikasi berbasis android platform yang mampu

menunjukkan lokasi tambal ban terdekat dengan pengguna pada android platform

menggunakan Haversine Formula. Fery [3] melakukan penelitian pencarian layanan

kesehatan di Kota Malang menggunakan HTML5 Geolocation untuk mendapatkan

lokasi pengguna. Aplikasi ini menggunakan basis data berupa data dokter, jadwal

praktik dokter dan koordinat lokasi praktik dokter. Hasil dari penelitian ini adalah

aplikasi berbasis web yang responsif dan penerapan HTML5 Geolocation berhasil

melakukan pelacakan lokasi pengguna dengan keakuratan toleransi 100 meter dari

lokasi pengguna dan pengimplementasian Responsive Web Design ( RWD) terbukti

aplikasi mampu berjalan dan menyesuaikan tampilan pada perangkat yang berbeda-

beda.

Pelayanan kesehatan adalah sebuah konsep yang digunakan dalam memberikan

layanan kesehatan kepada masyarakat. Definisi pelayanan kesehatan menurut Prof.

Dr. Soekidjo Notoatmojo adalah sebuah sub sistem pelayanan kesehatan yang tujuan

utamanya adalah pelayanan preventif (pencegahan) dan promotif (peningkatan

kesehatan) dengan sasaran masyarakat. Jenis pelayanan kesehatan secara umum dapat

dibedakan atas dua, yaitu pelayanan kedokteran dan pelayanan kesehatan masyarakat.

Pelayanan kedokteran adalah pelayanan kesehatan yang termasuk dalam kelompok

pelayanan kedokteran (medical services) ditandai dengan cara pengorganisasian yang

11

dapat bersifat sendiri (solo practice) atau secara bersama-sama dalam satu organisasi.

Tujuan utamanya untuk menyembuhkan penyakit dan memulihkan kesehatan, serta

sasarannya terutama untuk perseorangan dan keluarga. Sedangkan pelayanan

kesehatan masyarakat adalah pelayanan kesehatan yang termasuk dalam kelompok

kesehatan masyarakat (public health service) ditandai dengan cara pengorganisasian

yang umumnya secara bersama-sama dalam suatu organisasi. Tujuan utamanya untuk

memelihara dan meningkatkan kesehatan serta mencegah penyakit, serta sasarannya

untuk kelompok dan masyarakat[6].

Laravel merupakan framework yang dikembangkan oleh Taylor Otwell.

Laravel adalah sebuah MVC web development framework PHP yang didesain untuk

meningkatkan kualitas perangkat lunak dengan mengurangi biaya pengembangan dan

perbaikan serta meningkatkan produktifitas pekerjaan dengan sintak yang bersih dan

fungsional set yang dapat mengurangi banyak waktu untuk implementasi. Laravel

juga memberikan keterbaruan alat untuk berinteraksi dengan database disebut dengan

migration. Dengan migration, pengembang dapat dengan mudah untuk melakukan

modifikasi sebuah database pada sebuah platform secara independen karena

implementasi skema database direpresentasikan dalam sebuah class. Migration dapat

berjalan pada beberapa basis data yang telah didukung Laravel (MySQL, PostgreSQL,

MSSQL, dan SQLITE) dan untuk implementasi Active Record pada Laravel disebut

Eloquent yang menggunakan standard modern OOP. Laravel juga memberikan

sebuah Command Line Interface disebut dengan artisan dengan artisan, pengembang

dapat berinteraksi dengan aplikasi untuk sebuah aksi seperti migrations, testing, atau

membuat controller dan model. Selain itu, laravel juga memiliki Blade template

engine yang memberikan estetika dan kebersihan kode pada view secara parsial[8].

HTML5 adalah revisi kelima dari HTML (yang pertama kali diciptakan pada tahun

1990 dan versi keempatnya, HTML4, pada tahun 1997) dan hingga bulan Juni 2011

masih dalam pengembangan. Tujuan utama pengembangan HTML5 adalah untuk

memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah

dibaca oleh manusia dan juga mudah dimengerti oleh mesin[9].

HTML5 Geolocation API Merupakan salah satu fitur baru HTML5 yang

memiliki arsitektur layanan berbasis lokasi. Dengan populernya aplikasi layanan

berbasis lokasi, banyak pengembang yang tidak familiar dengan layanan ini karena

sulit dan membingungkan[2]. Untuk mengatasi permasalahan tersebut W3C (World

Wide Web Consortium) memperkenalkan HTML5 Geolocation. Kemudahan

memahami Bahasa pemrograman HTML5 membuat HTML5 Geolocation cepat

populer dan banyak aplikasi berbasis lokasi dibangun menggunakan HTML5

geolocation karena lebih mudah digunakan untuk melakukan pelacakan lokasi,

pengguna hanya melakukan permintaan posisi melalui browser. Jika pengguna

mengijinkan permintaan tersebut browser mengakses lokasi pengguna kemudian

browser akan memberikan respon seperti koordinat lokasi lintang dan bujur pada

pengguna[10].

Gambar 1 menjelaskan cara kerja HTML5 Geolocation API. Pertama, pengguna

membuka aplikasi melalui browser. Kemudian, aplikasi melakukan permintaan

12

koordinat dari browser menggunakan fungsi geolocation. Sebelumnya, browser

meminta persetujuan pengguna untuk melakukan permintaan yang dilakukan

pengguna tersebut. Jika pengguna mengijinkan permintaan tersebut, maka browser

kemudian memberikan informasi koordinat pengguna dari perangkat yang sedang

digunakan. Seperti, IP Address atau koordinat GPS.[10].

Gambar 1. Arsitektur HTML5 Geolocation dan privasi perangkat[10]

Untuk melakukan pencarian layanan kesehatan di sekitar pengguna, dibutuhkan

metode untuk penghitungan jarak, pada penelitian kali ini metode yang digunakan

adalah Haversine. Haversine adalah suatu posisi di bumi yang direpresentasikan

dengan posisi garis latitude(lintang) dan longitude(bujur) untuk memperkirakan jarak

antara dua titik di bumi berdasarkan letak garis lintang dan bujur bisa dilakukan

dengan beberapa persamaan yang digunakan dengan asumsi bentuk bumi yang bulat

(spherical earth) dengan menghilangkan faktor bahwa bumi itu sedikit elips

(elipsodial factor). Untuk metode ini, kemungkinan kesalahan hanya mencapai

0,5%[11]. Rumus 1 merupakan persamaan menghitung jarak Haversine [12] :

…(1)

Formulasi ini menggunakan persamaan Haversine sebagai dasar. Persamaan ini

dapat digunakan untuk menghitung jarak lingkaran yang jauh antara dua titik[7].

Selain menggunakan Haversine untuk melakukan perhitungan jarak dapat

menggunakan Euclidean. Euclidean distance adalah perhitungan jarak dari 2 buah

titik dalam Euclidean space. Untuk mempelajari hubungan antara sudut dan jarak.

Euclidean ini berkaitan dengan Teorema Phytagoras dan biasanya diterapkan pada 1,

2 dan 3 dimensi. Tapi juga sederhana jika diterapkan pada dimensi yang lebih tinggi.

Rumus (2) merupakan rumus menghitung Euclidean[13]

…(2)

13

Hasil perhitungan jarak menggunakan rumus (2) masih dalam satuan decimal

degree. sehingga untuk menyesuaikannya perlu dikalikan dengan 111,319 km (1

derajat bumi = 69 mil ~= 111,319 km) [14]

3. Metode Penelitian dan Perancangan Aplikasi

Penelitian yang dilakukan dilakukan melalui tahapan penelitian yang terbagi

dalam 5 tahapan, yaitu: 1) Analisis kebutuhan dan pengumpulan data, 2) Perancangan

sistem, 3) Perancangan aplikasi/program, 4) Implementasi dan pengujian sistem, serta

analisis hasil pengujian, 5) Penulisan laporan hasil penelitian [15].

Tahap pertama adalah analisis kebutuhan dan pengumpulan data. Analisis

kebutuhan dilakukan melalui observasi dan wawancara kepada penduduk yang

berasal dari Kota Salatiga maupun dari luar Kota Salatiga mengenai cara

mendapatkan informasi layanan kesehatan di Kota Salatiga. Hasil observasi yang di

dapat adalah bila penduduk mendapatkan musibah sakit atau hendak berobat baik itu

ringan ataupun sedang, penduduk terutama yang berasal dari luar Kota Salatiga

kesulitan mendapatkan informasi layanan kesehatan terutama layanan kesehatan

tingkat pertama yang ada disekitarnya. Selain itu bila penduduk hendak berobat ke

dokter praktik mandiri terkadang dokter tersebut tidak praktik ketika penduduk

membutuhkan pengobatan. Untuk tahapan pengumpulan data layanan kesehatan

didapatkan dari Dinas Kesehatan Kota Salatiga dan melakukan penandaan langsung

ke lokasi layanan kesehatan di Kota Salatiga menggunaan GPS sedangkan untuk

jadwal layanan kesehatan dan jadwal dokter didapat melalui website resmi layanan

kesehatan tersebut ataupun pencatatan langsung ke lokasi layanan kesehatan.

Gambar 2. Tahapan Penelitian [15]

Tahap kedua adalah perancangan sistem berdasarkan hasil analisis kebutuhan

menggunakan UML (Unified Modelling Language) yang terdiri dari use case

diagram, activity diagram dan class diagram. Tambahan perancangan yang lain yaitu

perancangan database meliputi tabel-tabel yang digunakan dalam menyimpan data

serta penentuan hubungan relasinya dan perancangan antarmuka aplikasi yang akan

dibuat.

Analisis Kebutuhan dan Pengumpulan Data

Perancangan Sistem Meliputi Perancangan Proses (UML), Perancangan

Arsitektur, Perancangan Database, Perancangan Antarmuka

Perancangan Aplikasi/Program

Implementasi dan Pengujian Sistem, serta Analisis Hasil Pengujian

Penulisan Laporan Hasil Penelitian

14

Tahap ketiga adalah perancangan aplikasi/program, yaitu merancang aplikasi

sesuai dengan kebutuhan sistem berdasarkan perancangan yang sudah dilakukan.

Bahasa pemrograman yang dipakai adalah PHP dengan Laravel Framework,

Bootstrap dan Materialize framework sebagai kerangka tampilan dan MySQL sebagai

basis data.

Tahap keempat adalah implementasi dan pengujian sistem serta analisis hasil

pengujian, yaitu mengimplementasikan aplikasi yang sudah dirancang ke hosting agar

dapat diakses secara online, kemudian dilakukan pengujian. Analisis hasil pengujian

dilakukan untuk mengetahui apakah aplikasi telah sesuai dengan yang diharapkan.

Tahap kelima adalah penulisan laporan hasil penelitian. Tahap ini dilakukan

dokumentasi proses dari tahap awal sampai tahap akhir dalam bentuk tulisan. Adapun

metode pengembangan sistem yang digunakan yakni metode waterfall yang

ditunjukkan pada gambar 3.

Tahapan dalam pengembangan sistem dengan metode waterfall model yakni

analisis kebutuhan, desain sistem, pengkodean dan testing. Tahapan pertama yakni

analisis. Pada tahap ini dilakukan identifikasi kebutuhan data yang dibutuhkan sistem

yakni data spasial. Data tersebut diperoleh melalui tahap pengumpulan data dari

tahapan penelitian yang dilakukan.

Tahapan kedua setelah analisis yakni desain aplikasi. Desain aplikasi pada

penelitian ini menggunakan UML yang terdiri dari use case diagram, activity

diagram dan class diagram.

Gambar 3 Waterfall Model [16]

Use case diagram berguna untuk mendeskripsikan tindakan sistem dari sudut

pandang pengguna, sebagai deskripsi fungsional dari sebuah sistem dan proses

utamanya, serta menjelaskan siapa saja yang terlibat sebagai aktor dalam

menggunakan sistem berikut interaksinya.

Use case pada Gambar 4 menunjukkan bahwa Aplikasi Pencarian Layanan

Kesehatan memiliki dua pengguna yang memiliki akses yang berbeda – beda, yaitu

Tamu dan Administrator. Pengguna tamu hanya memiliki akses melihat informasi

layanan kesehatan yang ada disekitarnya dan mendapatkan rute menuju layanan

kesehatan terdekat yang buka. Administrator memiliki akses untuk mengelola

layanan kesehatan, jam layanan kesehatan serta dokter dan jadwal dokter yang

praktik pada layanan kesehatan.

15

uc Use Case Mo...

ApplHealth

administrator

tamu

Tampilkan layanan

kesehatan terdekta

tambahkan jadwal

praktek dokter

tambah jadwal

praktek layanan

kesehatan

Jadwal layanan

kesehatan

ubah jadwal praktek

layanan kesehatan

hapus jadwal praktek

layanan kesehatan

ihat jadwal praktek

layanan kesehatan

jadwal praktek

dokter

ubah jadwal praktek

dokter

lihat jadwal praktek

dokter

hapus jadwal praktek

dokter

Tampilkan rute

«extend»

«include»

«extend»

«extend»«extend»

«include»

«extend»

«extend»

«extend»

Gambar 4. Use Case Diagram Aplikasi Pencarian Layanan Kesehatan

Gambar 5 merupakan activity diagram untuk pengguna biasa yang mengakses

aplikasi, untuk melakukan pencarian layanan kesehatan di sekitar pengguna.

Pengguna, harus memasukkan lokasi posisinya terlebih dahulu baik secara manual

atau menggunakan geolocation apabila pengguna tidak mengetahui lokasinya saat ini.

Setelah sistem mendapatkan lokasi pengguna, sistem melakukan pencarian lokasi

layanan kesehatan yang ada disekitar pengguna yang masih buka atau praktek pada

saat pengguna mengakses aplikasi. Apabila pengguna telah menemukan lokasi

layanan kesehatan disekitarnya yang dibutuhkan, aplikasi juga dapat memberikan rute

ke tujuan layanan kesehatan apabila dibutuhkan pengguna.

Gambar 5. Activity diagram pencarian layanan kesehatan terdekat

Class diagram menggambarkan struktur objek, deskripsi objek, class package,

serta relasinya satu sama lain. Class diagram digambarkan dalam beberapa kelas

serta paket yang ada dalam sistem. Gambar 6 merupakan class diagram dari aplikasi

pencarian layanan kesehatan. Class adalah sebuah spesifikasi yang jika diinstansiasi

akan menghasilkan sebuah objek dan merupakan inti dari pengembangan dan desain

16

berorientasi objek Class menggambarkan keadaan (atribut/properti) suatu sistem,

sekaligus menawarkan layanan untuk memanipulasikeadaan tersebut (metoda/fungsi).

Class diagram menggambarkan struktur dan deskripsi class, package dan objek

beserta hubungan satu sama lain seperti containment, pewarisan, asosiasi, dan lain-

lain. Class diagram terdiri dari model, view dan controller. Model adalah penghubung

antara fungsi dengan database. View adalah tampilan / user interface dari aplikasi.

Controller adalah penggerak yang berfungsi menerima perintah dari view lalu

meneruskan ke model. class Class Mo...

Faskes

- id_faskes: int

- nama_faskes: string

- id_tipe: int

- alamat: string

- no_telpon: int

- foto: string

- bpjs: int

- id_user: int

- latitude: float

- longitude: float

+ getFaskes() : array

+ deleteFaskes(int) : boolean

+ getFaskes(int) : array

+ addFaskes(array) : void

+ editFaskes(array) : void

Tipe

- id_tipe: int

- deskripsi: string

+ getTipe() : array

+ deleteTipe(int) : array

+ getTipe(int) : array

+ addTipe(array) : void

+ editTipe(array) : void

Dokter

- id_dokter: int

- id_faskes: int

- nama_dokter: string

- alamat: string

+ getDokter() : array

+ deleteDokter(int) : boolean

+ getDokter(int) : array

+ addDokter(array) : void

+ editDokter(array) : void

FaskesOpen

- id_faskes: int

- hari: int

- jam_buka: TIME

- jam_tutup: TIME

- jam_mulai_istirahat: TIME

- jam_selesai_istirahat: TIME

+ addJamKerja(array) : void

+ ubahJamKerja(array) : void

+ getJamKerja(int) : array

+ hapusJamKerja(int) : array

FaskesDokter

- hari: int

- jam_buka: TIME

- jam_tutup: TIME

- jam_mulai_istirahat: TIME

- jam_selesai_istirahat: TIME

- id_dokter: int

- id_faskes: int

+ addJamPraktek(array) : void

+ editJamPraktek(array) : void

+ deleteJamPraktek(int) : boolean

+ getJamPraktek(int) : array

Gambar 6. Class DiagramAplikasi

Setelah selesai melakukan desain sistem dan perancangan UML, tahap

berikutnya yakni penulisan kode program. Pada tahap ini dilakukan implementasi

pada perancangan yang telah dibuat. Implementasi dilakukan dengan menulis kode

program menggunakan PHP dengan Laravel Framework, Bootstrap dan Materialize

framework sebagai kerangka tampilan, MySQL sebagai basis data.

Tahapan berikutnya dalam perancangan sistem menggunakan Waterfall yakni

pengujian aplikasi. Pengujian aplikasi dilakukan dengan dua cara yakni dengan

pengujian teori dan pengujian aplikasi. Untuk menguji aplikasi langsung untuk

menguji keakuratan data dan HTML5 Geolocation sedangkan untuk pengujian teori

dilakukan perbandingan pengukuran dengan Euclidean dan Jarak dengan Google

Map. Hasil dari pengujian akan digunakan dalam tahap penyimpulan hasil sebagai

kesimpulan dari penelitian.

Tahapan terakhir dari mode Waterfall adalah perawatan program. Pada tahap

ini dilakukan pemeliharaan terhadap aplikasi yang dibuat. Bentuk pemeliharaan

dengan memperbarui aplikasi atau membuat versi yang lebih baru dengan teknologi

atau metode yang lebih cepat dan efisien.

4. Hasil dan Pembahasan

Dalam sistem ini terdapat dua pengguna dalam sistem ini yakni pengguna biasa

dan pengelola. Pengguna biasa dapat melakukan pencarian layanan kesehatan yang

ada baik yang masih melayani ataupun yang tidak melayani. Ketika pengguna

17

melakukan permintaan pencarian layanan kesehatan yang ada disekitarnya. Pengguna

juga dapat meminta rute dari lokasi pengguna menuju layanan kesehatan yang

dibutuhkan menggunakan Google Direction API. Pengelola mampu melakukan

penambahan, pengubahan dan menghapus layanan kesehatan, jadwal layanan

kesehatan, dokter pada layanan kesehatan serta jadwal dokter pada layanan

kesehatan.

Gambar 7 adalah Halaman awal aplikasi. Di sistem ini terdapat menu untuk

mencari lokasi layanan kesehatan yang ada disekitar pengguna berdasarkan lokasi

pengguna menggunakan HTML5 Geolocation atau melakukan input secara manual

lokasi pada field form yang disediakan.

Gambar 7. Halaman awal aplikasi

Untuk memudahkan pencarian lokasi pengguna selain menggunakan HTML5

Geolocation, sistem juga memberikan kemudahan yakni autocomplete yang

memberikan daftar lokasi yang mungkin merupakan lokasi pengguna. Tabel 1 adalah

tabel browser yang mendukung HTML5 Geolocation. Tabel 1. Browser yang mendukung Geolocation API [17]

API IE Google

Chrome

Firefox Safari Opera

Geolocation 9.0 5.0 3.5 5.0 16.0

Setelah sistem mendapatkan lokasi pengguna, sistem melakukan pencarian

layanan kesehatan yang ada disekitar pengguna dalam radius 1 KM. apabila dalam 1

KM pengguna tidak menemukan layanan kesehatan yang dibutuhkan, pengguna dapat

memperlebar pencarian hingga radius 3 KM. setelah pengguna memiliih layanan

kesehatan yang dibutuhkan, pengguna dapat melihat jadwal layanan kesehatan,

jadwal dokter pada layanan kesehatan yang terpilih.

Kode Program 1. Kode Program pelacakan lokasi HTML5 Geolocation API

1. if (navigator.geolocation) {

2. navigator.geolocation.getCurrentPosition(function showPosition(position){

3. koordinat = position.coords.latitude + "," + position.coords.longitude;

4. akurasi = position.coords.accuracy;

5. } else {

6. console.log('not supported');

7. }

18

8. function showPosition(position) {

9. x.innerHTML = "Latitude: " + position.coords.latitude + 10. "<br>Longitude: " + position.coords.longitude;

11. }

12.

13. function showError(error) {

14. switch(error.code) {

15. case error.PERMISSION_DENIED:

16. alert("Pengguna tidak mengijinkan mengakses layanan lokasi");

17. break;

18. case error.POSITION_UNAVAILABLE:

19. alert("Layanan informasi Lokasi tidak tersedia");

20. break;

21. case error.TIMEOUT:

22. alert("Permintaan akses lokasi telah habis")

23. break;

24. case error.UNKNOWN_ERROR:

25. alert("Sepertinya terjadi kesalahan");

26. break;

27. }

28. }

Kode program 1 adalah kode program untuk menerapkan API HTML5

Geolocation. Baris ke-1 pada kode program 2 untuk melakukan pengecekan apakah

browser yang digunakan untuk mengakses aplikasi mendukung fitur HTML5

geolocation. Baris ke-3 dan baris ke-4 berfungsi untuk mendapatkan lokasi pengguna

dan akurasi HTML5 geolocation. Baris ke 12 – 27 berfungsi untuk penanganan

kesalahan yang terjadi dalam pelacakan lokasi menggunakan HTML5 Geolocation. Tabel 2. Dataset Layanan Kesehatan Tiap Kecamatan

No Kecamatan Rumah Sakit Dokter Puskesmas

1 Sidorejo 1 30 2

2 Sidomukti 2 31 2

3 Argomulyo 1 9 2

4 Tingkir 2 14 1

Tabel 2 merupakan dataset jumlah layanan yang kesehatan pada aplikasi di

tiap kecamatan di kota Salatiga meliputi Rumah Sakit, Dokter, dan Puskesmas.

Dataset tersebut nantinya digunakan untuk melakukan pencarian layanan kesehatan

yang ada disekitarnya berdasarkan lokasi pengguna.

(a) (b)

Gambar 8. Hasil pencarian layanan kesehatan

19

Gambar 8a terlihat bahwa secara default aplikasi menampilkan layanan

kesehatan yang ada disekitar pengguna pada jarak 1 KM yang masih melayani ketika

pengguna menjalankan aplikasi. Bila pengguna meminta aplikasi menunjukkan

semua layanan kesehatan yang ada disekitar pengguna baik yang aktif maupun tidak

aktif pengguna dapat melakukan penyarigan data dengan mengubah tombol switch

dari buka menjadi semua seperti yang ditunjukkan pada gambar 8b. Kode Program 2. Mencari layanan kesehatan aktif dalam radius 1 km

1. public function activeHaversine($latitude,$longitude,$jarak=1)

2. {

3. $start = microtime(true);

4. $data = DB::select('Select fo.hari, fo.jam_buka, fo.jam_tutup,

5. f.faskes_id, f.nama_faskes, f.alamat,

6. f.latitude, f.longitude,f.tipe_id, 6371*(2*ASIN(SQRT(POWER(SIN((abs(f.latitude)

7. -abs($latitude)) * pi()/180 / 2), 2) + COS(abs($longitude) * pi()/180 ) *

8. COS(abs(f.latitude) * pi()/180) * POWER(SIN((f.longitude - $longitude) *pi()/180

9. / 2), 2) ))) as jarak from faskes f join faskes_open fo on fo.faskes_id

10. f.faskes_id where fo.hari = WEEKDAY(now()) AND TIME(NOW()) BETWEEN fo.jam_buka

11. AND fo.jam_tutup AND TIME(NOW()) NOT BETWEEN fo.jam_mulai_istirahat and

12. fo.jam_selesai_istirahat having jarak < 1 ORDER BY jarak ASC’);

13. $time_elapsed = microtime(true) - $start;

14. return response()->json(['distance' => $jarak, 'waktu' => $time_elapsed ,

15. 'data' => $data]);

16. }

Kode Program 2 adalah kode program untuk melakukan pencarian layanan

kesehatan yang ada disektiar pengguna dalam radius 1 KM yang masih melayani

ketika pengguna melakukan permintaan pencarian layanan kesehatan. Pencarian

layanan kesehatan yang aktif dilakukan dengan menggunakan Haversine formula dan

untuk mencari layanan kesehatan yang aktif dilakukan penyeleksian pada tabel yang

berelasi dengan tabel layanan kesehatan yakni tabel faskes_open yang merupakan

tabel yang menyimpan jadwal layanan kesehatan. Sistem melakukan pencocokan

antara waktu sistem dengan waktu pengguna saat mengakses aplikasi. Fungsi ini

mengembalikan data dalam bentuk JSON berupa data layanan kesehatan waktu

eksekusi dan radius pencarian.

Kode Program 3. Query SQL mencari layanan kesehatan dalam radius 1 km

1. public function haversine($latitude,$longitude,$jarak=1){

2. $start = microtime(true);

3. $data = DB::select('select faskes_id, nama_faskes, latitude, longitude,

4. tipe_id, alamat,6371*(2*ASIN(SQRT(POWER(SIN((abs(latitude) - abs(-7.3304)) *

5. pi()/180 / 2), 2) +COS(abs(110.5) * pi()/180 ) * COS(abs(latitude) *

6. pi()/180) * POWER(SIN((longitude - 110.5) * pi()/180 / 2), 2) ))) as jarak

7. from faskes f having jarak < 1 ORDER BY jarak ASC’);

8. $time_elapsed = microtime(true) - $start;

9. return response()->json(['distance' => $jarak, 'waktu' => $time_elapsed

10. ,'data' => $data]);

11. }

Kode program 3 adalah method untuk melakukan seleksi data pada database

untuk mencari semua layanan kesehatan yang ada disekitar pengguna baik yang aktif

mapun tidak aktif dalam radius 1 KM. Fungsi ini mengembalikan data dalam bentuk

JSON berupa data layanan kesehatan waktu eksekusi dan radius pencarian.

20

Gambar 9 Rute Menuju layanan kesehatan

Gambar 9 sistem menunjukkan rute menuju layanan kesehatan yang dipilih

oleh pengguna dari lokasi pengguna menuju lokasi layanan kesehatan yang telah

dipilih pengguna sebelumnya menggunakan Google Direction API.

Kode Program 4. Mendapatkan rute dengan Google Direction API

1. function routing(awal,tujuan)

2. {

3. var directionsService = new google.maps.DirectionsService();

4. var directionsDisplay = new google.maps.DirectionsRenderer();

5. document.getElementById('panel').innerHTML = "";

6. var map = new google.maps.Map(document.getElementById('map'), {

7. zoom:7,

8. mapTypeId: google.maps.MapTypeId.ROADMAP

9. });

10. directionsDisplay.setMap(map);

11. directionsDisplay.setPanel(document.getElementById('panel'));

12. var request = {

13. origin: awal,

14. destination: tujuan,

15. travelMode: google.maps.DirectionsTravelMode.DRIVING

16. };

17. directionsService.route(request, function(response, status) {

18. if (status == google.maps.DirectionsStatus.OK) {

19. directionsDisplay.setDirections(response);

20.

21. var point = response.routes[ 0 ].legs[ 0 ];

22. }

23. });

24. }

Kode program 4 adalah kode untuk mendapatkan rute menuju layanan

kesehatan dari lokasi pengguna. Baris 3 -9 merupakan konfigurasi untuk pengaturan

peta Google Map. Baris 10-15 merupakan konfigurasi untuk menampilkan turn-by-

turn navigation dari Google Direction API. Baris 17 -23 merupakan fungsi untuk

mendapatkan rute dari lokasi awal ke tujuan.

21

(a) (b)

Gambar 10. Tampilan aplikasi pada perangkat yang berbeda

Gambar 10 adalah tampilan aplikasi menggunakan framework Materialize yang

responsive yaitu tampilan aplikasi secara otomatis menyesuaikan browser dan

perangkat yang digunakan, bila resolusi layar berubah ukuran tampilan aplikasi tidak

akan rusak tetapi akan menyesuaikan ukuran resolusi layar. Fitur ini dibuat agar

memudahkan pengguna untuk mengakses aplikasi tidak hanya melalui browser pada

komputer tapi perangkat yang berbeda yang memiliki resolusi layar yang berbeda.

Setelah tahapan pembuatan program/ aplikasi tahap berikutnya adalah

pengujian. Pengujian metode dilakukan dengan melakukan perbandingan dengan

metode Euclidean dan untuk akurasi panjang jarak dibandingkan dengan jarak

menggunakan Google Map.

Pengujian dilakukan langsung ke lapangan di kecamatan sidomukti, tepatnya di

sekitar lapangan pancasila (-7.3304,110.5) pada pukul 9.00 pagi.

Tabel 3. Hasil Pengukuran Jarak dalam radius 1 KM dari lokasi (-7.3304,110.5)

No Nama Faskes Euclidean(km) Haversine(km) Google

Map (km)

1 Klinik Aura Medika 0,085396 0,085073 0,085

2 RSUD Salatiga 0,466161 0,463422 0,463

3 RS Mutiara Bunda 0,471987 0,467651 0,468

4 Puskesmas Margosari 0,501231 0,500535 0,501

5 BKPM Salatiga 0,531009 0,530033 0,531

6 Puskesmas Kalicacing 0,549208 0,548183 0,547

8 drg. Kristine 0,613266 0,608783 0,609

9 Puskesmas Mangunsari 0,85316 0,845561 0,847

Waktu Eksekusi query 0,0032 0,0034 -

Tabel 3 menunjukkan aplikasi berhasil menemukan sembilan layanan kesehatan

yang ada disekitar pengguna pada radius maksimum 1 km dan yang aktif ketika

pengguna mengakses aplikasi. Terlihat bahwa metode Haversine memiliki akurasi

yang mendekati Google Map daripada metode Euclidean.

22

Tabel 4. Rata rata eksekusi waktu query

Lokasi Haversine Euclidean

rata -rata standar deviasi rata-rata standar deviasi

1 0,00316 8,43274E-05 0,00303 0,000216282

2 0,0031 0,000166333 0,00307 0,000266875

3 0,00294 0,00011547 0,00277 0,0003335

4 0,00291 0,000347051 0,00277 0,000170294

Tabel 4 adalah tabel pengujian lama waktu pencarian lokasi layanan kesehatan

yang aktif di sekitar pengguna menggunakan Haversine dan Euclidean. Pengujian

dilakukan sebanyak 10 kali pada masing masing lokasi kemudian dicari rata – rata

waktu eksekusi dan standar deviasi dari masing masing pengukuran. Terlihat bahwa

untuk eksekusi query, Euclidean memiliki kecepatan yang lebih baik daripada

Haversine.

Tabel 5 adalah akurasi API HTML5 Geolocation. Untuk mendapatkan lokasi

lintang dan bujur pengguna dapat menggunakan position.coords.latitude dan

position.coords.longitude, sedangkan untuk mendapatkan akurasi HTML5

Geolocation dapat menggunakan position.coords.accuracy Tabel 5. Akurasi HTML5 Geolocation Berdasarkan Operator seluler

Lokasi Provider Akurasi (meter)

1 indosatooreedo 6

telkomsel 1415

xl 12

2 indosatooreedo 26

telkomsel 1411

xl 28

3 indosatooreedo 23

telkomsel 26

xl 40

4 indosatooreedo 15

telkomsel 6

xl 33

5. Kesimpulan

Dalam penelitian ini dibuat sistem untuk melakukan pencarian layanan

kesehatan yang aktif yang ada di sekitar pengguna menggunakan Haversine.

Penelitian ini juga membandingkan metode Haversine dan Euclidean. Berdasarkan

pengujian yang dilakukan, metode Euclidean memiliki kecepatan eksekusi waktu

yang lebih baik daripada Haversine tetapi Haversine memiliki akurasi jarak yang

lebih baik daripada Euclidean bila dibandingkan dengan jarak yang diukur

menggunakan Google Map. Pemanfaatan responsive design juga membantu agar

aplikasi dapat di akses melalui berbagai perangkat seperti smartphone, tablet dan

23

Notebook / PC. Akurasi HTML5 Geolocation juga bergantung pada lokasi dan

operator seluler yang digunakan.

Penelitian ini bisa dikembangkan untuk mencari layanan kesehatan di sekitar

pengguna dan yang buka dari lokasi pengguna dengan menambahkan perhitungan

panjang jalan dan persimpangan yang dilalui serta ketinggian kontur jalan. Selain itu,

dapat ditambahkan hari libur nasional sebagai pengecualian tambahan hari kerja.

Daftar Pustaka

[1] BPS Kota Salatiga,2015, Salatiga Dalam Angka 2015, Salatiga : Badan Pusat

Statistik.

[2] Hu, Wen-Chen, Wang, Xiwei, __, Location-Based Services Using HTML5

Geolocation and Google Maps APIs.

[3] Supardi, Fery D, dkk, 2014, Rancang Bangun Aplikasi Sistem informasi

geografis praktik dokter dengan geolocatoin API berbasis responsive web

design, Igarss.

[4] Mwemezi, Jovin J. ,Huang, Youfang, 2011, Optimal Facility Location on

spherical surfaces,New York Science Journal 4(7).

[5] Sukoco, Budi, 2010, Penentuan Rute Optimal Berdasarkan Waktu Tempuh

Tercepat (Studi Kasus : Kota Surakarta). Repository Universitas Sebelas

Maret.

[6] Riegen,Riecher, ___, Sistem Informasi Layanan Kesehatan Kota Salatiga

Berbasis Web GIS,

https://drive.google.com/file/d/0BzlQWFPGVUr9cjhueTA0Sk5VQmc/edit?pref

=2&pli=1, Diakses tanggal 6 Agustus 2015

[7] Sumarsono, Bambang, 2014, Perancangan Aplikasi Mobile Tambal Ban

Terdekat di Kabupaten Sleman Menggunakan Location Based Services Pada

Platform Android.

[8] McCool, Shawn, 2012, Laravel Starter, Birmingham : Packt Publishing.

[9] Gregorius,Agung, 2012, Buku Pintar HMTL5 CSS3 Dreamweaver CS6,

Yogyakarta : Jubilee Enterprise.

[10] Lubbers, Peter, dkk,2010, Pro HTML5 Programming. New York : Springer.

[11] Widyatmoko, Nur, 2012,Pemanfaatan Geolocation dan Haversine Formulla

dalam Perancangan Sistem Informasi Geografis (GIS) (Studi Kasus :

Pariwisata Kabupaten Semarang), Repository Digital Library UKSW.

[12] Rofiq, M. ,Uzzy, Riza Fathul, 2014, Penentuan Jalur Terpendek Menuju Cafe

Di Kota Malang Menggunakan Metode Bellman-Ford dengan Location Based

Service Berbasis Android, Jurnal Ilmiah Teknologi dan Informasi ASIA 8(2):

49–64.

24

[13] Shiddiq, Ahmad, dkk,2012, Rancang Bangun Alat Kalibrasi Sensor

Menggunakan Metode Euclidean, Seminar Proyek Akhir Jurusan Teknik

elektronika PENS-ITS.

[14] Andy, Rubin, Geo (proximity) Search with MySQL 2006.

http://www.arubin.org/files/geo_search.pdf. Diakses tanggal 6 Agustus 2015.

[15] Hasibuan, Zainal A., Metodologi Penelitian Pada Bidang Ilmu Komputer dan

Tekonlogi Informasi. Konsep, Teknik Dan Aplikasi . Jakarta : Ilmu Komputer

Universitas Indonesia.

[16] Pressman, Roger, 2001, Software Engineering : A Practitioner ’ s Approach,

2001.New York : McGraw-Hill Higher Education.

[17] W3schools, 2015, HTML5 Geolocation,

http://www.w3schools.com/html/html5_geolocation.asp, Diakses tanggal 05

Desember 2015.