在页面加载时加载d3js工具提示

Question

我有一个径向条形图，它使用工具提示在鼠标悬停时显示更多数据。我想设置页面以加载并显示特定栏的工具提示（可能是通过变量显示）。

我正在想像这样的事情：

.on("pageload", showToolTip(d.specificBarIndex)

我敢肯定这还没有结束，但只是想把这个想法传播出去。这是我创建工具提示的代码：

            // create a tooltip
            var Tooltip = d3.select("#my_dataviz")
                .append("div")
                .style("opacity", 0)
                .attr("class", "tooltip")
                .style("background-color", "none")
                .style("color", "white")
                .style("border-width", "2px")
                .style("border-radius", "5px")
                .style("padding", "5px")
                .style("position", "static")
                .style("z-index", "10")
                .style("width", "350px")
                //.style("min-height", "100px")
                .style("height", "150px")
                //.style("margin", "auto")
                .style("text-align", "left")

            // Three function that change the tooltip when user hover / move / leave a cell
            var mouseover = function(d) {
                if (d.source == "dummy")
                {}
                else 
                {
                    Tooltip
                    .style("opacity", 1)
                    d3.select(this)
                    .style("stroke", "white")
                    .style("opacity", 1)
                }   
            }
            var mousemove = function(d) {
                if (d.source == "dummy")
                {}
                else{
                    Tooltip
                    .html(d.dateAdded + "<br>"+"<strong>" 
                        + "DIVERGENCE:" + "</strong>" + "<br>" + d.headline
                        + "  " + "<a target='_blank' href=" + d.siteurl + ">" + "[source]" +"</a>")
                    .style("left", d + "px")
                    //.style("top", (d3.mouse(this)[1]) + "px")
                    //.style("left", (d3.event.pageX - 250) + "px")
                    .style("top", (d3.event.pageY - 10) + "px")
                }

            }
            var mouseleave = function(d) {
                if (d.source == "dummy")
                {}
                else{
                    Tooltip
                    //.style("opacity", 0)
                    d3.select(this)
                    .style("stroke", "none")
                    .style("opacity", 0.8)
                }

            }

这是将工具提示功能附加到图表的代码：

// Add bars
                svg.append("g")
                    .selectAll("path")
                    .data(data)
                    .enter()
                    .append("path")
                    .attr("fill", "#Black")
                    .attr("d", d3.arc()     
                        .innerRadius(innerRadius)
                        .outerRadius(function(d) { return y(d['radii']); })
                        .startAngle(function(d) { return x(d.indexKey); })
                        .endAngle(function(d) { return x(d.indexKey) + x.bandwidth() + .025; }) //Sets width of each bar
                        .padRadius(innerRadius))
                        .on("mouseover", mouseover)
                        .on("mousemove", mousemove)
                        .on("mouseleave", mouseleave)
                });

那么我该如何修改此代码以在页面加载时为特定栏显示单个工具提示？