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 に答える