javascript - 如何检测双击画笔对象？

我正在尝试在d3画笔对象上添加双击事件。
但是我不太确定该怎么做。

我试图在画笔对象中添加.on（“ dblclick”，functionName），如下所示：

MyGroup.append("g")
             .attr("class", "viewWindow")
             .call(viewPort)
             .selectAll("rect")
             .style("fill", "#fff3b7")
             .style("fill-opacity", 0.5)
             .attr("height", miniHeight)
             .attr("id", "viewWindow")
             .on("dblclick", brushExpand);

但是，它不起作用。双击事件未触发。
如何在画笔对象中添加doubleclik事件？

谢谢。

最佳答案

而不是在#viewWindow上附加像这样的doubleclick：

.attr("id", "viewWindow")
.on("dblclick", function() {
     d3.select("#viewWindow").attr("fill", "red")
 });

似乎双击无法正常工作，我相信d3会覆盖双击（这就是我们未得到事件的原因）。
因此，我正在使用另一种方法来捕获双击。

//declare variable
var click = false;
d3.selectAll("#viewWindow").on("mousedown", function() {
  if(click){//if true then double click
    console.log("double click");
    //do what you want to do in double click
    d3.selectAll("#viewWindow").attr("fill", "red");
    //set flag to false
    click=false;
  } else {
    //timeout to reset the flag after 500 milliseconds of 1st mouse down.
    setTimeout(function(){click=false;}, 500);
  }
  click = !click;
})

工作提琴here

希望这可以帮助！

关于javascript - 如何检测双击画笔对象？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35620462/