0 
var raphael = new Raphael(document.body,500,500);
raphael.setStart();
var d3_raphael = d3.raphael(raphael);
var stuff = {className:"", children:[
{className:"TVI",  packageName:'aa', value:2000},
{className:"SIC",  packageName:'aa', value:1520},
{className:"RTP1", packageName:'bb', value: 1400},
{className:"SIC",  packageName:'aa', value:1220},
{className:"RTP1", packageName:'bb', value: 1100},
{className:"SIC",  packageName:'aa', value:920},
{className:"RTP1", packageName:'bb', value: 800},
{className:"SIC",  packageName:'aa', value:1520},
{className:"RTP1", packageName:'bb', value: 1400},
{className:"SIC",  packageName:'aa', value:1220},
{className:"RTP1", packageName:'bb', value: 1100},
{className:"SIC",  packageName:'aa', value:920},
{className:"RTP2  manoj", packageName:'bb', value: 550}
]};

var r = 400,
format = d3.format(",d"),
fill = d3.scale.category10();

var bubble = d3.layout.pack()
.sort(function(a, b) {return b.value - a.value;})
.size([r, r]);

 var chart = d3_raphael.select("body").append("svg:svg")
.attr("width", r)
.attr("height", r)
.attr("class", "bubble");    
 var node = chart.selectAll("circle")
.data(bubble.nodes(stuff))
.enter().append("circle")
    .attr("class", "node")
    .attr("cx",function(d) { return d.x; })
    .attr("cy",function(d) { return d.y; })
    .attr("r", function(d) { return d.r; })
    .attr("fill", function(d) { return fill(d.packageName); })
    .mouseover(function() { 
    circle.append("<p>MouseOver</p>");
});

但这给了我错误 Uncaught TypeError: Object [object Array] has no method 'mouseover'。我想在它上面添加所有鼠标悬停事件

如何解决这个问题。

4

1 回答 1

0

在 d3 中执行此操作的方法是使用以下on()函数：

.on("mouseover", function() { 
    d3.select(this).append("<p>MouseOver</p>");
});

请注意，<p>标签在 SVG 中不起作用——但是您可以使用foreignObject. 例如，请参见此处。

于 2013-04-12T09:47:10.413 回答