Cara mencegah peta menggeser saat menggulir halaman

10

Ketika halaman HTML berisi peta, dan pengguna menggulir ke bawah halaman menggunakan roda mouse mereka, ketika mouse pengguna melewati peta, halaman akan berhenti bergulir sementara peta itu sendiri akan menggeser. Lihat Demo1 .

Saya ingin meniru perilaku terperinci di Trik kegunaan sederhana untuk Google Maps menggunakan ArcGIS Server JS API 3.x.

Artinya, halaman tersebut harus bergulir kecuali jika pengguna secara eksplisit menyeret dalam peta, dalam hal ini peta harus digeser .

Perilaku ini hampir ada di Demo2 , di mana halaman bergulir bahkan jika mouse Anda berada di atas peta.

map.on("load", function(){
  // Disable navigation by default, so scrolling the page doesn't scroll the map
  map.disableMapNavigation();

  // When the user tries to pan the map, allow this
  map.on('mouse-drag-start', function(){
    map.enableMapNavigation();
  });

  // Restore the no-scroll behaviour when the mouse leaves the map
  map.on('mouse-out', function(){
    map.disableMapNavigation();
  });
});

Namun, pan peta tidak diaktifkan kecuali jika Anda mengklik pertama kali di dalam peta, lepaskan tombol mouse, dan kemudian pan. Apakah mungkin untuk mencapai efek mulus yang ditunjukkan dengan Google Maps di posting blog?

Saya mencoba mouse-drag, mouse-drag-startdan mouse-downacara tetapi perilakunya sama untuk semua acara.

events arcgis-javascript-api Stephen Lead
sumber
1
Anda dapat mencoba kapan Anda enableMapNavigationharus segera setelah menginstal kembali mouse-drag-startacara tersebut. Saya menemukan dojotoolkit.org/reference-guide/1.10/dojo/Evented.html sebagai kelas dojo untuk memancarkan acara. Jadi, Anda akan menyeret (atau mengklik) pada peta -> mengaktifkan navigasi peta -> dalam fungsi yang sama memanggil acara seret (mungkin dapat hanya memohon atau mungkin memerlukan params) -> lanjutkan dengan menyeret bisnis Anda. Mungkin bisa mengambil mouse ke bawah dan menyeretnya. Boleh jadi kombo untuk mencoba acara-acara itu dalam urutan berbeda, dll.
Branco

Jawaban:

2

Anda tidak pernah memberikan alasan untuk menggunakan metode dis / enableMapNavigation daripada metode dis / enableScrollWheelZoom . Gunakan yang terakhir.

Zack
sumber
Sayangnya ini tidak berhasil karena (1) perilaku default peta adalah menggeser (tidak memperbesar) ketika roda gulir digunakan, dan (2) map.disablePan();tidak berlaku untuk roda gulir, hanya tarik-ke-pan: jsfiddle.net/g7npfuvn/16
Stephen Lead
Ah, masalahnya adalah bahwa saya menguji pada Mac, di mana smartNavigationefeknya berlaku: Ketika benar, untuk komputer Apple dengan trackpad atau penggunaan mouse ajaib, gesek panci alih-alih memperbesar . Jika saya mengatur ini ke false, dan menguji pada PC, itu berfungsi. Jadi sepertinya ini adalah batasan ArcGIS Server JS API pada Mac.
Stephen Lead
Jika Anda menetapkan nilai ke false maka Anda harus melihat perilaku yang sama terlepas dari perangkat keras os +. Pertimbangkan mendengarkan acara mousemove dan setelah deteksi mematikan smartNav, mirip dengan apa yang telah dilakukan di sini .
Zack