使用ngx-charts,特别是垂直条形图,我发现元素的限制不会显示条形。
我认为限制与图表的可用宽度和元素数量有关,当然这是有道理的。
我复制了修改官方示例的'问题'(源数据在data.ts内部):
我的问题是:有没有办法阻止这种情况,例如在需要时添加滚动条,还是更好?
如果没有,是否有一个事件/日志/挂钩我可以用来至少检测到它正在发生并隐藏图表/通知用户?
值得注意的是,当条形消失时,它们的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>
答案 0 :(得分:1)
您可以使用barPadding
输入来设置条之间的填充(以像素为单位)
示例:
[barPadding] =“ 2”
答案 1 :(得分:0)
您可以通过更改barPadding
(默认值:8)和groupPadding
(默认值:16)的值来实现。
参考: https://swimlane.gitbook.io/ngx-charts/examples/bar-charts/vertical-bar-chart