我想在我的d3图表中添加toottip，但我无法这样做..任何帮助都会受到赞赏..
程序代码：
var w = 300;
var h = 250;
var r = h / 2;
var color = d3.scale.category20c();
var data = [{ "label": "1", "value": 64 },
{ "label": "2", "value": 1 },
{ "label": "3", "value": 19 },
{ "label": "4", "value": 17 },
{ "label": "5", "value": 1 }];
var tip = d3.tip()
.attr('class', 'd3-tip')
.offset([-10, 0])
.html(function (d) {
return "<strong>Frequency:</strong> <span style='color:red'>" + d.label + "</span>";
});
var vis = d3.select('#chart').append("svg:svg").data([data]).attr("width", w).attr("height", h).append("svg:g").attr("transform", "translate(" + r + "," + r + ")");
var pie = d3.layout.pie().value(function (d) { return d.value; });
var arc = d3.svg.arc().outerRadius(r);
var arcs = vis.selectAll("g.slice").data(pie).enter().append("svg:g").attr("class", "slice").on('mouseover', tip.show)
.on('mouseout', tip.hide);
arcs.append("svg:path")
.attr("fill", function (d, i) {
return color(i);
})
.attr("d", function (d) {
console.log(arc(d));
return arc(d);
});
arcs.append("svg:text").attr("transform", function (d) {
d.innerRadius = 0;
d.outerRadius = r;
return "translate(" + arc.centroid(d) + ")";
}).attr("text-anchor", "middle").text(function (d, i) {
return data[i].label;
}
);