如何区分单击鼠标并双击d3 js中的同一节点元素

Question

需要进行两次不同的操作，一次点击，另一次点击双击。单击即可工作，但双击即可进行单击功能，然后再点击功能。单击双击功能时双击点击发生或如何捕获事件类型单或双..请帮助!!!

根据示例，我使用如下所示..这是正确的方法吗？

                     var nodeEnter = node.enter()
                    .append("g")
                    .attr("class","node")
                    .attr("transform", function(d) {
                        return "translate(" + source.x0 + "," + (-(source.y0)) + ")";
                    }).on('click', click);






                                 function click{
                                  var cc = clickcancel();
                                cc.on('click', function() {

                           addDetailsDiv(d.id, d.name, d.type);
                }); 

                      cc.on('dblclick', function() {
                    dblclick();
                });

Answer 1

someSelection
    ...
    .on("click", foo)
    .on("dblclick", bar)

Answer 2

我遇到了同样的问题，我找到了一个至少适用于API的v3的解决方案。解决方案的要点是捕获鼠标向上/向下鼠标，如果第二次鼠标点击在特定时间（在这种情况下为300毫秒）之前到达，则发出dblclick事件，否则click事件将发出：

d3Utils.js

const d3 = require('d3')

module.exports = {
  // Get a function that dispatches 'click' and 'dblclick' events for a D3 selection
  getClickDispatcher: () => {
    const clickEvent = d3.dispatch('click', 'dblclick')

    return d3.rebind((selection) => {
      let waitForDouble = null

      // Register click handler on selection, that issues click and dblclick as appropriate
      selection.on('click', (projectProxy) => {
        d3.event.preventDefault()
        if (waitForDouble != null) {
          clearTimeout(waitForDouble)
          waitForDouble = null
          clickEvent.dblclick(d3.event, projectProxy)
        } else {
          const currentEvent = d3.event
          waitForDouble = setTimeout(() => {
            clickEvent.click(currentEvent, projectProxy)
            waitForDouble = null
          }, 300)
        }
      }
    })
  }, clickEvent, 'on')
},

}

index.js

const {getClickDispatcher,} = require('./d3Utils')

const clickDispatcher = getClickDispatcher()
  .on('click', () => {
    console.log('A single click was detected')
  })
  .on('dblclick', () => {
    console.log('A double click was detected')
  })

// Hook up clickDispatcher
d3.select('.node')
  .call(clickDispatcher)