echart5.5.1版本,倒三角柱状图

 

加载方法

initChart1(title, id, tag) {var myChart = echarts5.init(this.$refs[id]);const _this = this;var option = {title:{text: title||"",show: title?true:false,top: 24,left: 24},grid:{left: 54,top: 74,bottom: 44,right: 30,},xAxis: {type: 'category',data: ['用电量 (kWh)', '节电量 (kWh)']},color: ['#3465FA'],yAxis: {type: 'value'},series: [{type: 'pictorialBar',barWidth: 26,label: {show: true,position: 'top',fontSize: 14,fontWeight: 600,color: '#444444'},data: [{value: 50,name: "节电量",symbol: 'path://M525.873548 897.156129l-383.174193-761.723871 763.045161-1.981935-379.870968 763.705806z'},{value: 99,symbol: 'path://M525.873548 897.156129l-383.174193-761.723871 763.045161-1.981935-379.870968 763.705806z',itemStyle: {color: '#2FC587'}},],}]};myChart.setOption(option);if(tag){this.myChart = myChart;}}

宽度自适应

watch:{"$store.state.config.width"(){this.chartAutoWidth = this.$store.state.config.width-20*2-366-492-17-20-248;this.myChart.resize({width: this.chartAutoWidth});}
},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/43334.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Spring成神之路】老兄,来一杯Spring AOP源码吗?

文章目录 一、引言二、Spring AOP的使用三、Spring AOP的组件3.1 Pointcut源码3.2 Advice源码3.3 Advisor源码3.4 Aspect源码 四、Spring AOP源码刨析4.1 configureAutoProxyCreator源码解析4.2 parsePointcut源码解析4.3 parseAdvisor源码解析4.4 parseAspect源码解析4.5 小总…

电脑缺少dll文件是怎么回事?教你5种有效的解决方法

当您的计算机显示DLL文件已经遗失时,您应如何应对呢?实际上,针对此类DLL文件的处置过程相对来说较为简易。今日,我们在此为大家详细介绍此领域的相关知识,让大家轻松解决电脑中因丢失DLL文件而产生的问题。 一、关于DL…

案例开发-日程管理-第一期

