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
		});
	}
},

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

1996-2023年各省农业总产值数据(无缺失)

1996-2023年各省农业总产值数据(无缺失) 1、时间:1996-2023年 2、来源:国家统计局、各省年鉴 3、指标:农业总产值 4、范围:31省 5、缺失情况:无缺失 6、指标解释:农业总产值是…

CSS关于居中的问题

文章目录 1. 行内和块级元素自身相对父控件居中1.1. 块级元素相对父控件居中1.2. 行内元素相对于父控件居中 2. 实现单行文字垂直居中3. 子绝父相实现子元素的水平垂直居中3.1. 方案一3.1.1. 示例 3.2. 方案二3.2.1. 示例 3.3. 方案三(推荐)3.3.1. 示例 3.4. 方案四(了解一下) …

高盛开源的量化金融 Python 库

GS Quant GS Quant是用于量化金融的Python工具包,建立在世界上最强大的风险转移平台之一之上。旨在加速量化交易策略和风险管理解决方案的开发,凭借25年的全球市场经验精心打造。 它由高盛的定量开发人员(定量)创建和维护&#…

2970.力扣每日一题7/10 Java(暴力枚举)

博客主页:音符犹如代码系列专栏:算法练习关注博主,后期持续更新系列文章如果有错误感谢请大家批评指出,及时修改感谢大家点赞👍收藏⭐评论✍ 目录 解题思路 解题方法 时间复杂度 空间复杂度 Code 解题思路 incre…

对智能的研究正在悄悄地诱发复杂取代科学

随着智能人工智能的发展,传统科学研究方法可能面临新的挑战或者被扩展。人工智能的发展带来了大数据分析、机器学习、深度学习等新的工具和方法,这些方法在处理复杂系统和大规模数据方面表现出色,使得科学研究变得更加多样化和复杂化。对智能…

stm32 开发板可以拿来做什么?

STM32开发板可以用来做许多不同的事情,具体取决于您的应用需求和编程能力。我收集归类了一份嵌入式学习包,对于新手而言简直不要太棒,里面包括了新手各个时期的学习方向编程教学、问题视频讲解、毕设800套和语言类教学,敲个22就可…

iMazing 3.0.3.1Mac中文破解版下载安装激活

今天,小编要分享的是Mac下一款可以帮助用户管理IOS设备的软件——iMazing,之前,小编也分享的过类似的软件,iMazing却有独特之处。小子这次带来的是3.0.3.1版本。 iMazing 3是一款iOS设备管理软件,该软件支持对基于iOS…

记录一次微信小程序申诉定位权限过程

1 小程序接到通知,检测到违规,需要及时处理,给一周的缓冲时间,如果到期未处理,会封禁能力(2023-11-17) 2 到期后,仍未处理,封禁能力(2023-11-24) …

云视频监控中的高效视频转码策略:视频汇聚EasyCVR平台H.265自动转码H.264能力解析

随着科技的快速发展,视频监控技术已经广泛应用于各个领域,如公共安全、商业管理、教育医疗等。与此同时,视频转码技术作为视频处理的关键环节,也在不断提高视频的质量和传输效率。 一、视频监控技术的演进 视频监控技术的发展历…

传言称 iPhone 16 Pro 将支持 40W 快速充电和 20W MagSafe

目前,iPhone 15 和 iPhone 15 Pro 机型使用合适的 USB-C 电源适配器可实现高达 27W 的峰值充电速度,而 Apple 和授权第三方的官方 MagSafe 充电器可以高达 15W 的功率为 iPhone 15 机型进行无线充电。所有四款 iPhone 15 机型均可使用 20W 或更高功率的电…

zabbix服务器运维命令

查看磁盘大小 df -h 看挂载点是/的项目看内存使用大小 free -h查看cpu的大小和负载 top -c查看库大小 mysql -u root -p select table_schema as 数据库, sum(table_rows) as 记录数,sum(truncate(data_length/1024/1024, 2)) as 数据容量(MB), sum(truncate(index_length/…

“论基于构件的软件开发方法及其应用”写作框架,软考高级论文,系统架构设计师论文

论文真题 基于构作的软件开发 (Component-Based Software Development,CBSD) 是一种基于分布对象技术、强调通过可复用构件设计与构造软件系统的软件复用途径。基于构件的软件系统中的构件可以是COTS (Commercial-Off-the-Shelf)构件&#x…

Linux配置仓库,安装软件

在Linux中安装软件,必须得配置仓库,挂载,才能安装成功 1.选择使用的虚拟机,右键点击“设置” 2.点击“CD/DVD”,勾选“设备状态”中的“已连接”和启动时链接,选择ISO映像文件 3..开启虚拟机 4.配置仓库…

利用 Selenium 自动化抓取 Web of Science 论文数据:以 IEEE SENSORS JOURNAL 为例

在当今数字化时代,科研工作者面临着海量学术信息的挑战。有效地收集、筛选和分析相关领域的最新研究成果,对于保持科研竞争力至关重要。然而,手动检索和整理学术文献不仅耗时耗力,还容易出现疏漏。为了解决这一问题,我…

conda篇----在已有conda环境的基础上升级python包

conda篇----在已有conda环境的基础上升级python包 原先的python版本 第一步: conda update --all(py11) [xxxaivrs01 xxx]$ conda update --all Collecting package metadata (current_repodata.json): done Solving environment: done> WARNING: A newer vers…

【spark】Exception in thread “main“ ExitCodeException exitCode=-1073741701

在window上运行spark程序写到本地文件的时候报错。 val rdd sc.sparkContext.parallelize(list)val arr rdd.collect()arr.foreach(println)rdd.saveAsTextFile("test1")sc.close()错误信息: zhangsan lisi wangwu Exception in thread "main" ExitCode…

C++ | Leetcode C++题解之第228题汇总区间

题目&#xff1a; 题解&#xff1a; class Solution { public:vector<string> summaryRanges(vector<int>& nums) {vector<string> ret;int i 0;int n nums.size();while (i < n) {int low i;i;while (i < n && nums[i] nums[i - 1] …

【PB案例学习笔记】-31制作一个动态设置菜单的程序

写在前面 这是PB案例学习笔记系列文章的第31篇&#xff0c;该系列文章适合具有一定PB基础的读者。 通过一个个由浅入深的编程实战案例学习&#xff0c;提高编程技巧&#xff0c;以保证小伙伴们能应付公司的各种开发需求。 文章中设计到的源码&#xff0c;小凡都上传到了gite…

研华运动控制卡在LabVIEW中的应用

在现代工业和科研领域中&#xff0c;精密运动控制系统的需求日益增加。这些系统广泛应用于自动化生产线、精密机械加工、机器人控制、光学仪器调试和实验室自动化设备等诸多领域。本文以研华公司的运动控制卡为例&#xff0c;详细介绍其在LabVIEW中的应用&#xff0c;展示如何通…

【北京迅为】《i.MX8MM嵌入式Linux开发指南》-第一篇 嵌入式Linux入门篇-第十九章 Linux 工具之make 工具和 makefile 文件

i.MX8MM处理器采用了先进的14LPCFinFET工艺&#xff0c;提供更快的速度和更高的电源效率;四核Cortex-A53&#xff0c;单核Cortex-M4&#xff0c;多达五个内核 &#xff0c;主频高达1.8GHz&#xff0c;2G DDR4内存、8G EMMC存储。千兆工业级以太网、MIPI-DSI、USB HOST、WIFI/BT…