Join us at FabCon Atlanta from March 16 - 20, 2026, for the ultimate Fabric, Power BI, AI and SQL community-led event. Save $200 with code FABCOMM.
Register now!The Power BI Data Visualization World Championships is back! It's time to submit your entry. Live now!
I tried adding text to the Sample Bar Chart code
bars.enter()
.append("text")
.classed("label",true) //or "label"
.attr ("y",d => yScale(<number>d.value)+1)
.attr ("x",d => xScale(d.category)+xScale.rangeBand()/2)
.attr("text-anchor", "middle")
// .attr("font-size", "10000000.5em")
.attr("fill", "red")
.text(d => <string>d.value)
;
The issue is this text do not move when I resize the chart
Solved! Go to Solution.
This solved the issue .
let text = this.barContainer.selectAll('.bar').data(viewModel.dataPoints);
text.enter()
.append('text')
.classed('bartext', true)
.text(d => <string>d.value2);
text.attr({
y: d => height - 15,
x: d => xScale(d.category) + xScale.rangeBand() / 2,
'text-anchor': "middle",
fill: "red"
});
This solved the issue .
let text = this.barContainer.selectAll('.bar').data(viewModel.dataPoints);
text.enter()
.append('text')
.classed('bartext', true)
.text(d => <string>d.value2);
text.attr({
y: d => height - 15,
x: d => xScale(d.category) + xScale.rangeBand() / 2,
'text-anchor': "middle",
fill: "red"
});
Glad to hear that you've solved this problem and thank you for sharing the solution. This might be beneficial to other community members, you could help mark it as answer.
| User | Count |
|---|---|
| 4 | |
| 3 | |
| 2 | |
| 1 | |
| 1 |