Echarts+Vue 首页大屏静态示例Demo 第三版

效果图:

源码:

<template>
  <div class="content bg" style="height: 100vh;overflow-y: auto"  :class="{ 'fullscreen-container': isFullScreen }">
    <div class="reaDiv" style="height: 10vh">
      <div style="position: absolute;font-family: MyFont;font-size: 50px;z-index: 99" @click="fullScreen">首页展示</div>
      <div style="position: relative;text-align: center">
        <img src="../assets/img/home/title.png" @click="fullScreen">
        <div class="posDiv1" @click="dcmh">
          电厂门户
        </div>
        <div class="posDiv2" @click="cxph">
          产销平衡
        </div>
      &

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

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

相关文章

FPGA项目(16)——基于FPGA的音乐演奏电路

1.设计要求 能在实验箱上&#xff0c;循环播放一段音乐。&#xff08;需要源码的直接看最后一节&#xff09; 2.设计原理 组成乐曲的每个音符的发音频率值及其持续的时间是乐曲能连续演奏所需要的两个基本要素&#xff0c;问题是如何来获取这两个要素所对应的数值以及通过纯硬件…

幻兽帕鲁内存溢出怎么办,一键设置定时重启,修改虚拟内存,定时清理,轻松解决卡顿!再也不怕爆内存了!

幻兽帕鲁的内存溢出问题&#xff0c;玩久了确实会变卡。这里给出三个解决思路&#xff1a; 第一种方法是定时进行内存清理&#xff08;装个软件就可以&#xff09;&#xff0c;网上也有很多教程&#xff0c;我会把下载地址放在文章后面&#xff0c;大家可以去下载。第二种方法…

c语言二叉树的创建,三种遍历方式,销毁

二叉树的创建 typedef char datatype; typedef struct Node {datatype data;struct Node *left_child;struct Node *right_child;}*Btree; //二叉树的创建 Btree create_node() {Btree t(Btree)malloc(sizeof(struct Node));if(NULLt)return NULL;t->data0;t->left_chil…

Unity项目从built-in升级到URP(包含早期版本和2023版本)

unity不同版本的升级URP的方式不一样&#xff0c;但是大体流程是相似的 首先是加载URP包 Windows -> package manager,在unity registry中找到Universal RP 2023版本&#xff1a; 更早的版本&#xff1a; 创建URP资源和渲染器​​ 有些版本在加载时会自动创建&#…

【PyTorch][chapter 14][李宏毅深度学习][Word Embedding]

前言&#xff1a; 这是用于自然语言处理中数据降维的一种方案。 我们希望用一个向量来表示每一个单词. 有不同的方案 目录&#xff1a; one-hot Encoding word-class 词的上下文表示 count-based perdition-based CBOW Skip-Gram word Embedding 词向量相似…

全流程机器视觉工程开发(三)任务前瞻 - 从opencv的安装编译说起,到图像增强和分割

前言 最近开始做这个裂缝识别的任务了&#xff0c;大大小小的问题我已经摸得差不多了&#xff0c;然后关于识别任务和分割任务我现在也弄的差不多了。 现在开始做正式的业务&#xff0c;也就是我们说的裂缝识别的任务。作为前言&#xff0c;先来说说场景&#xff1a; 现在相…

微服务的幂等性

微服务架构设计的中心思想是将服务进行拆分&#xff0c;但是在这个过程中&#xff0c;如果被依赖的服务发生奔溃&#xff0c;就会引起一系列问题。为了解决这个问题&#xff0c;就会引入重试的机制&#xff0c;重试又会引入幂等性的问题&#xff0c;下面我们就分析这个过程&…

电磁兼容(EMC):传导骚扰差模频段超标机理及解决方案

目录 1 家用电器传导发射限值要求 2 传导测量等效电路 3 传导测试数据差、共模干扰分段 4 差模干扰源分析及解决方案 电子产品需要满足电磁兼容EMC要求&#xff0c;EMC包括抗扰度试验&#xff08;EMS&#xff09;和辐射类试验&#xff08;EMI&#xff09;&#xff0c;发射类…

如何编写接口测试用例

作为测试人&#xff0c;我们经常要对项目中的接口进行接口测试&#xff0c;那么在做接口测试的时候&#xff0c;如何写接口测试用例呢&#xff1f; 什么是接口测试 首先我们要了解一下&#xff0c;什么是接口测试&#xff1f; 那么首先要搞清楚&#xff0c;我们一般说的接口…

<设计模式>单例模式懒汉和饿汉

