Javascript 调整d3水平堆叠条内的文字

实际上，我正在尝试制作一个水平堆叠的条，每个条上都有文本。我可以在每个栏上找到文本，但有一个问题。有些条非常小，文本不适合它们。如何使文本仅显示在文本可以容纳的栏上，或使栏足够大以容纳文本

用于将文本宽度与条形图的宽度进行比较：

const text = svg.selectAll('g')
  .append("text")
  ...
  .text(d => `${d['percent']} %`);
  
text.each(function(d) {
  const isFullyVisible = this.getBBox().width < xScale(d[1]) - xScale(d[0]);
  d3.select(this).style('visibility', isFullyVisible ? 'visible' : 'hidden');
});

const text=svg.selectAll（'g'））
.append（“文本”）
...
.text（d=>`d['percent']}%`）；
文本。每个功能（d）{
const isFullyVisible=this.getBBox（）.width

const text = svg.selectAll('g')
  .append("text")
  ...
  .text(d => `${d['percent']} %`);
  
text.each(function(d) {
  const isFullyVisible = this.getBBox().width < xScale(d[1]) - xScale(d[0]);
  d3.select(this).style('visibility', isFullyVisible ? 'visible' : 'hidden');
});