Pemrograman

Bahasa

Framework

Peralatan

Info

Mengatasi Malsalah Posisi Titik Tengah Peta (Google Maps)

– 17 July 2016
Ada masalah yang membuat saya bingung, posisi titik tengah Google maps selalu berada di pojok kiri atas. Pada masalah sebelumnya, Google Maps tidak bisa ditampilkan karena di letakkan di dalam modal. Meskipun saya sudah set titik tengahnya pada trigger event 'resize', namun tetap saja posisinya berada di pojok kiri atas.
 
Setelah digeser:

Kode yang mengatasi saat trigger event "resize" atau modal-nya ditampilkan:
$("#modal-peta").on("shown.bs.modal", function() {
    
     google.maps.event.trigger(peta, "resize", function() {
         peta.setCenter(peta.getCenter());
     });

});
Ternyata ada yang salah dengan kode tersebut. Setelah saya telusuri dengan kata kunci "Google Maps center top left" di Google, saya menemukan jawabanya. Memanggil fungsi di dalam event trigger "resize" mungkin tidak bisa. Berdasarkan beberapa jawaban di Stackoverflow mengatakan, pemanggilan fungsi trigger "resize" sendiri tidak bisa mengganti posisi tengah peta. Oleh karena itu disarankan kodenya dibuat seperti berikut ini.
$("#modal-peta").on("shown.bs.modal", function() {

    // ambil dulu titik tengahnya
    var tengah = peta.getCenter();
    
    // resize
    google.maps.event.trigger(peta, "resize");
    
    // set ulang titik tengah
    peta.setCenter(tengah);

});
Hasilnya:


Referensi: http://stackoverflow.com/a/8559243

No comments :

Post a Comment