九 案例开发-日程管理-第一期 共7期 9.1 登录页及校验 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title><style>.ht{text-align: center;color: cadetblue;font-family: 幼…

MVC 生成验证码

在mvc 出现之前 生成验证码思路 在一个html页面上&#xff0c;生成一个验证码&#xff0c;在把这个页面嵌入到需要验证码的页面中。 JS生成验证码 <script type"text/javascript">jQuery(function ($) {/**生成一个随机数**/function randomNum(min, max) {…

RedHat Linux8 修改root管理员账户密码命令

RedHat Linux8 修改root管理员账户密码命令&#xff1a; sudo passwd root RedHat重置root管理员密码&#xff1a; 1. 查看Linux系统版本信息 cat /etc/redhat-release2. 重置密码 2.1 进入内核编辑界面 重启Linux系统并出现引导界面&#xff0c;按下键盘上的e键进入内…

Prometheus+Grafana主机运行数据

目录 介绍 安装Node Exporter 配置Prometheus 验证配置 导入仪表盘 介绍 Prometheus是一款开源的监控和警报工具&#xff0c;而Node Exporter是Prometheus的一个官方插件&#xff0c;用于采集主机上的各种系统和硬件指标。 安装Node Exporter 下载最新版本的Node Export…

FLinkCDC引起的生产事故(二)

背景&#xff1a; 最近在做实时数据的抽取工作&#xff0c;利用FLinkCDC实时抽取目标库Oracle的数据到Doris中&#xff0c;但是在抽取的过程中&#xff0c;会导致目标库的生产库数据库非常卡顿&#xff0c;为了避免对生产环境的数据库造成影响&#xff0c;对生产环境的数据库利…

qcom 平台efuse机器抓取dump log的方法

引言&#xff1a; qcom 平台机器&#xff0c;一旦efuse后机器将无法抓取dump log qcom 原文&#xff1a; efuse机器抓取dump log的方法如下&#xff1a; 一、修改配置文件&#xff1a; 把kamorta_debugpolicy.xml 在配置了debugpolicy&#xff08;加入串号和打开开关&#x…

怎么检查SSL证书是否有效?

SSL证书的有效性对于保护网站数据安全和用户隐私至关重要。然而&#xff0c;有时可能会出现证书过期、无效或被吊销的情况。为了确保网站的安全性&#xff0c;对SSL证书的有效性进行检查至关重要。本文将介绍几种常用的方法来检查SSL证书的有效性&#xff0c;帮助大家有效评估和…

基于Make的c工程No compilation commands found报错

由于安装gcc时只安装了build-essential&#xff0c;没有将其添加到环境变量中&#xff0c;因此打开Make工程时&#xff0c;CLion会产生如下错误&#xff1a; 要解决这个问题&#xff0c;一个方法是将GCC添加到环境变量中&#xff0c;但是这个方法需要修改至少两个配置文件&…

数据结构——约瑟夫环C语言链表实现

约瑟夫环问题由古罗马史学家约瑟夫&#xff08;Josephus&#xff09;提出&#xff0c;他参加并记录了公元66—70年犹太人反抗罗马的起义。在城市沦陷之后&#xff0c;他和40名死硬的将士在附近的一个洞穴中避难。起义者表示“宁为玉碎不为瓦全”&#xff0c;约瑟夫则想“留得青…

dledger原理源码分析(四)-日志

简介 dledger是openmessaging的一个组件&#xff0c; raft算法实现&#xff0c;用于分布式日志&#xff0c;本系列分析dledger如何实现raft概念&#xff0c;以及dledger在rocketmq的应用 本系列使用dledger v0.40 本文分析dledger的日志&#xff0c;包括写入&#xff0c;复制…

网站SEO百度搜索排名—通过关键字提升网站流量

添加网站关键字 <meta name"keywords" content"系统通过搜索到的关键字XXXXXXXXX"> <meta name"description" content"网站的介绍内容XXXXXXXXXXXXXXXXX"> <title>平台名称XXXXXXX</title> 在 百度站点管理 …

STM32串口通讯(RS232、RS485、TTL)详解

前言 STM32串口&#xff08;Serial Communication Interface&#xff09;是STM32微控制器中用于串行通信的接口&#xff0c;通常指的是USART&#xff08;通用同步异步收发器&#xff09;或UART&#xff08;通用异步收发传输器&#xff09;。这些接口允许STM32微控制器与其他设…

zabbix 学习笔记

文章目录 Zabbix 安装Ubuntu 18.04.1 server 安装Zabbix 4.0Centos7 安装Zabbix3.4Centos7 安装zabbix4.2Centos7.1908安装zabbix 基于ngixDebian11安装zabbix6.0LTS 基于PostgreSQL和NGINXAlmaLinux9.2使用国内清华源在线安装zabbix6.0.18LTS 基于MySQL和NGINXUbunut22.04使用…

图文讲解IDEA如何导入JDBC驱动包

前言 学习JDBC编程,势必要学会如何导入驱动包,这里笔者用图文的方式来介绍 视频版本在这里 50秒教你怎么导入驱动包然后进行JDBC编程的学习_哔哩哔哩_bilibili 忘记录音频了,大伙凑合着看 下载驱动包 https://mvnrepository.com/artifact/mysql/mysql-connector-java 去中…

GB28181设备如何添加

简介 此篇描述视频网关&#xff08;中间件&#xff09;接入大华、海康、ONVIF设备&#xff08;NVR、摄像头&#xff09;、GB28181设备步骤和流程。 阅读本文档之前建议先阅览视频网关&#xff08;中间件&#xff09;用户使用手册。 接入方式和说明 视频网关&#xff08;中间…

论文学习_Getafix: learning to fix bugs automatically

1. 引言 研究背景:现代生产代码库极其复杂并且不断更新。静态分析器可以帮助开发人员发现代码中的潜在问题(在本文的其余部分中称为错误),这对于在这些大型代码库中保持高代码质量是必要的。虽然通过静态分析尽早发现错误是有帮助的,但修复这些错误的问题在实践中仍然主要…

jmeter-beanshell学习7-props获取全局变量和设置全局变量

继续写点不痛不痒的小东西。第一篇写了vars设置变量&#xff0c;但是vars只能作用在同一个线程组。跨线程组情况比较少&#xff0c;要是用到跨线程组&#xff0c;有个pros&#xff0c;用法和vars一样。 在setup线程组设置变量a&#xff0c;执行的时候&#xff0c;jmeter会先执行…

第二证券:转股溢价率是什么意思?高好还是低好?

转股溢价率是指可转债在商场上的交易价格相对于其转股价值的溢价份额&#xff0c;能够用来衡量投资者为取得将债券转换为股票权力而付出的额定金额&#xff0c;是可转债的重要指标。 转股溢价率的核算公式为&#xff1a;溢价率&#xff1d;&#xff08;转债价格-转股价值&…