วิธีป้องกันไม่ให้แผนที่ปรากฎว่าขณะเลื่อนหน้า


10

เมื่อหน้า HTML มีแผนที่และผู้ใช้เลื่อนหน้าลงโดยใช้ล้อเลื่อนของเมาส์เมื่อเมาส์ของผู้ใช้ผ่านแผนที่หน้าจะหยุดเลื่อนในขณะที่แผนที่จะเลื่อน ดูDemo1

ฉันต้องการเลียนแบบพฤติกรรมโดยละเอียดที่เคล็ดลับการใช้งานง่ายสำหรับ Google Mapsโดยใช้ ArcGIS Server JS API 3.x

นั่นคือหน้าควรเลื่อนเว้นแต่ผู้ใช้อย่างชัดเจนลากภายในแผนที่ซึ่งในกรณีแผนที่ควรเลื่อน

พฤติกรรมนี้ใกล้เคียงกับในDemo2ซึ่งหน้าจะเลื่อนแม้ว่าเมาส์ของคุณจะอยู่เหนือแผนที่

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();
  });
});

อย่างไรก็ตามกระทะแผนที่ไม่ได้เปิดใช้งานเว้นแต่ว่าคุณจะคลิกครั้งแรกภายในแผนที่ปล่อยปุ่มเมาส์แล้วจึงเลื่อน เป็นไปได้หรือไม่ที่จะได้เอฟเฟกต์ที่แสดงด้วย Google แผนที่ในบล็อกโพสต์

ฉันพยายามmouse-drag, mouse-drag-startและmouse-downเหตุการณ์ที่เกิดขึ้น แต่พฤติกรรมที่เหมือนกันสำหรับกิจกรรมทั้งหมด


1
คุณสามารถลองเมื่อคุณenableMapNavigationจะทันทีหลังจาก reinvoke mouse-drag-startเหตุการณ์ ฉันพบdojotoolkit.org/reference-guide/1.10/dojo/Evented.htmlเป็นคลาส dojo เพื่อส่งเหตุการณ์ ดังนั้นคุณจะลาก (หรือคลิก) บนแผนที่ -> เปิดใช้งานการนำทางแผนที่ -> ในฟังก์ชั่นเดียวกันทำให้เกิดเหตุการณ์ลาก (อาจจะสามารถเรียกใช้หรืออาจต้องใช้พารามิเตอร์) -> ไปเกี่ยวกับการลากธุรกิจของคุณ มันอาจสามารถยกเมาส์ขึ้นแล้วลากไปด้วยก็ได้ ก็อาจจะมีคำสั่งผสมของการพยายามที่เหตุการณ์เหล่านั้นออกมาในการสั่งซื้อที่แตกต่างกัน ฯลฯ
Branco

คำตอบ:


2

คุณไม่เคยให้เหตุผลสำหรับการใช้โรค / enableMapNavigationวิธีการมากกว่าโรค / enableScrollWheelZoomวิธี ใช้หลัง


น่าเสียดายที่นี่ไม่ได้เพราะ (1) พฤติกรรมเริ่มต้นของแผนที่คือการเลื่อน (ไม่ซูม) เมื่อใช้ล้อเลื่อนและ (2) map.disablePan();ใช้ไม่ได้กับล้อเลื่อนเพียงลากไปที่: jsfiddle.net/g7npfuvn/16
Stephen Lead

อ่าปัญหาคือว่าฉันถูกทดสอบบน Mac ซึ่งsmartNavigationจะมีผล: เมื่อความจริงสำหรับคอมพิวเตอร์แอปเปิ้ลกับแทร็คแพหรือใช้เมาส์มายากล, กระทะรูดแทนการซูม ถ้าฉันตั้งค่านี้เป็นเท็จและทดสอบบนพีซีมันใช้งานได้ ดังนั้นดูเหมือนว่านี่เป็นข้อ จำกัด ของ ArcGIS Server JS API บน Mac
สตีเฟ่นนำ

หากคุณตั้งค่าเป็นเท็จคุณควรจะเห็นพฤติกรรมเดียวกันโดยไม่คำนึงถึงฮาร์ดแวร์ OS + พิจารณาฟังสำหรับเหตุการณ์ mousemove และเมื่อตรวจสอบการปิด SmartNav คล้ายกับสิ่งที่เคยทำมามากกว่าที่นี่
Zack
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.