ngx-charts-bar-vertical：当元素太多而没有绘制条形图时怎么办

Question

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

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

我复制了'issue'修改官方的例子（源数据在data.ts里面）：

n = 限制元素：plunkr (bars present)
n+1个元素：plunkr (bars gone)

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

如果没有，是否有一个 event/log/hook 我可以用来至少检测它正在发生并隐藏 chart/notify 用户？

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

由于 'plunkr must be accompanied 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"

Answer 2

您可以通过更改 barPadding （默认值：8） 和 groupPadding （默认值：16）的值来实现此目的.

参考： https://swimlane.gitbook.io/ngx-charts/examples/bar-charts/vertical-bar-chart

ngx-charts-bar-vertical：当元素太多而没有绘制条形图时怎么办

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

angular

ngx-charts