d3はコンテキストメニューのmouseoutの発射を防ぎます

Question

私はextjsパネルでsvgを作成しました.SVG要素を右クリックすると、mouseoverイベントも発生しますが、これはsvgを変更しますが、私はsvg elemntを右クリック.SOでは、以前のsvgを、変更されたイメージではなくイメージに書き出すことができます。ここで

は私のサンプルコードパネルの身体のコンテキストメニューに

var path = this.svg.selectAll("path") 
     .data(partition.nodes(dataset)) 
     .enter().append("path") 
     .attr("d", arc) 
     .style("stroke","#fff") 
     .style("stroke-width","1px")   
     .attr("fill-rule", "evenodd") 
     .style("fill", function(d) { 
      return d.parent? getCurrColor(d) : "#FFFFFF"; 
     }) 
     .on("click", click) 
     .on("mouseover", function(d) { return mouseover(d, this);}) 
     .on("mousemove", function(d) { return mousemove(d, this);}) 
     .on("mouseout", function(d){ return mouseout(d, this);}); 

であるあなたは、右クリックイベントのXY位置でコンテキストメニューを作成する場合、これはコード

this.body.on('contextmenu', this.optionsMenu,this); 

optionsMenu:function{ 
    var me = this; 
    var xyArr = eventObject.getXY(); 
    eventObject.stopEvent(); 
    eventObject.preventDefault(); 
    var menuItems=[]; 

    var emailItem = { 
      text:'Save as image', 
      scope:this, 
      handler:function(){ 
       //save as image 
      },   
    }; 

    menuItems.push(emailItem); 

    var menu = new Ext.menu.Menu({ 
       items : menuItems 
    });  

     menu.showAt(eventObject.getXY()); 
} 

Answer 1

あり、マウスポインタのターゲットを新しいメニュー項目に移動します。この結果、SVGのmouseoutイベントが発生します。

この問題の解決策は、mouseoverとmouseoutリスナーの代わりにmouseenterとmouseleaveリスナーを使用することです。