测试提了一个bug,说图表的标签名称显示不全
我一看,这个问题很简单吗,修改下高度不就行了!
我兴冲冲找到当前图表DIV的class,把height值从400px改为420px,改为一看,我擦,只是图表显示区变高了,标签文字区还是原样。
怎么办?哦,可能是margin-bottom的问题,从1rem改为2rem,再刷新一看,我擦,只是图表之间的距离变高了,标签区还是没变。
冷静下来思考下,嗯,这个图表是通过ECharts插件生成的,改样式没用,得改ECharts的配置。
于是我在JS文件中找到了坐标轴的通用配置项:
对照着API文档逐个看每个参数的意思。我改了nameGap的值,没用,因为是标签之间的距离的,改了interval的值,没用,因为是决定是否全部显示标签的。
这个JS文件是我们的开发人员自己写的,不是这一层的问题,那还需要继续深挖呀。肯定是ECharts插件本身的问题啊。
可是,ECharts插件我用起来都不熟练呢,我怎么能找到里面要改哪些东西!近3万行代码呀!!!
作为一个有抱负的程序员,肯定不能被这种bug吓倒啊。
于是,我打开QQ截图,测量了一下标签显示的高度,是60px
然后,我打开echarts.js插件的代码,在里面搜索‘60’这个数字,不多,共6处。
搜到bottom: 60这处时,心里一阵激动,应该就是它了,于是把60改为了80。
刷新一看,[BINGO!] 搞定!
热门评论
这种事我也干过。。。