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

Question

使用ngx-charts，特别是垂直条形图，我发现元素的限制不会显示条形。

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

我复制了修改官方示例的'问题'（源数据在data.ts内部）：

• n =限制元素：plunkr（存在条形）
• n + 1个元素：plunkr（不见了）

我的问题是：有没有办法阻止这种情况，例如在需要时添加滚动条，还是更好？

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

值得注意的是，当条形消失时，它们的g> g>路径节点从DOM中消失。

我也在这里粘贴它的角度模板代码，因为'plunkr必须伴随代码'限制，也许它会有所帮助：

<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