JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 IMPLEMENTASI PETA INTERAKTIF BERBASIS WEB UNTUK LOKASI SPBU PERTAMINA DI KOTA PADANG Windy Putri Yuza. Zulfahmi. Kom. ,Putri Anggraini. Kom. Intan Utnasari. Kom. Sistem Informasi. Farmasi. Sains dan Teknologi . Universitas Dharma Andalas Abstract The use of web-based interactive mapping technology has become an effective solution for providing real-time and accurate location information. This study aims to implement an interactive map for Pertamina gas station (SPBU) locations in Padang City, facilitating users in finding the nearest SPBU, complete with detailed information such as name, address, geographical coordinates, and available services. The system is built using Leaflet. js and OpenStreetMap technologies, enabling the integration of location data with dynamic map visualization. SPBU location data is obtained from surveys and related The results indicate that this interactive mapping system enhances accessibility to information for the general public, especially motor vehicle users in Padang City. This system is expected to serve as a model that can be applied in other cities for similar needs. Keywords: Interactive Map. Pertamina SPBU. Padang City. Leaflet. OpenStreetMap. Geographic Information System. Abstrak Penggunaan teknologi peta interaktif berbasis web telah menjadi solusi efektif dalam memberikan informasi lokasi secara real-time dan akurat. Penelitian ini bertujuan untuk mengimplementasikan peta interaktif untuk lokasi SPBU Pertamina di Kota Padang, sehingga memudahkan pengguna dalam menemukan lokasi SPBU terdekat, lengkap dengan informasi detail seperti nama, alamat, koordinat geografis, dan layanan yang tersedia. Sistem ini dibangun menggunakan teknologi Leaflet. dan OpenStreetMap, yang memungkinkan integrasi data lokasi dengan visualisasi peta yang dinamis. Data lokasi SPBU diperoleh dari survei dan database instansi terkait. Hasil penelitian menunjukkan bahwa sistem peta interaktif ini mampu meningkatkan aksesibilitas informasi bagi masyarakat umum, khususnya pengguna kendaraan bermotor di Kota Padang. Sistem ini diharapkan dapat menjadi model yang dapat diterapkan di kota-kota lain untuk kebutuhan serupa. Keywords: Peta Interaktif. SPBU Pertamina. Kota Padang. Leaflet. OpenStreetMap. Sistem Informasi Geografis. This work is licensed under Creative Commons Attribution License 4. 0 CC-BY International license PENDAHULUAN Ketersediaan bahan bakar minyak (BBM) merupakan salah satu kebutuhan penting yang menunjang berbagai aktivitas ekonomi, sosial, dan kehidupan masyarakat. PT Pertamina (Perser. , sebagai perusahaan energi milik negara, memiliki peran strategis dalam mendistribusikan BBM dan produk energi lainnya di seluruh wilayah Indonesia, termasuk Kota Padang. Sebagai ibu kota Provinsi Sumatera Barat. Kota Padang memiliki pertumbuhan ekonomi yang cukup pesat, didukung oleh sektor perdagangan, transportasi, pariwisata, dan Seiring dengan meningkatnya aktivitas masyarakat, kebutuhan terhadap BBM juga terus bertambah. Hal ini mendorong pentingnya keberadaan stasiun pengisian bahan bakar umum (SPBU) yang tersebar secara strategis di seluruh wilayah kota untuk memastikan aksesibilitas dan ketersediaan bahan bakar bagi masyarakat. Namun, tidak semua masyarakat memiliki informasi yang memadai terkait lokasi SPBU Pertamina di Kota Padang, terutama yang berada di daerah tertentu. Dengan perkembangan teknologi geospasial, pemetaan digital berbasis web atau aplikasi menjadi solusi efektif untuk mengatasi keterbatasan informasi tersebut. Pemetaan lokasi SPBU Pertamina menggunakan platform seperti Leaflet atau Google Maps tidak hanya memudahkan masyarakat dalam menemukan SPBU terdekat, tetapi juga membantu pihak Pertamina dalam memantau distribusi dan aksesibilitas layanan mereka. Penelitian ini bertujuan untuk mengembangkan sistem pemetaan lokasi SPBU Pertamina di Kota Padang. Sistem ini akan memberikan informasi akurat mengenai lokasi SPBU, kapasitas layanan, serta fasilitas yang Melalui sistem ini, diharapkan masyarakat dapat dengan mudah mengetahui dan mengakses layanan Pertamina, sehingga mendukung efisiensi transportasi dan distribusi bahan bakar di wilayah Kota Padang. TINJAUAN PUSTAKA Pengerttian Pemetaan Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 Peraturan Pemerintah Nomor 8 Tahun 2013 Tentang Ketelitian Peta menyebutkan unit pemetaan adalah pembagian ruang terkecil atau hierarki terkecil dalam suatu Peta Tematik yang digunakan untuk menampilkan informasi tematik dalam penyusunan tata ruang. Proses pemetaan yaitu tahapan-tahapan yang harus dilakukan dalam perancangan sebuah peta . Pengerttian Web Browser Web Browser adalah aplikasi perangkat lunak yang digunakan untuk mengambil dan menyajikan sumber informasi web. Sumber informasi web diidentifikasikan dengan Uniform Resource Identifier (URL) yang dapat terdiri dari halaman web, video, gambar, atau pun konten lainnya . Pengerttian Use Case Diagram Use Case Diagram ialah diagram yang wajib dirancang pertama kali saat pemodelan software berorientasi objek yang dilakukan . Pengerttian Activity Diagram Activity diagram memodelkan workflow proses bisnis dan urutan aktivitas dalam sebuah proses. Diagram ini sangat mirip dengan flowchart karena memodelkan workflow dari suatu aktivitas lainnya atau dari aktivitas ke status . Pengerttian Sequencce Diagram Sequence Diagram adalah suatu diagram yang menjelaskan interaksi objek dan menunjukkan . emberi tanda atau petunju. komunikasi di antara objek-objek tersebut . Pengerttian Class Diagram Class Diagram adalah sebuah spesifikasi yang akan menghasilkan sebuah objek dan merupakan inti dari pengembangan dan desain berorientasi objek . METODE PENELITIAN Metode penelitian yang digunakan dalam penelitian ini adalah metode deskriptif, yang bertujuan untuk menjelaskan implementasi sistem peta interaktif untuk menampilkan lokasi SPBU Pertamina di Kota Padang. Data yang digunakan dalam penelitian ini diperoleh dari dua sumber utama, yaitu data primer dan sekunder. Data primer diperoleh melalui observasi langsung terhadap SPBU Pertamina yang ada di Kota Padang, yang mencakup informasi seperti koordinat geografis . intang dan buju. , nama, alamat, serta layanan yang tersedia di setiap SPBU. Sedangkan data sekunder diperoleh dari sumber resmi Pertamina dan otoritas setempat mengenai lokasi-lokasi SPBU yang beroperasi di Kota Padang. Proses pengembangan sistem dimulai dengan perencanaan sistem yang mencakup penentuan fitur-fitur utama yang akan dikembangkan, seperti menampilkan lokasi SPBU, menyediakan informasi detail mengenai setiap SPBU, serta menyertakan fitur peta interaktif. Selanjutnya, data lokasi SPBU diintegrasikan ke dalam sistem menggunakan koordinat geografis yang diperoleh, dan sistem peta interaktif dibangun menggunakan OpenStreetMap serta pustaka Leaflet. js untuk menampilkan peta tersebut. Pengembangan antarmuka pengguna dilakukan menggunakan HTML. CSS, dan JavaScript agar sistem dapat menampilkan peta secara responsif pada berbagai perangkat. Sistem yang telah dikembangkan kemudian diimplementasikan di server web agar dapat diakses melalui Peta interaktif yang dihadirkan dalam sistem dilengkapi dengan penanda lokasi setiap SPBU, dan popup yang menampilkan informasi detail seperti nama, alamat, dan layanan yang tersedia. Uji coba sistem dilakukan untuk memastikan bahwa seluruh fungsionalitas bekerja dengan baik, baik dari segi tampilan peta, akurasi lokasi, maupun kenyamanan pengguna dalam mengakses informasi tentang SPBU yang ada di Kota Padang. Evaluasi terhadap sistem dilakukan dengan mempertimbangkan umpan balik dari pengguna untuk meningkatkan performa dan kegunaan sistem. Metode pengembangan sistem yang digunakan dalam penelitian ini adalah metode Waterfall. Metode ini dipilih karena prosesnya yang terstruktur dan sistematis, memungkinkan pengembangan sistem dilakukan secara Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 bertahap dengan fokus pada setiap tahapan secara rinci. Proses pengembangan sistem ini dilakukan melalui beberapa fase utama, yaitu: Perencanaan (Plannin. Pada tahap ini, dilakukan analisis kebutuhan sistem yang meliputi penentuan fitur yang akan disediakan dalam peta interaktif SPBU Pertamina, seperti penandaan lokasi SPBU, informasi detail mengenai setiap SPBU, serta fitur pencarian dan navigasi. Analisis kebutuhan dilakukan berdasarkan hasil wawancara dengan pengguna potensial, seperti pelanggan dan pengelola SPBU. Pada tahap ini juga dilakukan pemilihan teknologi yang akan digunakan, seperti Leaflet. js untuk peta interaktif. PHP untuk pengelolaan server, serta MySQL untuk penyimpanan data lokasi SPBU. Desain Sistem (System Desig. Setelah kebutuhan sistem diketahui, tahap berikutnya adalah merancang arsitektur dan desain sistem. Pada tahap ini, dilakukan desain antarmuka pengguna (UI) untuk memastikan sistem mudah digunakan dan responsif di berbagai perangkat. Desain juga mencakup pemilihan layout peta, tampilan marker, dan pop-up yang akan menampilkan informasi tentang SPBU. Selain itu, dilakukan desain basis data untuk menyimpan informasi mengenai lokasi SPBU, seperti nama, alamat, koordinat, dan layanan yang Pengembangan dan Implementasi (Development and Implementatio. Pada tahap ini, dilakukan pengkodean untuk mengimplementasikan desain sistem. Data lokasi SPBU dimasukkan ke dalam basis data, dan antarmuka pengguna dibuat menggunakan HTML. CSS, dan JavaScript. Peta interaktif dibangun menggunakan pustaka Leaflet. js, yang memungkinkan integrasi data lokasi dengan peta secara dinamis. Sistem ini dikembangkan untuk dapat diakses melalui web, dengan server yang menjalankan PHP sebagai back-end dan MySQL untuk pengelolaan data. Pengujian (Testin. Setelah sistem selesai dikembangkan, tahap selanjutnya adalah pengujian. Pengujian dilakukan untuk memastikan sistem berjalan sesuai dengan yang diharapkan. Uji coba dilakukan pada fungsionalitas peta interaktif, akurasi lokasi SPBU, serta keterbacaan informasi yang ditampilkan. Pengujian juga mencakup uji coba responsivitas sistem pada berbagai perangkat dan browser untuk memastikan aksesibilitas yang optimal. Pemeliharaan dan Perbaikan (Maintenance and Improvemen. Setelah sistem diimplementasikan dan diuji, tahap terakhir adalah pemeliharaan. Tahap ini melibatkan pemantauan kinerja sistem, serta memperbaiki bug atau masalah yang ditemukan setelah penggunaan sistem secara langsung. Selain itu, jika ada kebutuhan untuk menambahkan fitur baru atau memperbarui informasi lokasi SPBU, sistem akan diperbaharui sesuai dengan permintaan pengguna atau perkembangan dari pihak Pertamina. Metode Waterfall dipilih karena sifatnya yang memungkinkan setiap tahap pengembangan dapat dikerjakan secara terpisah dan lebih fokus, serta memudahkan untuk melacak kemajuan proyek secara terstruktur. HASIL DAN PEMBAHASAN 1 Analisa Kebutuhan Sistem Analisis kebutuhan sistem ini bertujuan untuk menggambarkan fitur dan aspek teknis yang perlu dipenuhi dalam pengembangan sistem pemetaan lokasi SPBU Pertamina di Kota Padang. Kebutuhan sistem dapat dibagi menjadi kebutuhan fungsional dan non-fungsional. Kebutuhan fungsional meliputi beberapa fitur utama, yakni pertama, sistem harus dapat menampilkan peta interaktif dengan marker yang menunjukkan lokasi SPBU Pertamina di Kota Padang. Setiap marker akan menampilkan informasi tentang SPBU seperti nama, alamat, dan deskripsi. Pengguna juga dapat melakukan zoom in dan zoom out untuk melihat lokasi lebih jelas. Kedua, sistem harus memungkinkan pencarian SPBU berdasarkan nama atau alamat, yang kemudian menampilkan hasil pencarian tersebut pada peta. Fitur navigasi juga harus tersedia agar pengguna dapat memperoleh petunjuk arah menuju SPBU yang dipilih, menggunakan layanan peta eksternal seperti Google Maps. Selain itu, sistem harus mampu memperbarui data lokasi SPBU secara berkala agar informasi yang ditampilkan tetap akurat dan relevan. Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 Kebutuhan non-fungsional mengarah pada performa dan kualitas teknis sistem. Pertama, kecepatan akses menjadi hal yang penting agar pengguna dapat mengakses peta dan informasi SPBU tanpa hambatan, dengan waktu pemuatan yang minimal. Kedua, sistem harus responsif, artinya dapat diakses dengan baik pada berbagai perangkat, baik desktop, tablet, maupun smartphone. Ketiga, aspek keamanan data harus diperhatikan untuk melindungi informasi pengguna dan data SPBU melalui enkripsi dan perlindungan terhadap akses tidak sah. Keempat, sistem harus memiliki ketersediaan yang tinggi dengan waktu downtime yang minimal, serta dapat menangani jumlah pengguna yang terus berkembang tanpa mengalami penurunan Terakhir, sistem harus dirancang dengan antarmuka yang mudah digunakan . ser-friendl. , sehingga pengguna, baik yang berpengalaman maupun pemula, dapat dengan mudah mengakses dan memahami fungsifungsi dalam sistem. Kebutuhan sumber daya dalam pengembangan sistem ini mencakup sumber daya manusia yang terdiri dari pengembang perangkat lunak, desainer UI/UX, dan administrator database. Selain itu, dibutuhkan perangkat lunak pendukung seperti server web yang kompatibel dengan PHP dan MySQL serta pustaka Leaflet. js untuk menampilkan peta interaktif. Perangkat keras yang dibutuhkan adalah server untuk menyimpan data dan menangani permintaan dari pengguna. Terakhir, data lokasi SPBU yang akurat dan terkini menjadi kebutuhan utama agar sistem dapat menampilkan informasi yang tepat. Secara keseluruhan, sistem ini membutuhkan teknologi-teknologi seperti Leaflet. js untuk peta interaktif. PHP dan MySQL untuk pengelolaan data dan backend, serta integrasi dengan layanan peta eksternal untuk fitur Dengan memenuhi seluruh kebutuhan fungsional dan non-fungsional ini, sistem diharapkan dapat memberikan solusi yang efektif dan efisien dalam memetakan lokasi SPBU Pertamina di Kota Padang. 2 Perancangan Sistem 1 Usecase Diagram Gambar 3. 1 Usecase Diagram 2 Activity Diagram User Lihat Home Gambar 3. 2 Activity Diagram User Lihat Home Diagram Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 1 Activity Diagram User Lihat Data Lokasi Gambar 3. 3 Activity Diagram User Lihat Data Lokasi 1 Activity Diagram User Lihat About Gambar 3. 4 Activity Diagram User Lihat About Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 2 Activity Diagram Admin Gambar 3. 5 Activity Diagram Admin 3 Sequencce Diagram User Gambar 3. 6 Sequence Diagram User Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 4 Sequencce Diagram Admin Gambar 3. 7 Sequence Diagram Admin 5 Class Diagram Gambar 3. 8 Class Diagram 3 Implementasi Sistem Gambar 3. 9 Halaman Home Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 Gambar 3. 10 Halaman Data Pertamina Gambar 3. 11 Halaman About Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 Gambar 3. 12 Halaman Login Admin Gambar 3. 13 Halaman Admin Kelola Data Pertamina 4 Maintenance Pemeliharaan sistem untuk aplikasi pemetaan lokasi SPBU Pertamina di Kota Padang meliputi pemeliharaan perangkat lunak, perangkat keras, data, keamanan, dan antarmuka pengguna. Pemeliharaan perangkat lunak dilakukan dengan memperbaiki bug, memperbarui fitur, dan memastikan kompatibilitas sistem. Perangkat keras harus dipantau secara rutin untuk menghindari kerusakan atau downtime. Data lokasi SPBU harus diperbarui dan dijaga integritasnya agar tetap akurat. Keamanan sistem dijaga dengan pembaruan dan penguatan protokol keamanan, sedangkan antarmuka pengguna diperbarui agar tetap responsif dan mudah digunakan. Semua pemeliharaan ini bertujuan untuk memastikan kinerja sistem yang optimal dan memberikan layanan yang terbaik bagi pengguna. Jurnal Sistem Informasi Dan InformatikaAe JISKA Vol. 03 No. 1 Januari 2025 JISKA: Jurnal Sistem Informasi Dan Informatika Vol. 3 No. 1 Januari 2025 Hal. http://jurnal. id/index. php/jiska E-ISSN : 2985-9735 SIMPULAN Kesimpulan dari penelitian ini adalah bahwa implementasi peta interaktif berbasis web untuk lokasi SPBU Pertamina di Kota Padang berhasil memberikan solusi yang efektif dalam menyediakan informasi lokasi yang akurat dan mudah diakses oleh masyarakat. Sistem ini memanfaatkan teknologi peta digital untuk menampilkan lokasi SPBU secara interaktif, serta dilengkapi dengan fitur pencarian yang memudahkan pengguna menemukan SPBU terdekat. Dengan penggunaan Leaflet sebagai platform pemetaan dan database yang terstruktur dengan baik, sistem ini mampu memperbarui informasi lokasi SPBU secara real-time. Pemeliharaan sistem yang baik dan berkelanjutan juga diperlukan untuk memastikan sistem tetap dapat berjalan dengan optimal, dengan memperbarui data, meningkatkan fitur, dan menjaga keamanan. Secara keseluruhan, sistem ini diharapkan dapat membantu masyarakat dalam mencari SPBU dengan mudah, serta mendukung upaya Pertamina dalam memberikan layanan yang lebih baik. UCAPAN TERIMAKASIH