在移动端开发图表,uniapp+echarts,需要特殊处理,使用renderjs
1.首先要创建一个组件warning,用来装图表(我排除绿色那段代码为我的需求,不是必要代码)
<template>
<div class="task_container">
<div class="pop_body">
<div class="footer">
<warningchild ref="childRef" class="jiuming" id="chartwaring" width="100%" height="100%"
:option="option13">
</warningchild>
</div>
</div>
</div>
</template>
<script>
import warningchild from '@/components/echarts/warningchild'
import {
mapGetters
} from 'vuex';
export default {
components: {
warningchild
},
data() {
return {
activeButton: 0,
option13: {},
option131: {},
option132: {},
option133: {},
namearray: [],
valuearray: [],
buttons: ['今日', '昨日', '7天', '30天'],
reslist: [],
reslist1: [],
reslist2: [],
reslist3: [],
datalist: [],
datalist1: [],
datalist2: [],
datalist3: [],
data: [{
value: 20,
// legendname: "种类01",
name: "处理中",
// itemStyle: { color: "#8d7fec" }
itemStyle: {
borderColor: 'rgba(255, 255, 255, 0.1)',
// shadowBlur: 10,
borderRadius: 80,
color: "#4A75FF",
shadowColor: 'rgba(255, 255, 255, 1)'
}
},
{
value: 19,
legendname: "种类03",
name: "待处理",
itemStyle: {
color: "#01B4FF",
borderColor: 'rgba(255, 255, 255, 0.1)',
// shadowBlur: 10,
borderRadius: 80,
shadowColor: 'rgba(142, 152, 241, 1)'
},
},
{
value: 24,
legendname: "",
name: "审核中",
itemStyle: {
color: "#23EABD",
borderColor: 'rgba(255, 255, 255, 0.1)',
// shadowBlur: 10,
borderRadius: 80,
shadowColor: 'rgba(142, 152, 241, 1)'
},
},
{
value: 32,
legendname: "",
name: "已处理",
itemStyle: {
color: "#FF7482",
borderColor: 'rgba(255, 255, 255, 0.1)',
// shadowBlur: 10,
borderRadius: 80,
shadowColor: 'rgba(142, 152, 241, 1)'
},
},
]
}
},
methods: {
getcount() {
console.log('sisisisiis')
this.$http.get(`///`
// {
// params: {
// eventStatus: buttonIndex
// }
// },
).then(res => {
this.reslist = res.data.result
console.log("warning", res.data.result)
this.modifiedCountList()
this.option13 = {
title: [
],
series: [{
// name: "标题",
type: "pie",
center: ["50%", "50%"],
// zuoyou/shangxia
radius: ["60%", "65%"],
width: 'auto',
height: 150,
clockwise: false, //饼图的扇区是否是顺时针排布
avoidLabelOverlap: false,
label: {
normal: {
show: false,
position: "outter",
// formatter: function(parms) {
// return parms.datalist.name;
// },
},
},
labelLine: {
normal: {
length: 5,
length2: 3,
smooth: true,
},
},
itemStyle: { // 此配置
normal: {
borderWidth: 3,
borderColor: 'rgba(0, 0, 0, 0.5)',
},
},
data: this.datalist
}, ],
}
this.$refs.childRef.changeonlys(this.option13);
})
},
handleButtonClick(buttonIndex) {
this.activeButton = buttonIndex;
if (this.activeButton == 0) {
this.getcount()
} else if (
this.activeButton == 1
) {
this.getcount1()
} else if (this.activeButton == 2) {
this.getcount2()
} else if (this.activeButton == 3) {
this.getcount3()
}
// this.getcount()
// this.getcount1()
// this.getcount2()
// this.getcount3()
},
modifiedCountList() {
// 定义不同警报级别的 itemStyle 设置
const alertStyles = {
'橙色': {
borderColor: 'rgba(255, 255, 255, 0.1)',
borderRadius: 80,
color: "#FE7B41",
shadowColor: 'rgba(255, 255, 255
相关文章:
在移动端开发图表,uniapp+echarts,需要特殊处理,使用renderjs
1.首先要创建一个组件warning,用来装图表(我排除绿色那段代码为我的需求,不是必要代码) <template> <div class="task_container"> <div class="pop_body"> <div class="footer"> <warning…...
SpringBoot之LazyInitializationBeanFactoryPostProcessor类源码学习
源码分析 /**** author Andy Wilkinson* author Madhura Bhave* author Tyler Van Gorder* author Phillip Webb* since 2.2.0* see LazyInitializationExcludeFilter** 主要用于延迟初始化 Bean 的配置。它通过修改 BeanFactory 的配置来确保某些 Bean 在实际需要时才进行初始…...
United States of America三种表示
"United States of America", "United States", 和 "America" 都表示美国,但它们的使用场景和背景略有不同。以下是关于为什么这些名称可以合在一起表示美国的详细解释: 1. "United States of America" 全称&a…...
OpenCV基于均值漂移算法(pyrMeanShiftFiltering)的水彩画特效
1、均值漂移算法原理 pyrMeanShiftFiltering算法结合了均值迁移(Mean Shift)算法和图像金字塔(Image Pyramid)的概念,用于图像分割和平滑处理。以下是该算法的详细原理: 1.1 、均值迁移(Mean …...
【C++】拷贝构造函数与运算符重载
写在前面 拷贝构造函数、赋值运算符重载、取地址运算符都是属于类的默认成员函数! 默认成员函数是程序猿不显示声明定义,编译器会中生成。 在程序编写中,我们也经常使用拷贝的方式来获取到对应的值,例如整形变量拷贝int a 0; i…...
2024年开发语言热度排名
随着技术的不断发展和变化,编程语言的热度也在不断演变。2024年即将到来,我们有必要回顾和展望当前和未来的开发语言市场。本文将基于多个因素,包括行业需求、社区支持、流行度以及新兴趋势,对2024年的开发语言热度进行排名和分析…...
CryptoMamba:利用状态空间模型实现精确的比特币价格预测
“CryptoMamba: Leveraging State Space Models for Accurate Bitcoin Price Prediction” 论文地址:https://arxiv.org/pdf/2501.01010 Github地址:https://github.com/MShahabSepehri/CryptoMamba 摘要 预测比特币价格由于市场的高波动性和复杂的非线…...
MQTTX客户端使用
一、MQTT服务器( emqx )搭建 (1) 下载服务器MQTT Broker 从https://www.emqx.com/zh/downloads/broker/5.3.0/emqx-5.3.0-windows-amd64.zip下载MQTT Broker。 这里我使用的windows系统,下载对应版本工具:emqx-5.3.0-windows-a…...
网管平台(进阶篇):路由器的管理实践
在当今数字化时代,路由器作为网络连接的核心设备,其管理对于确保网络的稳定、高效和安全至关重要。本文旨在深入探讨路由器管理的重要性、基本设置步骤、高级功能配置以及日常维护,帮助读者构建一个高效且安全的网络环境。 一、路由器管理的…...
基于微信小程序的智能停车场管理系统设计与实现(LW+源码+讲解)
专注于大学生项目实战开发,讲解,毕业答疑辅导,欢迎高校老师/同行前辈交流合作✌。 技术范围:SpringBoot、Vue、SSM、HLMT、小程序、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容:…...
【Vue】父组件向子组件传递参数;子组件向父组件触发自定义事件
父组件向子组件传递参数 方法一:props 在 Vue 中,父组件向子组件传递数据主要通过props来实现,以下是具体的步骤: 父组件中传递数据 在父组件中,当需要调用子组件 AddSampleDialog 时,通过 v-bind 或其…...
搜广推校招面经七
抖音推荐算法 一、广告系统中的数据流处理方法,怎么避免延迟回流问题 延迟回流问题是指,实时系统(如广告点击预估)中,历史数据未及时更新或发生延迟,导致系统的实时预测偏离实际情况。避免延迟回流的方法有…...
Leetcode 518. 零钱兑换 II 动态规划
原题链接:Leetcode 518. 零钱兑换 II 可参考官解:零钱兑换 II 和这个解答:[Java/Python3/C]动态规划:拆分零钱兑换子问题(嵌套循环的秘密)【图解】 此题需要仔细想象和Leetcode 377. 组合总和 Ⅳ 动态规划…...
【EI 会议征稿】第四届材料工程与应用力学国际学术会议(ICMEAAE 2025)
2025 4th International Conference on Materials Engineering and Applied Mechanics 重要信息 大会官网:www.icmeaae.com 大会时间:2025年3月7-9日 大会地点:中国西安 截稿时间:2025年1月24日23:59 接受/拒稿通知…...
集合的线程安全
在多线程环境中,Java 的集合框架(Collection Framework)面临着线程安全的问题。当多个线程同时访问同一个集合对象时,可能会导致数据不一致、丢失更新或程序崩溃等严重问题。因此,在并发编程中确保集合操作的安全性至关…...
《深入理解Mybatis原理》Mybatis中的缓存实现原理
一级缓存实现 什么是一级缓存? 为什么使用一级缓存? 每当我们使用MyBatis开启一次和数据库的会话,MyBatis会创建出一个SqlSession对象表示一次数据库会话。 在对数据库的一次会话中,我们有可能会反复地执行完全相同的查询语句&…...
C# 数据拟合教程:使用 Math.NET Numerics 的简单实现
C# 数据拟合实战:使用 Math.NET Numerics 快速实现 引言 在科学计算、工程建模或数据分析中,数据拟合是一个非常重要的技术。无论是线性拟合还是非线性拟合,借助适当的工具都可以快速解决问题。本文将向您展示如何使用 C# 和强大的数值计算…...
C# 中对 Task 中的异常进行捕获
以下是在 C# 中对 Task 中的异常进行捕获的几种常见方法: 方法一:使用 try-catch 语句 你可以使用 try-catch 语句来捕获 Task 中的异常,尤其是当你使用 await 关键字等待任务完成时。 using System; using System.Threading.Tasks;class …...
Android车机DIY开发之软件篇(九)默认应用和服务修改
Android车机DIY开发之软件篇(九)默认应用和服务修改 Car默认应用位置 ~/packages/apps/Car 增加APP 1.增加 XXXX.app 和Android.mk 2. 修改~/build/make/target/product/handheld_system_ext.mk Android默认APK位置 ~/packages/apps 1.增加文件夹 app和mk文件 2.build/mak…...
SimpleFOC01|基于STM32F103+CubeMX,移植核心的common代码
导言 如上图所示,进入SimpleFOC官网,点击Github下载源代码。 如上图所示,找到仓库。 comom代码的移植后,simpleFOC的移植算是完成一大半。simpleFOC源码分为如下5个部分,其中communication是跟simpleFOC上位机通讯&a…...
测试微信模版消息推送
进入“开发接口管理”--“公众平台测试账号”,无需申请公众账号、可在测试账号中体验并测试微信公众平台所有高级接口。 获取access_token: 自定义模版消息: 关注测试号:扫二维码关注测试号。 发送模版消息: import requests da…...
SkyWalking 10.2.0 SWCK 配置过程
SkyWalking 10.2.0 & SWCK 配置过程 skywalking oap-server & ui 使用Docker安装在K8S集群以外,K8S集群中的微服务使用initContainer按命名空间将skywalking-java-agent注入到业务容器中。 SWCK有整套的解决方案,全安装在K8S群集中。 具体可参…...
Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以?
Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以? 在 Golang 的面试中,map 类型的使用是一个常见的考点,其中对 key 类型的合法性 是一道常被提及的基础却很容易被忽视的问题。本文将带你深入理解 Golang 中…...
2025年能源电力系统与流体力学国际会议 (EPSFD 2025)
2025年能源电力系统与流体力学国际会议(EPSFD 2025)将于本年度在美丽的杭州盛大召开。作为全球能源、电力系统以及流体力学领域的顶级盛会,EPSFD 2025旨在为来自世界各地的科学家、工程师和研究人员提供一个展示最新研究成果、分享实践经验及…...
阿里云ACP云计算备考笔记 (5)——弹性伸缩
目录 第一章 概述 第二章 弹性伸缩简介 1、弹性伸缩 2、垂直伸缩 3、优势 4、应用场景 ① 无规律的业务量波动 ② 有规律的业务量波动 ③ 无明显业务量波动 ④ 混合型业务 ⑤ 消息通知 ⑥ 生命周期挂钩 ⑦ 自定义方式 ⑧ 滚的升级 5、使用限制 第三章 主要定义 …...
新能源汽车智慧充电桩管理方案:新能源充电桩散热问题及消防安全监管方案
随着新能源汽车的快速普及,充电桩作为核心配套设施,其安全性与可靠性备受关注。然而,在高温、高负荷运行环境下,充电桩的散热问题与消防安全隐患日益凸显,成为制约行业发展的关键瓶颈。 如何通过智慧化管理手段优化散…...
用docker来安装部署freeswitch记录
今天刚才测试一个callcenter的项目,所以尝试安装freeswitch 1、使用轩辕镜像 - 中国开发者首选的专业 Docker 镜像加速服务平台 编辑下面/etc/docker/daemon.json文件为 {"registry-mirrors": ["https://docker.xuanyuan.me"] }同时可以进入轩…...
如何在最短时间内提升打ctf(web)的水平?
刚刚刷完2遍 bugku 的 web 题,前来答题。 每个人对刷题理解是不同,有的人是看了writeup就等于刷了,有的人是收藏了writeup就等于刷了,有的人是跟着writeup做了一遍就等于刷了,还有的人是独立思考做了一遍就等于刷了。…...
【Go语言基础【13】】函数、闭包、方法
文章目录 零、概述一、函数基础1、函数基础概念2、参数传递机制3、返回值特性3.1. 多返回值3.2. 命名返回值3.3. 错误处理 二、函数类型与高阶函数1. 函数类型定义2. 高阶函数(函数作为参数、返回值) 三、匿名函数与闭包1. 匿名函数(Lambda函…...
Go 并发编程基础:通道(Channel)的使用
在 Go 中,Channel 是 Goroutine 之间通信的核心机制。它提供了一个线程安全的通信方式,用于在多个 Goroutine 之间传递数据,从而实现高效的并发编程。 本章将介绍 Channel 的基本概念、用法、缓冲、关闭机制以及 select 的使用。 一、Channel…...
