echarts制作两个柱状图

let colorList=['#02ce8b','#ffbe62','#f17373'];
let data1 = [90,80,70,50]
option = {
title:[{ // 第一个标题text: '环保检测', // 主标题textStyle: { // 主标题样式color: '#333',fontWeight: 'bold',fontSize: 16},left: '20%', // 定位到适合的位置top: '10%', // 定位到适合的位置},{ // 第一个标题text: '水保三色评价得分表', // 主标题textStyle: { // 主标题样式color: '#333',fontWeight: 'bold',fontSize: 16},left: '70%', // 定位到适合的位置top: '10%', // 定位到适合的位置},],legend: [{show:true,x:'20%',y:'20%',},],tooltip: {},grid: [{ left: '5%', top: '25%', width: '40%', height: '50%' },{ right: '5%', top: '25%', width: '40%', height: '50%' },],xAxis: [{ gridIndex: 0,type: 'category',data: ['第一季度', '第二季度', '第三季度', '第四季度']},{ gridIndex: 1,type: 'category',data: ['第一季度', '第二季度', '第三季度', '第四季度']},],yAxis: [{ gridIndex: 0,  type: 'value'},{gridIndex: 1, type: 'value' },],// Declare several bar series, each will be mapped// to a column of dataset.source by default.series: [{name: '合格',type: 'bar',barWidth:20,xAxisIndex: 0,yAxisIndex: 0,stack: 'Ad',color:'#02ce8b',label: {normal: {show: true,position: 'inside',color:'#000000'}},emphasis: {focus: 'series'},data: [11, 9, 7, 6]},{name: '不合格',type: 'bar',barWidth:20,xAxisIndex: 0,yAxisIndex: 0,stack: 'Ad',color:'#f17373',label: {normal: {show: true,position: 'top',color:'#000000'}},emphasis: {focus: 'series'},data: [4, 0, 2, 2]},{data: data1,type: 'bar',xAxisIndex: 1,yAxisIndex: 1,name:'',barWidth:20,label: {normal: {show: true,position: 'top',color:'#000000'},show: true,formatter: function(params) {if (params.data < 20) {return '低';} else if (params.data < 40) {return '中';} else {return '高';}}},itemStyle: {    color: (param) => {    let num = param.data; if (num >= 80) {return colorList[0];}else if(num > 60 && num < 80){return colorList[1];}else if(num < 60){return colorList[2];}}}}]
};

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

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

相关文章

基于Springboot的新能源充电系统(有报告)。Javaee项目,springboot项目。

演示视频&#xff1a; 基于Springboot的新能源充电系统&#xff08;有报告&#xff09;。Javaee项目&#xff0c;springboot项目。 项目介绍&#xff1a; 采用M&#xff08;model&#xff09;V&#xff08;view&#xff09;C&#xff08;controller&#xff09;三层体系结构&a…

IO 作业 24/2/18

1> 使用fgets统计给定文件的行数 #include <stdio.h> #include <stdlib.h> #include <string.h> int main(int argc, const char *argv[]) {//定义文件指针FILE *fpNULL;//打开文件&#xff08;只读&#xff09;if((fpfopen("./test.txt",&quo…

bat 定时收缩日志sqlserver2012

在SQL Server中&#xff0c;定期收缩事务日志&#xff08;transaction log&#xff09;通常不是一个好的做法&#xff0c;因为事务日志的收缩和增长是数据库正常操作的一部分。频繁地收缩事务日志可能会导致性能问题&#xff0c;增加I/O负担&#xff0c;并可能导致事务日志碎片…

300分钟吃透分布式缓存-01讲:业务数据访问性能太低怎么办?

这节课主要讲缓存的基本思想、缓存的优点、缓存的代价三个部分。 缓存的定义 先来看下缓存的定义。 & 缓存最初的含义&#xff0c;是指用于加速 CPU 数据交换的 RAM&#xff0c;即随机存取存储器&#xff0c;通常这种存储器使用更昂贵但快速的静态 RAM&#xff08;SRAM&…

python数据分析numpy基础之mean用法和示例

1 python数据分析numpy基础之mean用法和示例 python的numpy库的mean()函数&#xff0c;用于计算沿指定轴(一个轴或多个轴)的算术平均值。 用法 numpy.mean(a, axisNone, dtypeNone, outNone, keepdims<no value>, *, where<no value>)描述 返回数组元素的平均值…

Airtest-Selenium实操小课:爬取新榜数据

1. 前言 最近看到群里很多小伙伴都在用Airtest-Selenium做一些web自动化的尝试&#xff0c;正好趁此机会&#xff0c;我们也出几个关于web自动化的实操小课&#xff0c;仅供大家参考~ 今天跟大家分享的是一个非常简单的爬取网页信息的小练习&#xff0c;在百度找到新榜网页&a…

【精选】Java面向对象进阶——接口细节:成员特点和接口的各种关系

&#x1f36c; 博主介绍&#x1f468;‍&#x1f393; 博主介绍&#xff1a;大家好&#xff0c;我是 hacker-routing &#xff0c;很高兴认识大家~ ✨主攻领域&#xff1a;【渗透领域】【应急响应】 【Java】 【VulnHub靶场复现】【面试分析】 &#x1f389;点赞➕评论➕收藏 …

鸿蒙生态来了 ,60k 高薪向你招手

最近&#xff0c;各大平台都被华为鸿蒙不断刷屏。原因是在华为秋季发布会上&#xff0c;华为宣布启动鸿蒙原生应用&#xff0c;不再兼容安卓应用。一石激起千层浪&#xff0c;这无疑是IT界的一颗核弹&#xff0c;各大企业和开发者都纷纷开始加入“鸿蒙朋友圈”。 鸿蒙原生应用…

【机构vip教程】Requests(1):Requests模块简介与安装

Requests模块简介 在python的标准库中&#xff0c;虽然提供了urllib,utllib2,httplib&#xff0c;但是做接口测试&#xff0c;requests使用更加方便快捷&#xff0c;正如官方说的&#xff0c;“让HTTP服务人类”。 Requests是用python语言基于urllib编写的&#xff0c;采用的是…

利用 pt-archiver 实现数据库归档功能

文章目录 一、前言关于Percona 二、Percona Toolkit安装 percona-toolkit&#xff1a;pt-archiver 归档命令的使用格式&#xff1a;示例&#xff1a; 三、归档步骤&#xff1a;1&#xff09;、创建归档数据库和归档表方式一(推荐)&#xff1a;这种方式的优缺点&#xff1a; 方式…

【Java】图解 JVM 垃圾回收(一):GC 判断策略、引用类型、垃圾回收算法

图解 JVM 垃圾回收&#xff08;一&#xff09; 1.前言1.1 什么是垃圾1.2 内存溢出和内存泄漏 2.垃圾回收的定义与重要性3.GC 判断策略3.1 引用计数算法3.2 可达性分析算法 4.引用类型5.垃圾回收算法5.1 标记-复制&#xff08;Copying&#xff09;5.2 标记-清除&#xff08;Mark…

Android 基础技术——HashMap

笔者希望做一个系列&#xff0c;整理 Android 基础技术&#xff0c;本章是关于HashMap HaspMap的默认初始长度是16&#xff0c;并且每次扩展长度或者手动初始化时&#xff0c;长度必须是2的次幂。 为什么长度是2的x次幂和每次扩容都是2倍?? 1&#xff09;当一个key被放进到数…

Python实现时间序列分析使用LOESS(STL)模型进行季节性趋势分解(STL算法)项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档视频讲解&#xff09;&#xff0c;如需数据代码文档视频讲解可以直接到文章最后获取。 1.项目背景 时间序列分析中&#xff0c;LOESS&#xff08;局部加权回归平滑&#xff09;和STL&#xff08;Seasona…

Leetcode 3041. Maximize Consecutive Elements in an Array After Modification

Leetcode 3041. Maximize Consecutive Elements in an Array After Modification 1. 解题思路2. 代码实现 题目链接&#xff1a;3041. Maximize Consecutive Elements in an Array After Modification 1. 解题思路 这一题思路上同样就是一个动态规划&#xff0c;我们首先将原…

轨道交通信号增强与覆盖解决方案——经济高效,灵活应用于各类轨道交通场景!

方案背景 我国是世界上轨道交通里程最长的国家&#xff0c;轨道交通也为我们的日常出行带来极大的便利。伴随着无线通信技术的快速发展将我们带入电子时代&#xff0c;出行的过程中对无线通信的依赖程度越来越高&#xff0c;无论是车站还是车内都需要强大、高质量的解决方案以…

LeetCode 2824.统计和小于目标的下标对数目

给你一个下标从 0 开始长度为 n 的整数数组 nums 和一个整数 target &#xff0c;请你返回满足 0 < i < j < n 且 nums[i] nums[j] < target 的下标对 (i, j) 的数目。 示例 1&#xff1a; 输入&#xff1a;nums [-1,1,2,3,1], target 2 输出&#xff1a;3 解…

全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[搭建篇]

全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[搭建篇] 引言相关环境技术栈初始化工程安装turbo配置pnpm-workspace安装husky安装lint-staged安装eslint安装prettier配置 .editorconfig配置 .gitignore初步项目结构结语 引言 最近各种原因&#xff0c;生活上的&am…

代码随想录算法训练营第三十四天|860.柠檬水找零、406.根据身高重建队列、452.用最少数量的箭引爆气球

860.柠檬水找零 public class Solution {public bool LemonadeChange(int[] bills) {int cnt50;int cnt100;for(int i0;i<bills.Length;i){if(bills[i]5){cnt5;}else if(bills[i]10){cnt5--;cnt10;}else if(cnt10!0){cnt5--;cnt10--;}else{cnt5-3;}if(cnt5<0){return fa…

SSTI模板注入漏洞(vulhub 复现)

首先了解模板引擎&#xff1a; 模板引擎&#xff08;这里特指用于Web开发的模板引擎&#xff09;是为了使用户界面与业务数据&#xff08;内容&#xff09;分离而产生的&#xff0c;它可以生成特定格式的文档&#xff0c;利用模板引擎来生成前端的html代码&#xff0c;模板引擎…

2024年华为OD机试真题-求最多可以派出多少支团队-Python-OD统一考试(C卷)

题目描述&#xff1a; 用数组代表每个人的能力&#xff0c;一个比赛活动要求参赛团队的最低能力值为N&#xff0c;每个团队可以由1人或2人组成&#xff0c;且1个人只能参加1个团队&#xff0c;请计算出最多可以派出多少支符合要求的团队&#xff1f; 输入描述&#xff1a; 5 3 …