Jak prawidłowo uzyskać szerokość tekstu do środka etykiet powyżej pasków wykresu?

Obecnie mam wykres, z którym powiązane są wartości słupków wyświetlane nad każdym paskiem, ale mam problem z centrowaniem etykiet wartości, ponieważ nie można pobrać szerokości każdego elementu tekstu.

Tak właśnie rysuje mój wykres:

Wszystko, co muszę zrobić, to odjąć połowę szerokości każdego elementu tekstowego, ale nie mogę tego zrobić za pomocą następującego Coffeescript:

    #Drawing value labels   
    svg.selectAll("rect")
        .data(data)
        .enter()
        .append("text")
        .text((d)-> d.Total)
        .attr("width", x.rangeBand())
        .attr("x", (d)->
            textWidth = d3.selectAll("text").attr("width")

            x(d.Year) + (x.rangeBand() / 2) - (textWidth / 2)
        )
        .attr("y", (d)-> y(d.Total) - 5)
        .attr("font-size", "10px")
        .attr("font-family", "sans-serif")

    #Drawing bars       
    svg.selectAll("rect")
        .data(data)
        .enter().append("rect")
        .attr("class", "bar")
        .attr("x", (d)-> x(d.Year))
        .attr("width", x.rangeBand())
        .attr("y", (d)-> y(d.Total))
        .attr("height", (d)-> height - y(d.Total))

Czy istnieje sposób, aby uzyskać dostęp do atrybutu szerokości każdego elementu tekstowego, aby ustawić wartość przesunięcia?

questionAnswers(2)

yourAnswerToTheQuestion