解决echarts 坐标轴太长无法显示的问题
2017-05-25 11:50
447 查看
问题
可以很明显看出来,纵坐标的label太长了,label显示不全。解决方法一:
如果图的大小不固定,可以随意的话,可以利用这个图来解决。设置x的大小就行。解决方法二:
一般在实际应用中,会给图表分配规定的区间。这时,方法一就不太实用了,所以我们可以通过根据纵坐标的字数来换行达到全部显示的效果。在yAxis属性中添加如下代码即可。
axisLabel:{ interval: 0,//标签设置为全部显示 formatter:function(params){ var newParamsName = "";// 最终拼接成的字符串 var paramsNameNumber = params.length;// 实际标签的字数 var provideNumber = 4;// 每行能显示的字的个数 var rowNumber = Math.ceil(paramsNameNumber / provideNumber);// 换行的话,需要显示几行,向上取整 /** * 判断标签的个数是否大于规定的个数, 如果大于,则进行换行处理 如果不大于,即等于或小于,就返回原标签 */ // 条件等同于rowNumber>1 if (paramsNameNumber > provideNumber) { /** 循环每一行,p表示行 */ for (var p = 0; p < rowNumber; p++) { var tempStr = "";// 表示每一次截取的字符串 var start = p * provideNumber;// 开始截取的位置 var end = start + provideNumber;// 结束截取的位置 // 此处特殊处理最后一行的索引值 if (p == rowNumber - 1) { // 最后一次不换行 tempStr = params.substring(start, paramsNameNumber); } else { // 每一次拼接字符串并换行 tempStr = params.substring(start, end) + "\n"; } newParamsName += tempStr;// 最终拼成的字符串 } } else { // 将旧标签的值赋给新标签 newParamsName = params; } //将最终的字符串返回 return newParamsName } }
效果:
参考资料:http://www.cnblogs.com/redfull/p/6848271.html
相关文章推荐
- oracle中解决汉字无法显示、输入问题
- 浏览器无法显示某些网页或者提示脚本错误的问题解决
- 解决音量控制图标无法在任务栏显示的问题
- chm文件无法显示问题解决一法
- 解决ExtJS API documentation无法显示问题
- 解决IE新开窗口无法显示内容的问题
- 解决ani格式光标特效在2003系统无法显示的问题
- 文档库创建的子文件夹的URL显示为 http://[机器名]/.... 导致无法正常访问的问题解决办法
- 解决:Vista 系统中浏览网页速度慢或出现该页无法显示的问题
- Active Report for .net"在VS中正常显示在IIS中无法显示"的问题之解决办法
- 请问如何解决WORD转HTML是出现的“内存或磁盘空间不足,无法显示或打印图片”这个问题?
- NET中"无法显示 XML 页。 使用 XSL 样式表无法查看 XML 输入。"问题的解决
- ASP.NET2.0中"无法显示 XML 页。 使用 XSL 样式表无法查看 XML 输入。"问题的解决
- IE浏览器无法显示背景,字体显示很大问题的解决办法[转]
- 解决 fedora 5 root 用户 vi 无法高亮显示问题
- userControls中文无法在WSS上显示的问题解决了
- 解决无法按y轴显示的问题!
- 完美解决无法无法显示隐藏文件的问题(svohost.exe xsx.exe)
- 如何解决Silverlight集成到IIS无法显示页面问题
- 在网页内无法显示Flash的问题的解决方法