Question

我在这里显示了条形图的数量。但是当条形数据集中的值为0时，它将显示0并中断y标签。我想适当地显示值，并且只有当它不为零时才显示。值不应该与轴混乱。我怎么能这样做？

这是工作小提琴 https://jsfiddle.net/84hp8m6p/1/

这是我用来附加文字的内容

    groups.selectAll('.bartext')
   .data(function(d) {
   return d;
   })
   .enter()
   .append("text")
   .attr("class", "bartext")
   .attr("text-anchor", "end")
   .attr("fill", "black")
   .attr('x', function(d) {
   return xScale(d.x0) + xScale(d.x);
   })
  .attr('y', function(d, i) {
   return yScale(d.y) + yScale.rangeBand() / 2;
   })
  .text(function(d) {
   return d.x;
   });

Answer 1

使用ternary operator仅显示大于零的值（或任何其他值）：

.text(function(d) {
    return (d.x > 0) ? d.x : "";
});

这是您更新的小提琴：https://jsfiddle.net/1gx3kcz4/

如何以更好的方式显示计数？

1 个答案: