时间戳

首页 > 解决方案 > mxgraph：我想添加一个按钮来禁用/启用图形和工具栏

javascript - mxgraph：我想添加一个按钮来禁用/启用图形和工具栏

问题描述

我试图通过不允许图形上的单元格使用以下代码来禁用图形。 graph.setCellsSelectable(false); 但它不起作用，仍然可以选择单元格，（仅禁用调整大小）

对于要禁用的工具栏，我尝试删除或替换 ondrag 事件，对吗？理论上，我认为 mxgraph 有自己的用于拖动工具栏项的事件处理程序。

mx_toolbar.appendChild(
    mxUtils.button("Disable/Enable", function() {
         document.querySelectorAll('.toolbar > button').addEventListener(function (e) {
             e.preventDefault()
             return false;
         });
    }
)

希望你的帮助。我不介意，只要它是有效的解决方案。谢谢

标签： javascripthtmlcssmxgraph

解决方案

您可以简单地将要禁用的区域与 css 一起覆盖，而不是删除或修改事件处理程序。

      var toolbarContainer = document.querySelector(".toolbar");
      var overlay = document.querySelector(".toolbar-overlay")

      if (!overlay) {
        overlay = document.createElement('div')
        overlay.className = 'toolbar-overlay'
        toolbarContainer.appendChild(overlay)
      } else {        
        overlay.parentNode.removeChild(overlay)
      }

这是覆盖 div 的 css


.toolbar-overlay {
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  opacity: 0.4;
  background: #e1e1e1;
}
  • 注意：您应该确保覆盖 div 的父 div 必须定位为相对才能使这个 css 工作！

推荐阅读