Svg 确定d3轴中文本标签的坐标

我很难确定svg文本元素的边界框的起始坐标，该元素对应于D3.js有序x轴的标签

根据当前代码，文本标签DOM节点x属性的值为0。但是，标签文本会被翻译。因此，我将使用svg.selectAll（“g.x.axis g.tick.major”）.attr（“transform”）来确定标签元素的转换属性。我想我可以收集那些返回值的信息。有没有更简单的方法

下面是代码中的一个DOM元素示例

<g class="tick major" transform="translate(73.33333333333333,0)" style="opacity: 1;"><line y2="6" x2="0">
    <line y2="6" x2="0"></line>
    <text y="9" x="0" dy=".71em" style="text-anchor: middle;">banana</text>
</g>

---

如果

svg.selectAll（“g.x.axis g.tick.major”）.attr（“transform”）

返回

g

元素的位置，看起来就足够简单了。不知怎的，这对你不管用吗？你想达到什么目的？如果你读了我的帖子，你会发现我已经说过了。我希望通过收集x和y坐标以及边界框大小来动态确定文本标签是否存在重叠，这样我就可以用一组大小写来确定标签的位置。我读了你的文章，我知道你说过这一点。我在发表意见。

var margin = {top: 100, right: 100, bottom: 100, left: 100},
    width = 310 - margin.left - margin.right,
    height = 200 - margin.top - margin.bottom;

var x = d3.scale.ordinal()
    .domain(["apple", "orange", "banana", "grapefruit"])
    .rangePoints([0, width]);

var xAxis = d3.svg.axis()
    .scale(x)
    .orient("bottom");

var svg = d3.select("body")
    .append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)   
        .append("g")
        .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

svg.append("g")
    .attr("class", "x axis")
    .call(xAxis); 

console.log(svg.selectAll("g.x.axis g.tick.major")
    .attr("transform"))