วิธีปิดการนำทางแผนที่ใน ArcGIS Server JavaScript API v4.x

Nov 16 2020

ในเวอร์ชันเก่า 3.x ของ ArcGIS Server JavaScript API สามารถปิดการนำทางแผนที่โดยใช้disableMapNavigation()ตามที่อธิบายไว้ในการปิดใช้งานแผนที่ใน ArcGIS API สำหรับ Javascript

อะไรคือสิ่งที่เทียบเท่ากันสำหรับการปิดใช้งานการนำทางแผนที่ในเวอร์ชัน 4.x ของ ArcGIS Server JavaScript API กรณีการใช้งานคือการป้องกันการนำทางแผนที่ชั่วคราวในขณะที่แบบสอบถามภายนอกกำลังทำงานอยู่

mapView มีคุณสมบัติการนำทางซึ่งอนุญาตให้ปิดใช้การนำทางบางประเภทดังตัวอย่างที่https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=view-disable-navigationแต่ดูเหมือนจะไม่อนุญาตให้ปิดการนำทางทั้งหมด

เช่นแม้ว่าจะใช้:

navigation: {
  gamepad: {enabled: false},
  browserTouchPanEnabled: false,
  momentumEnabled: false,
  mouseWheelZoomEnabled: false
}

ผู้ใช้สามารถเลื่อนแผนที่ด้วยเมาส์ซูมโดยดับเบิลคลิกหมุนแผนที่โดยใช้ปุ่มเมาส์ขวาเป็นต้น

คำตอบ

4 DrorBogin Nov 16 2020 at 12:55

ดูเหมือนว่าจะปิดการนำทางแผนที่โดยสมบูรณ์ (ภายใต้เงื่อนไขเช่นที่คุณถาม) คุณจะต้องหยุดการเผยแพร่เหตุการณ์จากเหตุการณ์บางอย่าง

view.on(["click", "drag", "double-click", "mouse-wheel", "hold", ], function(event) {
  if(thinking){
    event.stopPropagation();
  }
});

นี้จะหยุดทั้งหมดของเหตุการณ์เหล่านั้นถ้าคุณต้องการที่จะปิดการใช้งานคลิกหรือเหตุการณ์ลากจากเพียงปุ่มเมาส์ขวา (ในกรณีที่คุณต้องการเพียงแค่การหมุนปิดการใช้งานตัวอย่างเช่น) แล้วclick, dragและdouble-clickเหตุการณ์ที่เกิดขึ้นยังมีคุณสมบัติปุ่มที่คุณสามารถทำได้ ใช้:

คำอธิบายค่า
0 คลิกซ้าย (หรือสัมผัส)
1 คลิกกลาง
2 คลิกขวา

* นำมาจากเอกสารประกอบการดูเหตุการณ์

แก้ไข

หลังจากถามเกี่ยวกับการปิดใช้งานการShift+Left-click+Dragซูมด้วยฉันก็กลับไปที่เอกสารและพบตัวอย่างนี้

เห็นได้ชัดว่าคุณสามารถเพิ่มคำจำกัดความของแป้นคีย์บอร์ดแบบกดลงในเหตุการณ์เพื่อหยุดเหตุการณ์ไม่ให้เดือด

view.on("drag", ["Shift"], function(event) {
  event.stopPropagation();
});

view.on("drag", ["Shift", "Control"], function(event) {
  event.stopPropagation();
});
1 StephenLead Nov 16 2020 at 16:14

นอกจากคำตอบที่ยอดเยี่ยมของ Dror แล้วเพื่อป้องกันไม่ให้ผู้ใช้ใช้ปุ่มซูมเข้า / ออกคุณสามารถสร้างวิดเจ็ตซูมซึ่งสามารถลบออกได้ตามความจำเป็น

ลบการซูมมาตรฐานเมื่อสร้างอินสแตนซ์มุมมองโดยใช้คีย์เวิร์ดuiและไม่รวมตัวควบคุมการซูม:

const view = new MapView({
  container: "viewDiv",
  map: map,
  ui: { components: ["attribution"] }
});

จากนั้นเพิ่ม / ลบตัวควบคุมการซูมตามต้องการ:

let zoomControl = new Zoom({
  view: view
});

// Enable zoom
view.ui.add(zoomControl, {
  position: "top-left"
});

// Disable zoom
view.ui.remove(zoomControl);