angular - ngx-charts-bar-垂直 : what to do when there are too many elements and bars are not drew

Question

使用 ngx-charts，尤其是垂直条形图，我发现有一个元素限制，超过该限制不会显示条形图。

我认为该限制与图表的可用宽度和元素数量有关，这当然是有道理的。

我复制了'问题'修改官方示例(源数据在data.ts中):

• n = 限制元素:plunkr (现在的酒吧)
• n+1 个元素:plunkr (酒吧不见了)

我的问题是:是否有办法防止这种情况发生，比如在需要时添加滚动条，或者更好？

如果没有，是否有事件/日志/ Hook 我可以用来至少检测它正在发生并隐藏图表/通知用户？

有趣的是，当条形消失时，它们的 g > 路径节点也会从 DOM 中消失。

由于'plunkr must be companyed by code'限制，我也在这里粘贴它的 Angular 模板代码，也许它有帮助:

<ngx-charts-bar-vertical
  [view]="view"
  [scheme]="colorScheme"
  [results]="single"
  [gradient]="gradient"
  [xAxis]="showXAxis"
  [yAxis]="showYAxis"
  [legend]="showLegend"
  [showXAxisLabel]="showXAxisLabel"
  [showYAxisLabel]="showYAxisLabel"
  [xAxisLabel]="xAxisLabel"
  [yAxisLabel]="yAxisLabel"
  (select)="onSelect($event)">
</ngx-charts-bar-vertical>

Answer 1

您可以使用 barPadding 输入来设置条之间的填充(以像素为单位)示例:

[barPadding]="2"