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


Posted in Python onMay 16, 2020

1、效果图

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

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的文字重叠

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

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

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

代码:加粗加下划线部分

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

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

Python 相关文章推荐
python读取浮点数和读取文本文件示例
May 06 Python
在Python3中初学者应会的一些基本的提升效率的小技巧
Mar 31 Python
python基于Tkinter库实现简单文本编辑器实例
May 05 Python
在Linux系统上通过uWSGI配置Nginx+Python环境的教程
Dec 25 Python
python实现逻辑回归的方法示例
May 02 Python
使用pandas模块读取csv文件和excel表格,并用matplotlib画图的方法
Jun 22 Python
selenium + python 获取table数据的示例讲解
Oct 13 Python
在mac下查找python包存放路径site-packages的实现方法
Nov 06 Python
Python和Go语言的区别总结
Feb 20 Python
python实现QQ空间自动点赞功能
Apr 09 Python
Python实现Linux监控的方法
May 16 Python
Django获取该数据的上一条和下一条方法
Aug 12 Python
Python如何使用PIL Image制作GIF图片
May 16 #Python
pyecharts调整图例与各板块的位置间距实例
May 16 #Python
通过Python实现一个简单的html页面
May 16 #Python
Python批量处理csv并保存过程解析
May 16 #Python
基于Python测试程序是否有错误
May 16 #Python
关于matplotlib-legend 位置属性 loc 使用说明
May 16 #Python
Python matplotlib画图时图例说明(legend)放到图像外侧详解
May 16 #Python
You might like
PHP批量生成缩略图的代码
2008/07/19 PHP
非常全面的php日期时间运算汇总
2015/11/04 PHP
实例讲解php数据访问
2016/05/09 PHP
php单链表实现代码分享
2016/07/04 PHP
php判断用户是否关注微信公众号
2016/07/22 PHP
PHP下载远程图片的几种方法总结
2017/04/07 PHP
使用composer安装使用thinkphp6.0框架问题【视频教程】
2019/10/01 PHP
js截取函数(indexOf,join等)
2010/09/01 Javascript
javascript获取下拉列表框当中的文本值示例代码
2013/07/31 Javascript
jquery 中的each()跳出循环的语句
2014/05/23 Javascript
jquery判断当前浏览器的实现代码
2015/11/07 Javascript
jQuery时间插件jquery.clock.js用法实例(5个示例)
2016/01/14 Javascript
悬浮广告方法日常收集整理
2016/03/18 Javascript
基于MVC方式实现三级联动(JavaScript)
2017/01/23 Javascript
详谈commonjs模块与es6模块的区别
2017/10/18 Javascript
vue实现城市列表选择功能
2018/07/16 Javascript
vue router-link 默认a标签去除下划线的实现
2020/11/06 Javascript
Python中的集合类型知识讲解
2015/08/19 Python
Python应用领域和就业形势分析总结
2019/05/14 Python
详解python变量与数据类型
2020/08/25 Python
详解Canvas 实现炫丽的粒子运动效果(粒子生成文字)
2018/02/01 HTML / CSS
HTML5标签大全
2016/11/23 HTML / CSS
电子邮箱格式怎么写
2014/01/12 职场文书
八项规定整改方案
2014/02/21 职场文书
反腐倡廉警示教育活动总结
2014/05/05 职场文书
家长会标语
2014/06/24 职场文书
银行先进个人总结
2015/02/15 职场文书
财务总监岗位职责范本
2015/04/03 职场文书
毕业生爱心捐书倡议书
2015/04/27 职场文书
2015年教研组工作总结
2015/05/04 职场文书
幼儿园大班教育随笔
2015/08/14 职场文书
五一放假通知怎么写
2015/08/18 职场文书
2016春季田径运动会广播稿
2015/12/21 职场文书
2016学校先进集体事迹材料
2016/02/29 职场文书
解决Nginx 配置 proxy_pass 后 返回404问题
2021/03/31 Servers
python自动化操作之动态验证码、滑动验证码的降噪和识别
2021/08/30 Python