echarts静态饼图

<div class="cake"><div id="cakeChart"></div></div>

import * as echarts from "echarts";mounted() {this.$nextTick(() => {this.getCakeEcharts()})},methods: {// 饼状图getCakeEcharts() {let cakeChart = echarts.init(document.getElementById("cakeChart"));cakeChart.setOption({title: {left: 'center'},tooltip: {trigger: 'item'},legend: {bottom: '5%',left: 'center',textStyle: {color: "#fff", // 更改文本颜色},},color: ['#ff7f50', '#87cefa', '#da70d6', '#32cd32'], // 设置整个图表的颜色数组series: [{name: 'Access From',type: 'pie',radius: '50%',data: [{ value: 48, name: '一级监督' },{ value: 75, name: '二级监督' },{ value: 80, name: '三级监督' },{ value: 44, name: '四级监督' },],}]})window.addEventListener("resize", function () {cakeChart.resize();})},}<style>
.cake {width: 55%;height: 100%;#cakeChart {width: 100%;height: 100%;}}
<style>

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

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

相关文章

UE5 Foliage地形植被实例删不掉选不中问题

目前问题测试发生在5.2.1上 地形上先填充后刷的植被删不掉 首先这个就是bug&#xff0c;大概看到说是5.3上能解决了&#xff0c;对此我只能吐槽ue5上地形植被bug太多了 什么nanite还能产生bug&#xff0c;不过这次又不是&#xff0c;整个删掉instance可以删除所有植被&#…

uniapp微信小程序《隐私保护协议》弹窗处理流程

背景 《关于小程序隐私保护指引设置的公告》 《小程序隐私协议开发指南》 流程 1.第一步 必须设置且审核通过&#xff01;&#xff01;&#xff01; 2.第二步 uniapp在manifest.json中添加&#xff01;&#xff01;&#xff01; /* 在 2023年9月15号之前&#xff0c;在 ap…

Leetcode算法入门与数组丨3. 数组基础

文章目录 前言1 数组简介2 数组的基本操作2.1 访问元素2.2 查找元素2.3 插入元素2.4 改变元素2.5 删除元素 3 总结task03task04 前言 Datawhale组队学习丨9月Leetcode算法入门与数组丨打卡笔记 这篇博客是一个 入门型 的文章&#xff0c;主要是自己学习的一个记录。 内容会参…

SSM SpringBoot vue快递柜管理系统

SSM SpringBoot vue快递柜管理系统 系统功能 登录 注册 个人中心 快递员管理 用户信息管理 用户寄件管理 配送信息管理 寄存信息管理 开发环境和技术 开发语言&#xff1a;Java 使用框架: SSM(Spring SpringMVC Mybaits)或SpringBoot 前端: vue 数据库&#xff1a;Mys…

【GAMES202】Real-Time Ray Tracing 1—实时光线追踪1

一、前言 这篇我们开始新的话题—Real-Time Ray Tracing简称RTRT&#xff0c;也就是实时光线追踪&#xff0c;关于光线追踪&#xff0c;我们已经不止一次提到过它的优点&#xff0c;无论是软阴影还是全局光照&#xff0c;光线追踪都很容易做&#xff0c;唯一的缺点就是速度太慢…

快速加入Health Kit,一文了解审核流程

HUAWEI Health Kit是为华为生态应用打造的基于华为帐号和用户授权的运动健康数据开放平台。 在获取用户授权后&#xff0c;开发者可以使用Health Kit提供的开放能力获取运动健康数据&#xff0c;基于多种类型数据构建运动健康领域应用与服务&#xff0c;为用户打造丰富、便捷、…

模方新建工程时,显示空三与模型坐标系不一致怎么解决

答:检查空三xml与模型的metadata.xml的坐标系是否一致&#xff0c;metadata文件是否有在data目录外面。 模方是一款针对实景三维模型的冗余碎片、水面残缺、道路不平、标牌破损、纹理拉伸模糊等共性问题研发的实景三维模型修复编辑软件。模方4.0新增单体化建模模块&#xff0c;…

【C语言】每日一题(半月斩)——day2

目录 一.选择题 1、以下程序段的输出结果是( ) 2、若有以下程序&#xff0c;则运行后的输出结果是&#xff08; &#xff09; 3、如下函数的 f(1) 的值为&#xff08; &#xff09; 4、下面3段程序代码的效果一样吗( ) 5、对于下面的说法&#xff0c;正确的是&#xf…

Kotlin

函数命名 针对您目前为止学到的 Kotlin 知识&#xff0c;下面给出了一些相关样式指南&#xff1a; 函数名称应采用驼峰式大小写形式&#xff0c;并且应该是动词或动词短语。每个语句都应单独占一行。左花括号应出现在函数开始行的末尾。左花括号前应有一个空格。 变量声明 变…

千兆以太网硬件设计及链路层 MAC 协议格式

以太网系列文章&#xff1a; &#xff08;1&#xff09;千兆以太网硬件设计及链路层 MAC 协议格式 &#xff08;2&#xff09;千兆以太网网络层 ARP 协议的原理与 FPGA 实现 &#xff08;3&#xff09;CRC校验代码原理 文章目录 前言一、以太网 MAC 层接口介绍1.MII 接口2.GMII…

重建大师提交空三后引擎状态是等待,怎么开启?

答&#xff1a;图片中这是在自由网空三阶段&#xff0c;整个AT都是等待中&#xff0c;可以修改任务目录和监控目录看一下&#xff0c;先设置引擎&#xff0c;再提交空三。

可变参数JAVA

public class Main {public static void main(String[] args) {//方法形参的个数是可以变化的//格式&#xff1a;属性类型...名字System.out.println(getSum(1,2,3,4,5,6,7,8));}//通过键值对对象来遍历&#xff1b;public static int getSum(int a,int...args){//可变参数;int…

IDEA2023.2.1取消空包隐藏,切换包结构(Compact Middle Packages)

解决2023版idea的包结构 取消勾选即可。 取消勾选Compact Middle Packages选项后&#xff0c;再创建包时&#xff0c;即可自动创建树形结构。 仅供学习使用&#xff01;

IP地址,子网掩码,默认网关,DNS讲解

IP地址&#xff1a;用来标识网络中一个个主机&#xff0c;IP有唯一性&#xff0c;即每台机器的IP在全世界是唯一的。 子网掩码&#xff1a;用来判断任意两台计算机的ip地址是否属于同一子网络的根据。最为简单的理解就是两台计算机各自的ip地址与子网掩码进行and运算后&#x…

黑马头条 热点文章实时计算、kafkaStream

热点文章-实时计算 1 今日内容 1.1 定时计算与实时计算 1.2 今日内容 kafkaStream 什么是流式计算kafkaStream概述kafkaStream入门案例Springboot集成kafkaStream 实时计算 用户行为发送消息kafkaStream聚合处理消息更新文章行为数量替换热点文章数据 2 实时流式计算 2…

医学访问学者申请四点规划建议

医学领域一直以来都是人类社会的重要组成部分&#xff0c;而作为一名有志于成为一名医学领域的访问学者&#xff0c;您需要明确自己的目标并做好充分准备。知识人网小编将为您提供四点规划建议&#xff0c;以帮助您成功申请医学访问学者的机会。 第一点&#xff1a;明确研究方向…

OOM分析实战

OOM分析&实战 OOM分析&实战引言&#xff1a;一、JVM内存结构二、JVM OOM错误情况三、实践案例一案例二案例三 四、总结五、分析工具推荐六、参考文献 OOM分析&实战 引言&#xff1a; 在Java开发中&#xff0c;随着应用程序变得越来越复杂&#xff0c;内存管理问题…

Debian11之稳定版本Jenkins安装

系统要求 机器要求 256 MB 内存&#xff0c;建议大于 512 MB 10 GB 的硬盘空间&#xff08;用于 Jenkins 和 Docker 镜像&#xff09;软件要求 Java 8 ( JRE 或者 JDK 都可以) Docker &#xff08;导航到网站顶部的Get Docker链接以访问适合您平台的Docker下载 Maven 用于构…

【循环冗余码检错示例】

接收方怎么看有错没有 余数为0就是无错&#xff01;

低代码框架开发平台厂家:做好产品,实现流程化办公!

在新的发展时代&#xff0c;低代码技术平台拥有诸多优势特点&#xff0c;成为广大企业实现降本、增效办公效率的得力助手。什么样的低代码框架开发平台厂家值得信任与青睐&#xff1f;都有哪些主要产品&#xff1f;为了帮助大家了解这一讯息&#xff0c;一起来了解流辰信息低代…