设置Hcharts柱状图柱宽的几种方法

前言

最近本人在做一个后台系统，其中有大量使用图表绘制，使用的插件是Hcharts，正好遇到其中一个柱状图需要设置柱宽，所以今天就想和大家聊一聊这个Hcharts的柱宽如何设置以及设置技巧。

正文

Hcharts这款插件真的十分强大，对于自适应做的堪称完美，会自动根据分栏的数目进行X轴坐标倾斜，而其他的一些图表插件却鲜少有能做到或者考虑到的（比如E某之类的，就不详说了），大多需要去手动设置倾斜，同时在分栏数目过多的时候，Hcharts也会自动使你的柱宽缩小同时还保持柱与柱之间还有间距，但是当我们的分栏比较少，比如只有两列柱的时候，Hcharts的自适应就稍有些不美观了，他会变得。。这么宽。。。

当看到我的柱子变成这么宽的时候，我的第一意识是：设置柱宽，于是我找了官方API文档，找到了这个：

于是我就设置上去了，然后我的柱子变成了这样：

看样子好像解决了，但是，这里我又遇到了新问题：我的X轴是动态生成的，也就是说我的分栏不一定是两列，如果是60列会怎么显示呢：

就变成了这个样子，这交付给用户还不得被领导 n+1？这样是肯定不行的，于是我想，css有个max-width属性，咱们的Hcharts有没有类似的属性呢？还真有：

那么我设置一下最大为100再试试看：

OK，这样就好了嘛（图表数据为我ctrl+c/v的，所以是这么个样子），解决！

代码

上面说了效果，那么这里咱们就得说下代码怎么写啦。
其实这个API可以设置在两个地方（需要固定柱宽把代码中的maxPointWidth更换为pointWidth即可）：
1、你可以放在数据的series