从jQuery触发D3点击

Question

我有一个d3元素，在d3本身中绑定了click事件。 在div上执行某些操作（单击/悬停）时，是否可以触发d3单击事件？

这是我尝试过的

 var vis = d3.select(".container").append("svg") .attr("width", "250") .attr("height", "100"); var nodeEnter = vis.append("g") .attr("class", "node") .attr("nodeid","1") .on("click", function() { console.log("hit"); }); nodeEnter.append("circle") .attr("r", "10") .attr("cx", "10") .attr("cy", "10"); $( document ).ready(function() { $("#sample-div").mouseenter( function(){ //trigger d3 click here d3.select( "[nodeid='1']")[0].click; } ).mouseleave( function(){ console.log("mouse-out"); } ); }); 

 #sample-div { height:20px; width:100px; background:#ccc; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script> <div class="container"> </div> <div id="sample-div"> Hover here </div> 

Answer 1

直接调用点击功能

var nodeEnter = vis.append("g")
  .attr("class", "node")
  .attr("nodeid","1")
  .on("click", performClick);


function performClick(k){
  if(!k)
      k = d3.select(this);
    console.log( k, "asdas");
}

在Jquery鼠标事件侦听器内部，调用performClick函数：

$( document ).ready(function() {
   $("#sample-div").mouseenter( function(){
     performClick(d3.select( "[nodeid='1']"))
     //trigger d3 click here

     //d3.select( "[nodeid='1']")[0].click;  

   } ).mouseleave( function(){
   console.log("mouse-out");
   } );
});

这里的工作代码