Share feedback directly with Fabric product managers, participate in targeted research studies and influence the Fabric roadmap.
Sign up nowGet Fabric certified for FREE! Don't miss your chance! Learn more
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.
Share feedback directly with Fabric product managers, participate in targeted research studies and influence the Fabric roadmap.
| User | Count |
|---|---|
| 3 | |
| 2 | |
| 2 | |
| 1 | |
| 1 |
| User | Count |
|---|---|
| 5 | |
| 4 | |
| 3 | |
| 3 | |
| 2 |