当鼠标超过/离开节点时,我有这些调用
.on("mouseover", highlightImage)
.on("mouseout", unhighlightImage)
.on("mouseover", showTextToolTip)
.on("mouseout", hideTextToolTip)
现在,由于javascript是异步读取的,因此只调用了底部的两个函数。我环顾四周,发现了几个例子:
.on("mouseover", "highlightImage(); showTextToolTip()") //- doesnt work
.on("mouseover", mouseOverFunctions) //- calls a function>
function mouseOverFunctions(){
showTextToolTip();
highlightImage();
} //- also doesnt work.
我认为这是因为"鼠标悬停"一次只能调用一个对象。
如何同时调用两个函数?我希望显示文本并突出显示节点
添加的代码
function showTextToolTip(d){
if(textButtonPressed==false){
d3.select(this).append("text")
.attr("dx", "2")
.attr("dy", "-24")
.style("text-anchor", "start")
.text(function(d) { return d.identifier; });
showToolTip="true";
}}
function highlightImage(d){
d3.select(this).classed("highlighted", true);
highlightedNode = d.coreId;
//console.log("Highlighted node : " + highlightedNode);
}
定义一个匿名函数来调用它们:
.on("mouseover", function(d) {
highlightImage(d);
showTextToolTip(d);
});
同样适用于mouseout
.
如果在处理程序函数中引用this
,则需要使用不同的方法来调用函数以确保正确传递:
.on("mouseover", function(d) {
highlightImage.call(this, d);
showTextToolTip.call(this, d);
});