Azure Maps 如何禁用键盘快捷键？

Question

在我意识到按下删除或退格键盘按钮的同时 feature/shape（在我的例子中是 'Point'）在编辑模式下 selected 之前，这真的困扰了我很久由绘图管理器然后它实际上会删除它。我不能允许这种情况发生，否则每次我在编辑文本标签时按退格键然后最终删除它！

正如您在上图中看到的那样，我设计了一个自定义编辑控件表单，其中 feature/shape（在我的例子中是 'Point'）被 selected 然后用户可以编辑标题文本输入，标题会动态更新。但是他们一按键盘上的退格键，地图就认为我要删除它。

我需要能够禁用用于删除的键盘快捷方式，如果我想删除该功能，那么我会 select 删除按钮（带有 bin 图标的按钮）grrr 这太烦人了, 在 MS 文档中找不到任何解释如何禁用此键盘快捷键的内容？

https://docs.microsoft.com/en-us/azure/azure-maps/drawing-tools-interactions-keyboard-shortcuts#keyboard-shortcuts

Answer 1

好的，所以我想出了一个小技巧，虽然不理想，但效果很好！

我添加了几个函数，一个用于 mouseover 事件，一个用于 mouseout。将这些事件添加到文本输入并相应地触发，即如果用户要修改输入字段中的文本，则鼠标悬停事件处于活动状态，因此我们可以将绘图管理置于 'idle' 状态。将绘图管理器置于空闲状态会阻止不需要的键盘快捷键运行。

最后，一旦鼠标光标离开文本输入，我们就可以将绘图管理器恢复到编辑模式。

HTML 文本输入代码（'Title: input as shown in the screenshot from my original question）：

<div class=mb-2 mt-2">
    <label for="textLabelTitleInput" class="form-label-xs">Title</label>
    <input autocomplete="off" spellcheck="false" class="form-control form-control-xs" placeholder="Enter Name" id="textLabelTitleInput" oninput="updateTextLabelDesign()" onmouseover="textInputOnMouseOver()" onmouseout="textInputOnMouseOut()" />
</div>

JavaScript代码：

function textInputOnMouseOver() {
    updateDrawingMode('idle'); // See function 'updateDrawingMode'
}

function textInputOnMouseOut() {
    updateDrawingMode('edit-geometry'); // See function 'updateDrawingMode'
}

// Function called from above functions in the drawing control toolbar.
function updateDrawingMode(mode) {
    drawingManager.setOptions({
        mode: mode
    });
}

对于那些不熟悉绘图管理器选项的人，请在此处查看 MS 文档以获得更完整的图片：https://docs.microsoft.com/en-us/azure/azure-maps/set-drawing-options

Azure Maps 如何禁用键盘快捷键？

Azure Maps how to disable keyboard shortcuts?

azure-maps