Forum Discussion
Solved
Custom Visuals- How to move text when resizing chart
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
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" });
2 Replies
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.
