如何用鼠标悬停更改图像与d3.js

我有一些svg圈子和图像，用d3.js生成。我想在鼠标悬停而不是工具提示上更改图像。如何用鼠标悬停更改图像与d3.js

mask.append("image") 
    .attr('class', "sth") 
    .attr('x',-(entry.childNodes[0].getAttribute("r"))-40) 
    .attr('y',-(entry.childNodes[0].getAttribute("r"))-40) 
    .attr('width', 80+entry.childNodes[0].getAttribute("r")*2) 
    .attr('height', 80+entry.childNodes[0].getAttribute("r")*2) 
    .attr("transform", entry.childNodes[0].getAttribute("transform")) 
    .attr('clip-path', 'url(#'+('clip'+clipPathId)+')') 
    .attr("xlink:href", imageUrl) 
    .on("click", function(d) { 
      zoom(d);       
      d3.event.stopPropagation(); 
    }) 
    .on("mouseover", function(d){ d.attr("xlink:href", "img/001.jpg"); tooltip.style("visibility", "visible"); tooltip.html("<img src='"+imageUrl+"'/>"); }) 
    .on("mousemove", function(){ tooltip.style("top", (d3.event.pageY-10)+"px").style("left",(d3.event.pageX+10)+"px"); }) 
    .on("mouseout", function(){ tooltip.style("visibility", "hidden"); }); 
        ;

来源

2014-12-29 Rok Zupančič

可能重复的[如何更改鼠标滚动（悬停）的图像]（http://stackoverflow.com/questions/5220014/how-改变图像img的鼠标滚动悬停） –

不，我想用js来做，因为下一步是鼠标悬停时自动旋转图像阵列。 –

我收到错误：Uncaught TypeError：无法读取未定义的属性'attr' –

d是绑定到节点的数据元素。 this是节点本身：

尝试：

.on("mouseover", function(d){ 
    d3.select(this).attr("xlink:href", "img/001.jpg"); 
})

的

来源

2014-12-29 16:34:52 Mark

如何用鼠标悬停更改图像与d3.js

回答

相关问题