使用D3.js對元素加入提示框敌土，分為以下兩種提示框，一種為title標簽，一種為自定義樣式的提示框：
title框
var path = svg.datum(root).selectAll("path")
.data(partition.nodes)
.enter().append("path")
.attr("display", function(d) { return d.depth ? null : "none"; }) // hide inner ring
.attr("d", arc)
.style("stroke", "#fff")
.style("fill", function(d) { return color((d.children ? d : d.parent).name); })
.style("fill-rule", "evenodd")
.append("title")//此處加入title標簽
.text(function(d){return d.name}//title標簽的文字
自定義框
JS:加入提示框的div然爆，并將其opacity設(shè)為0斤吐，這樣提示框就會看不到搔涝。
var tooltip=d3.select("body")
.append("div")
.attr("class","tooltip")
.style("opacity",0.0);
CSS：toolafter為提示框左上角的小箭頭，可不加
.tooltip{
position:absolute;
padding:5px;
width:120;
height:auto;
font-family:simsun;
font-size:14px;
color:black;
background-color: rgb(255,255,255);
border-width: 2px solid rgb(255,255,255);
border-radius:5px;
}
.tooltip:after{
content: '';
position:absolute;
bottom:100%;
left:20%;
margin-left: -8px;
width:0;
height:0;
border-bottom:12px solid rgb(255,255,255);
border-right:12px solid transparent;
border-left:12px solid transparent;
}
使用：在對元素應(yīng)用提示框時和措，需要將其定位到鼠標附近庄呈，并且將其opacity設(shè)為1以顯示提示框。鼠標移開時派阱，將其opacity設(shè)為0.
gridrect.on("mouseover",function (d) {
var t=parseInt(threshold(d[2]).substring(1,2));
if(t>0) {
tooltip
.html(" x: " +d[0]+"<br/>"+" y: "+d[1]+"<br/>"+" 端口號： "+(256 * d[1] + d[0])+"<br/>"+" 連接次數(shù)： "+d[2])
.style("left",(d3.event.pageX) +"px")
.style("top",(d3.event.pageY +20)+"px")
.style("opacity",1.0)
}
})
.on("mouseout",function (d) {
tooltip.style("opacity",0.0);
});
`