目录 一、单例模式概述 二、懒汉模式和饿汉模式 1.饿汉模式 1.1代码实现 1.2实现细节 1.3模式优劣 2.懒汉模式 2.1代码实现 2.2实现细节 2.3模式优劣 三、多线程下的线程安全问题 1.懒汉和饿汉线程安全问题分析 1.1安全的饿汉模式 1.2不安全的懒汉模式 2.懒汉线程…

Jenkins(三):自动化部署SpringBoot项目

前言 在软件开发过程中&#xff0c;自动化部署已经成为不可或缺的一环。Jenkins是一个广泛使用的开源自动化部署工具&#xff0c;它提供了强大的功能和灵活的配置选项&#xff0c;可以帮助开发团队实现高效的持续集成和持续部署。本文将详细介绍如何使用Jenkins自动化部署Spri…

爬取58二手房并用SVR模型拟合

目录 一、前言 二、爬虫与数据处理 三、模型 一、前言 爬取数据仅用于练习和学习。本文运用二手房规格sepc(如3室2厅1卫)和二手房面积area预测二手房价格price&#xff0c;只是练习和学习&#xff0c;不代表如何实际意义。 二、爬虫与数据处理 import requests import cha…

EasyX图形库学习(二、文字输出)

目录 一、文字绘制函数 字体属性结构体:logfont 文字输出 outtextxy 在指定位置输出字符串。 ​编辑 但如果直接使用,可能有以下报错&#xff1a; 三种解决方案&#xff1a; 将一个int类型的分数,输出到图形界面上 如果直接使用&#xff1a; 会把score输入进去根据A…

【Vue.js设计与实现】第二篇:响应系统-阅读笔记(持续更新)

从高层设计的角度去探讨框架需要关注的问题。 系列目录&#xff1a; 标题博客第一篇&#xff1a;框架设计概览【Vue.js设计与实现】第一篇&#xff1a;框架设计概览-阅读笔记第二篇&#xff1a;响应系统【Vue.js设计与实现】第二篇&#xff1a;响应系统-阅读笔记第三篇&#x…

洗地机哪个品牌质量好?盘点当下最值得买的4款洗地机型号推荐

随着生活节奏的加快&#xff0c;人们对于家庭清洁的需求也越来越迫切。而洗地机作为家庭清洁利器备受青睐&#xff0c;但洗地机也分为很多款式&#xff0c;每一个款式都具备不同的清洁效果&#xff0c;可以节省不少时间。接下来&#xff0c;就由笔者为大家详细介绍一下洗地机哪…

如何去除图片水印?三个简单实用方法

随着数字时代的来临&#xff0c;我们每天都会接触到大量的图片&#xff0c;然而&#xff0c;许多图片却因为水印而影响了美观。为了解决这个问题&#xff0c;我们需要图片去水印的方法。今天&#xff0c;我们就来为大家介绍几个简单实用的方法&#xff0c;可以轻松去除水印&…

备战蓝桥杯---搜索(优化1)

显然&#xff0c;我们可以用BFS解决&#xff0c;具体实现与八数码类似&#xff1a; 下面是代码&#xff1a; #include<bits/stdc.h> using namespace std; #define N 3000000 string a,b; int hh,dis[N],cnt; struct node{string u,v; }bian[7]; map<string,int>…

Flutter 和 Android原生(Activity、Fragment)相互跳转、传参

前言 本文主要讲解 Flutter 和 Android原生之间&#xff0c;页面相互跳转、传参&#xff0c; 但其中用到了两端相互通信的知识&#xff0c;非常建议先看完这篇 讲解通信的文章&#xff1a; Flutter 与 Android原生 相互通信&#xff1a;BasicMessageChannel、MethodChannel、…

MongoDB复制集实战及原理分析

文章目录 MongoDB复制集复制集架构三节点复制集模式PSS模式&#xff08;官方推荐模式&#xff09;PSA模式 典型三节点复制集环境搭建复制集注意事项环境准备配置复制集复制集状态查询使用mtools创建复制集安全认证复制集连接方式 复制集成员角色属性一&#xff1a;Priority 0属…

match-case与if/elif/else(python)

if/elif/else语句应对一般场景&#xff0c;match-case主打复杂条件分支语句。 (笔记模板由python脚本于2024年01月28日 18:27:37创建&#xff0c;本篇笔记适合有一定编程基础&#xff0c;对python基础已比较扎实的coder翻阅) 【学习的细节是欢悦的历程】 Python 官网&#xff1…