在echarts中图例legend和坐标系grid实现左右布局实例

 更新时间:2020年05月16日 15:07:15   作者:木雷双雄7  
这篇文章主要介绍了在echarts中图例legend和坐标系grid实现左右布局实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

1、效果图

2、实现方法

将图例legend纵向排列(orient: 'vertical'),宽度给150(width: 150),坐标系grid左侧距离200(left: 200),中间有50的边距

3、代码展示

grid: {
 left: 200
},
legend: {
    x: 'left',
    data: ['送风温度', '混风温度', '冷冻水送水温度', '冷冻水回水温度', '热水送水温度', '热水回水温度', '送风温度设定点', '风机速度','风机速度反馈','风阀开度'],
 inactiveColor: '#999',
 selectedMode: 'single',
 orient: 'vertical',
 width: 150,
 top: 50,
 borderWidth: 2,
 borderColor: 'blue',
 textStyle: {
 color: '#000'
 }
}

补充知识:Echarts中legend图例太多与title重叠问题

问题:由于legend图例太多导致与title的文字重叠

方法:像legend.data[i]中添加特殊字符串'',实现图里的换行

代码:加粗加下划线部分

legend: {
 x: 'left',
 data: ['送风温度', '回风温度', '室外温度', '室外湿度', '', '室内1温度', '室内1湿度', '室内2温度', '室内2湿度'],
 inactiveColor: '#999',
 selectedMode: 'single'
 }

以上这篇在echarts中图例legend和坐标系grid实现左右布局实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • 利用python写api接口实战指南

    利用python写api接口实战指南

    api接口在我们开发中的重要性相信大家都这篇文章主要给大家介绍了关于利用python写api接口实战的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-05-05
  • Python实现的径向基(RBF)神经网络示例

    Python实现的径向基(RBF)神经网络示例

    这篇文章主要介绍了Python实现的径向基(RBF)神经网络,结合完整实例形式分析了Python径向基(RBF)神经网络定义与实现技巧,需要的朋友可以参考下
    2018-02-02
  • python利用tkinter实现屏保

    python利用tkinter实现屏保

    这篇文章主要为大家详细介绍了python利用tkinter实现屏保,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-07-07
  • pandas DataFrame 交集并集补集的实现

    pandas DataFrame 交集并集补集的实现

    这篇文章主要介绍了pandas DataFrame 交集并集补集的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-06-06
  • Python使用Selenium进行Web自动化测试

    Python使用Selenium进行Web自动化测试

    Selenium 是一个用于 Web 应用自动化测试的强大工具,可以用来模拟用户操作浏览器,从而测试 Web 应用的功能,它支持多种浏览器和编程语言,包括 Python,下面我们将介绍如何使用 Selenium 进行 Web 自动化测试,需要的朋友可以参考下
    2024-08-08
  • Python基于codecs模块实现文件读写案例解析

    Python基于codecs模块实现文件读写案例解析

    这篇文章主要介绍了Python基于codecs实现文件读写案例解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-05-05
  • Python+Opencv文本检测的实现

    Python+Opencv文本检测的实现

    本文主要介绍了如何使用OpenCV和EAST文本检测器检测图像中的文本,以便大家可以在自己的应用程序中应用文本检测。感兴趣的同学可以关注一下
    2021-11-11
  • 浅谈python图片处理Image和skimage的区别

    浅谈python图片处理Image和skimage的区别

    这篇文章主要介绍了浅谈python图片处理Image和skimage的区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-08-08
  • Python中使用Chaco绘图库

    Python中使用Chaco绘图库

    这篇文章主要介绍了Python中使用Chaco绘图库,Chaco是一个2D的绘图库,如果你安装了Python(x,y)的话,可以在pythonxy的安装目录下的找到Chaco的demo程序,Chaco提供了类似Matlab和pylab的绘图方式,我们称之为面向脚本的绘图方式
    2023-11-11
  • Python:Numpy 求平均向量的实例

    Python:Numpy 求平均向量的实例

    今天小编就为大家分享一篇Python:Numpy 求平均向量的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-06-06

最新评论