echarts常见问题

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xukongjing1/article/details/71086084

1.bar图x轴显示数值,y轴显示文本

正常的x轴显示文本,y轴显示数值,xAxis中的type为category,存放文本的data数组放在yAxis中,
而y轴显示文本,x轴显示数值,只需要将xAxis中的type改为value,yAxis中的type改为category,data数组放在yAxis中。
        xAxis : [  
            {  
                type : 'value',  
            }  
        ],  
        yAxis : [  
            {  
                type : 'category',
		data : ["科员","副科级","中华人民共和国正科级","副处级","处级"],
            }  
        ],  
这种情况下如果文本太长显示不全,可将y轴向右移动,使文本可显示的区域变大,调整grid的x属性(x,y为echarts图左上角那个点,x2,y2为右下角那个点)
	grid:{
		x:150,
	},


2.去掉饼图外面的圆环

pie图外面有个圆环,有时感觉不好看想去掉,将calculable配置项删除或赋值为false均可。

下面这个图是官网的带圆环的图。

3.x轴文本太长显示不全

修改xAxis,axisLabel下的rotate值,旋转文字的显示方向,若还是显示不下,调整grid的y2配置项,使echarts右下角绘制的原点向上移。


4.tooltip显示的特别大

类似下图这种情况,这种情况是将这个echarts图所在的div的宽高样式写在了css文件或页面head部分的style样式中了,解决方法是将div的样式直接写成内联样式(将其它地方这个div对应的样式里面的宽高去掉),如 <div id="echarts1" style="width:50%;height:300px;"></div>


阅读更多
换一批

没有更多推荐了,返回首页