位置: IT常识 - 正文

echarts中的legend属性(echarts中的legend能被监听吗)

编辑:rootadmin
echarts中的legend属性 legend: { orient: "vertical", right: "0%", top: "15%", icon: "circle", //小圆点 itemWidth: 8, itemHeight: 8, itemGap: 15, //间隔 formatter: function (params) { let tip1 = ""; let tip = ""; let le = params.length; //图例文本的长度 if (le > 19) { //几个字换行大于几就可以了 let l = Math.ceil(le / 19); //有些不能整除,会有余数,向上取整 for (let i = 1; i <= l; i++) { //循环 if (i < l) { //最后一段字符不能有\n tip1 += params.slice(i * 19 - 19, i * 19) + "\n"; //字符串拼接 } else if (i === l) { //最后一段字符不一定够9个 tip = tip1 + params.slice((l - 1) * 19, le); //最后的拼接在最后 } } return tip; } else { tip = params; //前面定义了tip为空,这里要重新赋值,不然会替换为空 return tip; } }, },

推荐整理分享echarts中的legend属性(echarts中的legend能被监听吗),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:echarts中的grid用来做什么,Echarts中的legend,echarts中的legend根据分类,Echarts中的直角坐标系图表有哪些,echarts中的legend能被监听吗,echarts中的legend根据分类,echarts中的legend根据分类,echarts中的legend根据分类,内容如对您有帮助,希望把文章链接给更多的朋友!

1.图例布局朝向(orient) 默认横向布局,纵向布局值为’vertical’

orient:'horizontal'orient:'vertical'

2.图例组件的宽高(width,height)

3.left,right,top,bottom 图例组件离容器左(右,上,下)侧的距离。 left 的值可以是像 20 这样的具体像素值,可以是像 ‘20%’ 这样相对于容器高宽的百分比,也可以是 ‘left’,‘center’, ‘right’。 (如果 left 的值为’left’, ‘center’,‘right’,组件会根据相应的位置自动对齐.)

 4. icon定义图标形状

{icon: 'circle', name: '搜索引擎'}, {icon: 'rect', name: '直接访问'}, {icon: 'roundRect', name: '邮件营销'}, {icon: 'triangle', name: '联盟广告'}, {icon: 'diamond', name: '视频广告'}, {icon: 'pin', name: 'SEO'}, {icon: 'arrow', name: '定点投放'}echarts中的legend属性(echarts中的legend能被监听吗)

5.图例标记的图形的宽度/高度(itemWidth/itemHeight)

itemWidth: 8, itemHeight: 8,

6.图例每项之间的间隔(itemGap)  图例每项之间的间隔。横向布局时为水平间隔,纵向布局时为纵向间隔

7.legend字太多换行

formatter: function (params) { let tip1 = ""; let tip = ""; let le = params.length; //图例文本的长度 if (le > 19) { //几个字换行大于几就可以了 let l = Math.ceil(le / 19); //有些不能整除,会有余数,向上取整 for (let i = 1; i <= l; i++) { //循环 if (i < l) { //最后一段字符不能有\n tip1 += params.slice(i * 19 - 19, i * 19) + "\n"; //字符串拼接 } else if (i === l) { //最后一段字符不一定够9个 tip = tip1 + params.slice((l - 1) * 19, le); //最后的拼接在最后 } } return tip; } else { tip = params; //前面定义了tip为空,这里要重新赋值,不然会替换为空 return tip; } },

改变前:

改变后:

本文链接地址:https://www.jiuchutong.com/zhishi/297691.html 转载请保留说明!

上一篇:【CUDA安装详细教程】(cuda安装步骤)

下一篇:使用LabVIEW 实现物体识别、图像分割、文字识别、人脸识别等深度视觉(labview实例教程)

  • 电子缴税付款凭证怎么做账
  • 其他应付款短期借款
  • 发票查询校验码看不清怎么办
  • 收到补价时应确认收益,支付补价时不能确认收益
  • 商家促销怎么做
  • 不能抵扣的普通发票
  • 部分退货退款剩下的钱什么时候给卖家
  • 固定资产退回账务处理规定
  • 高速公路通行费电子发票怎么打印
  • 商业承兑汇票背书转让流程图
  • 外籍劳务费个税扣除标准
  • 预提工资是什么科目
  • 开发项目未竣工前土地使用税怎么缴纳
  • 收到股东交的多余的股金怎么做账务处理
  • 代销返点如何进行会计处理?
  • 会计中的贷款核算分录是什么?
  • 清华同方bios通用密码(thtfpc)
  • 未担保余值什么意思
  • 高新企业收到政府补贴
  • php生成php文件
  • 债券利息收入征税吗
  • linux 密码重置
  • 补充协议是否缴纳印花税
  • linux mib
  • php数组函数输出《咏雪》里有多少"片"字
  • 什么叫奖励旅游
  • PHP:GregorianToJD()的用法_日历函数
  • 伊吕波赛道
  • php编程基本语法是什么
  • 在一株植物上行走的作文
  • jetson nano nvidia-smi
  • 材料短缺计入
  • 贷款的减值会计怎么做账
  • 数字图像处理课后题答案
  • 企业开负数发票退货后怎么处理?
  • 减按10的税率征收个人所得税
  • 利润表年报本期金额填什么
  • mysql动态表单设计与实现
  • 电子税务局如何添加办税人员
  • SQL Server 2008+ Reporting Services (SSRS)使用USER登录问题
  • Windows下PostgreSQL安装图解
  • 增值税税务检查
  • 一般纳税人开普票要交税几点
  • 其他综合收益会影响未分配利润吗
  • 三证合一指的是什么意思
  • 出售转让固定资产的账务处理
  • 公司贷款手续如何办理流程
  • 期初数不对怎么办
  • 设计费可以一次支付吗
  • 政府专项补贴资金应列入什么科目
  • abc类企业的划分
  • 典当行收房产证吗直接可以拿钱吗
  • 如何进行固定资产审计
  • 分公司有独立账套吗
  • 五证合一办理步骤
  • 为什么要计提工资
  • Mysql使用insert插入多条记录 批量新增数据
  • wweb32.exe - wweb32是什么进程
  • win7本地磁盘图标变了
  • win7系统怎么查看wifi密码
  • 苹果电脑Mac系统版本所对应的数字
  • windows开启快速启动
  • excel 工具栏
  • dos用处
  • Python中利用不同Excel表的列匹配
  • cocos游戏开发教程
  • 虚拟机中使用keil
  • JavaScript驾驭网页-DOM
  • linux中w命令详解
  • unity system
  • linux用python
  • jq拖拽功能
  • javascript框架的作用
  • Android ImageLoader 本地缓存
  • 手滑式手机是什么意思
  • jquery事件委托原理
  • android:imeOptions属性
  • javascript面向对象编程指南
  • 美国进口税起征点
  • 湖南地税网上办税服务厅
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设