您好,欢迎来到纷纭教育。
搜索
您的当前位置:首页highcharts图表的图例legend怎么改变显示位置

highcharts图表的图例legend怎么改变显示位置

来源:纷纭教育

一、将图例Legend放于图表右侧
1、设置chart的marginRight属性值:
chart: {
  marginRight: 120
}
2、设置legend图例属性值如下

legend: {
  align: 'right', //水平方向位置
  verticalAlign: 'top', //垂直方向位置
  x: 0, //距离x轴的距离
  y: 100 //距离Y轴的距离
}

3、效果图:

 

二、将图例放于图表左上角
1、设置legend的属性
legend: {
  align: 'left', //水平方向位置
  verticalAlign: 'top', //垂直方向位置
  x: 0, //距离x轴的距离
  y: 0 //距离Y轴的距离
}

2、效果图:

三、将图例放于图表上方
1、设置legend属性如下
legend: {
  align: 'center', //水平方向位置
  verticalAlign: 'top', //垂直方向位置
  x: 0, //距离x轴的距离
  y: 20 //距离Y轴的距离
}
2、效果图如下:

四、将图例放于下方
1、设置legend属性如下
legend: {
  align: 'center', //水平方向位置
  verticalAlign: 'bottom', //垂直方向位置
  x: 0, //距离x轴的距离
  y: 0 //距离Y轴的距离
},
2、效果图如下:

参考网址:

转载于:https://www.cnblogs.com/h07061108/p/highcharts_legend.html

因篇幅问题不能全部显示,请点此查看更多更全内容

Copyright © 2019- fenyunshixun.cn 版权所有 湘ICP备2023022495号-9

违法及侵权请联系:TEL:199 18 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务