我们项目开发过程中可能会遇到 屏蔽地图默认事件 的需求,或者需要 屏蔽掉放大,缩小,指北针等库自带的控件。
屏蔽自带控件的代码,arcgis for js自带控件DOM基本上都写在view.ul模块中,设置为空便可以清空所有默认控件
view.ui.components = [];
屏蔽地图默认事件,原理是通过设置view的监听,然后在相应事件触发时候阻止事件冒泡,我们可以添加一个内部状态curentState来设置是否启用禁止默认事件效果。
//禁止默认事件
function DisableInteraction(view) {
let curentState = true;
//禁止通过键盘+-缩放地图
view.on("key-down", function (event) {
var prohibitedKeys = ["+", "-", "Shift", "_", "="];
var keyPressed = event.key;
if (prohibitedKeys.indexOf(keyPressed) !== -1) {
if (curentState) event.stopPropagation();
//禁止滚轮缩放地图
view.on("mouse-wheel", function (event) {
if (curentState) {
event.stopPropagation();
//禁止双击放大
view.on("double-click", function (event) {
if (curentState) event.stopPropagation();
//禁止Ctrl+双击缩小
view.on("double-click", ["Control"], function (event) {
if (curentState) event.stopPropagation();
//禁止移动地图
view.on("drag", function (event) {
if (curentState) event.stopPropagation();
// 禁止通过上下左右箭头移动地图
view.on("key-down", function (event) {
// prevents panning with the arrow keys
var keyPressed = event.key;
if (keyPressed.slice(0, 5) === "Arrow") {
if (curentState) event.stopPropagation();
//禁止Shift+拖拽拉框放大
view.on("drag", ["Shift"], function (event) {
if (curentState) event.stopPropagation();
//禁止Shift+Ctrl+拖拽拉框缩小
view.on("drag", ["Shift", "Control"], function (event) {
if (curentState) event.stopPropagation();