echarts 自定义柱状图 可隐藏为0的数据

之前遇到过这2种情况，

1.在数据项的值是0时，柱状图虽然不会显示，但是还是会占一个位子。

2.如果数据项的种类不一样的话，也会导致有空位。比如：2012年有分类1、2、3，但是2013年却有分类1、3、4。这种情况也会导致有空位子的出现。

这个时候，用echarts自带的 bar 是不太好用的。

可以用echarts的自定义柱状图来优化一下，做到隐藏为0的数据，以及数据项种类不一致时隐藏空白位置。

就像下面的效果图。

话不多说，直接上代码。

自定义渐变色以后

源代码在网盘，两个demo，个人觉得echart_custom.vue比较好，

链接：https://pan.baidu.com/s/1QRN753EicgpmROQFoaTYZA

提取码：wpda

链接：https://pan.baidu.com/s/1lrS1GUjAJPvrD0kErNevdg

提取码：3g0p

补充：1，竖着显示柱状图上的文字

2.自定义悬浮框的显示内容

显示效果如下：