绘图的时候可能会遇到要实现显示“图例”和“小工具”,而他们的默认位置是在右上角显示,如图
调整他们的位置
图例和小工具都可以调整位置
legend】
第一种是方向:上下左右四个方位都可以直接赋值,它们的值可以是数字也可以是百分比,其中数字代表的是距离该方向的长度,单位是PX;百分比是距离该方向占整体的百分之多少;第二种方式是坐标轴:X和Y都可以赋值,它们的值可以是'left','right','center':代表左中右三个位置;也可以为数字,含义是坐标,单位是PX
下面我们使用第一种方式来实现位置的调整
legend: {
orient: 'vertical', /* 设置位置的垂直方向 */
right: 65,
top: 20,
data:['五月','六月']
},
现在的效果是图例的位置向左了一点,和小工具就不在一起了
2.小工具【toolbox】
直接在“小工具”里配置属性就好,方式和“图例”的一致,在此我就不重复了,可参考上面的解说,另外,因为上面是用的第一种配置方式:方向,那么我们这里就用第二种:坐标轴
下面我们使用第二种方式来实现位置的调整
toolbox : {
show : true,
feature : {
saveAsImage : {
show : true,
pixelRatio : 1
}
},
x:950,
},
现在的效果图是两个互不干扰,都能清楚的显示自己要表达的东西
不过好像有点挤或者丑,那么可以再调整一下“图例”的方向,我们只要把修饰方向的属性去掉就好
legend: {
/* orient: 'vertical',设置位置的垂直方向 */
right: 65,
top: 20,
data:['五月','六月']
},
默认水平显示,现在就好多了