vis---network常用事件

vis network常用事件包括

事件	描述
click	单击鼠标触发
doubleClick	双击鼠标触发
hold	单击并按住鼠标触发
oncontext	鼠标右键单击触发
hoverNode	鼠标悬停在节点上触发
hoverEdge	鼠标悬停在边上触发
blurNode	鼠标从之前悬停的节点移开触发
blurEdge	鼠标从之前悬停的边移开触发
dragStart	开始拖动时触发
dragging	正在拖动节点（多个节点）或视图时触发
dragEnd	结束拖动时触发
controlNodeDragging	拖动控制节点时触发
zoom	放大或缩小视图时触发

1.单击鼠标事件

 this.network.on("click", (e) => {
        // 使用定时器解决单击双击冲突  && 假前真后
        timer && clearTimeout(timer);
        // 双击鼠标时，单击事件仍会执行两次
        console.log("timer1=", timer);
        timer = window.setTimeout(() => {
          //延时300毫秒执行以下代码-单击事件具体操作
          console.log("单击鼠标", e);
        }, 300);
      });

2.双击鼠标事件

  this.network.on("doubleClick", (e) => {
        console.log("timer2=", timer);
        // 清除已设置的Timeout，避免触发单击事件。
        window.clearTimeout(timer);
        // 执行双击事件具体操作
        console.log("双击鼠标", e);
      });

3.长按鼠标事件

this.network.on("hold", (e) => {
        // 清除已设置的Timeout，避免触发单击事件。
        window.clearTimeout(timer);
        console.log("长按鼠标", e);
      });

4. 右击鼠标事件

  this.network.on("oncontext", (e) => {
        console.log("右击鼠标", e);
      });

5. 鼠标移入/移出事件

 // 鼠标移入节点事件
      this.network.on("hoverNode", (e) => {
        console.log("鼠标移入节点", e.node);
        console.log("dom id=", e.event.path[2].id);
      });
      // 鼠标移入边线事件
      this.network.on("hoverEdge", (e) => {
        console.log("鼠标移入边线", e.edge);
      });
      // 鼠标移出节点事件
      this.network.on("blurNode", (e) => {
        console.log("鼠标移出节点", e.node);
      });
      // 鼠标移出边线事件
      this.network.on("blurEdge", (e) => {
        console.log("鼠标移出边线", e.edge);
      });

6.鼠标拖动

 //  鼠标拖动开始事件
      this.network.on("dragStart", (e) => {
        console.log("拖动开始", e);
      });
      //  鼠标拖动结束事件
      this.network.on("dragEnd", (e) => {
        console.log("拖动结束", e);
      });
      //  鼠标拖动中事件
      this.network.on("dragStart", (e) => {
        console.log("拖动中", e);
      });
      //  鼠标控制节点拖动中事件
      this.network.on("controlNodeDragging", (e) => {
        console.log("控制节点拖动中", e);
      });

7.鼠标缩放事件

 this.network.on("zoom", (e) => {
        console.log("缩放", e);
      });