index.html trend.html

1.jq22模板下载:http://www.jq22.com/jquery-info22538
2.layUI下载(layUI-v2.5.5):https://www.layui.com/
3.jquery下载(Development 3.4.1):https://jquery.com/download/
【网页直接打开文件Ctrl+S即可】
4.ecahrts下载:https://www.echartsjs.com/zh/download.html
【选择方法三在线定制】
5.webstorm激活码:https://blog.csdn.net/ft_sunshine/article/details/92065158
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>功耗分析</title><link href="../css/common.css" rel="stylesheet"><link rel="stylesheet" href="../plugins/layui/css/layui.css"><script src="../plugins/jquery-3.3.1.min.js"></script><script src="https://www.jq22.com/jquery/echarts-4.2.1.min.js"></script><script src="../plugins/bmap.min.js"></script><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=5ieMMexWmzB9jivTq6oCRX9j&callback"></script><script src="../js/common.js"></script><script src="../js/index.js"></script><script src="../plugins/laydate/laydate.js"></script><script src="../plugins/layui/layui.js"></script>
</head>
<body>
<!--顶部-->
<header class="header left"><div class="left nav"><ul><li class="nav_active"><i class="nav_1"></i><a href="index.html">XXXX</a> </li><li><i class="nav_2"></i><a href="quota.html">XXXX</a> </li><li><i class="nav_3"></i><a href="trend.html">XXXX</a> </li><li><i class="nav_4"></i><a href="chronic.html">XXXX</a> </li></ul></div><div class="header_center left" style="position:relative"><h2><strong>Modem功耗自动化分析</strong></h2></div><div class="right nav text_right"><ul></ul></div></header>
<!--内容部分-->
<div class="con left"><div style="color:white; font-size: 18px;margin-left: 3%">2019-12-01  00:00-23:00</div><!--数据总概--><div class="con_div"><div class="con_div_text left"><div class="layui-progress layui-progress-big " lay-showPercent="true" style="height: 50%;margin-top: 3%;margin-left: 1%"><div class="layui-progress-bar" lay-percent="40%" style="height: 100%;background-color: #ff4e4e !important"></div></div><p style="font-size: x-large;color:white;text-align: center">XXXX</p></div><div class="con_div_text left"><div class="layui-progress layui-progress-big " lay-showPercent="true" style="height: 50%;margin-top: 3%;margin-left: 1%"><div class="layui-progress-bar" lay-percent="90%" style="height: 100%;background-color: green"></div></div><p style="font-size: x-large;color:white;text-align: center">XXXX</p></div><div class="con_div_text left"><div class="layui-progress layui-progress-big " lay-showPercent="true" style="height: 50%;margin-top: 3%;margin-left: 1%"><div class="layui-progress-bar" lay-percent="80%" style="height: 100%;background-color: blueviolet"></div></div><p style="font-size: x-large;color:white;text-align: center">XXXX</p></div><div class="con_div_text left"><div class="layui-progress layui-progress-big " lay-showPercent="true" style="height: 50%;margin-top: 3%;margin-left: 1%"><div class="layui-progress-bar" lay-percent="65%" style="height: 100%;background-color: yellow"></div></div><p style="font-size: x-large;color:white;text-align: center">XXXX</p></div></div><!--统计分析图--><div class="div_any"><div class="left div_any01"><div  class="div_any_child" lay-show="flase"><div class="div_any_title"><img src="../img/jq22-images/title_1.png">各医院采集数据量</div><div  id="main"></div></div><div class="div_any_child"><div class="div_any_title"><img src="../img/jq22-images/title_2.png">各医院门诊住院费用</div><p id="histogramChart" class="p_chart"></p></div></div><div class="div_any02 left "><div   class="div_any_child div_height"  ><div class="div_any_title any_title_width" style="z-index: 999"><img src="../img/jq22-images/title_0.png">XXXXX </div><div id ="main1" style="width:97.5%;height:93%;display: inline-block;padding-left: 1.25%;padding-top:2.2%;background-color: white"></p></div></div></div></div>
</body>
<script>//注意进度条依赖 element 模块,否则无法进行正常渲染和功能性操作layui.use('element', function(){var element = layui.element;});
</script>
<script type="text/javascript">// 基于准备好的dom,初始化echarts实例var myChart = echarts.init(document.getElementById('main'));// 指定图表的配置项和数据var option = {series: [{type: 'treemap',data: [{name: 'nodeA',            // First treevalue: 10,children: [{name: 'nodeAa',       // First leaf of first treevalue: 4}, {name: 'nodeAb',       // Second leaf of first treevalue: 6}]}, {name: 'nodeB',            // Second treevalue: 20,children: [{name: 'nodeBa',       // Son of first treevalue: 20,children: [{name: 'nodeBa1',  // Granson of first treevalue: 20}]}]}]}]};// 使用刚指定的配置项和数据显示图表。myChart.setOption(option);
</script>
<script>//myChart1.showLoading();$.get('../data/product.json', function (data) {var myChart1 = echarts.init(document.getElementById('main1'));myChart1.hideLoading();myChart1.setOption(option = {title: {text: 'Sankey Diagram'},tooltip: {trigger: 'item',triggerOn: 'mousemove'},series: [{type: 'sankey',data: data.nodes,links: data.links,focusNodeAdjacency: true,levels: [{depth: 0,itemStyle: {color: '#fbb4ae'},lineStyle: {color: 'source',opacity: 0.6}}, {depth: 1,itemStyle: {color: '#b3cde3'},lineStyle: {color: 'source',opacity: 0.6}}, {depth: 2,itemStyle: {color: '#ccebc5'},lineStyle: {color: 'source',opacity: 0.6}}, {depth: 3,itemStyle: {color: '#decbe4'},lineStyle: {color: 'source',opacity: 0.6}}],lineStyle: {normal: {curveness: 0.5}}}]});});
</script>
</html>
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>数据可视化demo</title><link href="../css/common.css" rel="stylesheet"><link rel="stylesheet" href="../plugins/layui/css/layui.css"><script src="../plugins/jquery-3.3.1.min.js"></script><script src="../plugins/jquery-3.3.1.min.js"></script><script src="https://www.jq22.com/jquery/echarts-4.2.1.min.js"></script><script src="../js/common.js"></script><script src="../js/trend.js"></script><script src="../plugins/layui/layui.js"></script>
</head>
<body>
<!--顶部-->
<header class="header left"><div class="left nav"><ul><li><i class="nav_1"></i><a href="index.html">XXXX</a> </li><li><i class="nav_2"></i><a href="quota.html">XXXX</a> </li><li><i class="nav_3"></i><a href="trend.html">XXXX</a> </li><li class="nav_active"><i class="nav_4"></i><a href="chronic.html">XXXX</a> </li></ul></div><div class="header_center left" style="position:relative"><h2><strong>Modem功耗自动化分析</strong></h2></div></header>
<!--内容部分--><!--统计分析图--><div class="layui-collapse" lay-accordion><div class="layui-colla-item"><h2 class="layui-colla-title">杜甫</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">李清照</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">鲁迅</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">杜甫</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">杜甫</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">杜甫</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">杜甫</h2><div class="layui-colla-content layui-show">内容区域</div></div><div class="layui-colla-item"><h2 class="layui-colla-title">杜甫</h2><div class="layui-colla-content layui-show">内容区域</div></div></div></body>
<script>layui.use('element', function(){var element = layui.element;});
</script>
</html>

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

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

Starlink星链计划能与5G抗衡?看一下马斯克吹过的牛

文章目录 一、Starlink星链计划是什么&#xff1f;1. 卫星发射情况2. 性能测试 二、5G 通信性能1. 通信速度2.通信时延3. 速度快的主要原因4. 系统容量 三、Starlink 与 5G 的对比1. 覆盖范围2. 通信速度 四、Starlink 的优势1. 局部地区的网络服务2. 军事服务3. 未来远景 一、…

docker基础使用

docker下载centos镜像(用作配置jdk环境系统) docker pull centos #版本号可以自己加,默认拉取最新的 docker命令 docker search xxxx 搜索xxxx镜像 docker pull xxxx 下载xxxx镜像&#xff0c;版本号…

Keras--基于VGG16卷积神经网络---猫狗分类

Cats vs. Dogs&#xff08;猫狗大战&#xff09;来源于 Kaggle 上的一个竞赛&#xff0c;内容非常简单&#xff0c; Kaggle 提供了一个猫和狗的数据集&#xff0c;我们需要建立一个算法进行训练&#xff0c;最后这个算法要能准确识别出猫和狗。Kaggle 提供的数据集分为训练集…

软件欺诈的骗局揭露:“替罪羊”究竟是如何构建的?

创建一个能工作的软件产品是很困难的&#xff0c;卖欺诈性的软件产品要容易得多。 声明&#xff1a;本文已获作者Matt Stancliff翻译授权。 作者 | Matt Stancliff 译者 | 苏本如&#xff0c;责编 | 郭芮 头图 | CSDN 下载自东方 IC 出品 | CSDN&#xff08;ID&#xff1a;CSDN…

什么?我要对AI礼貌?人机交互面临的道德漏洞

作者 | 库珀 来源 | 数据实战派 头图 | 付费下载于 IC Photo 如果你在一条道路上行驶&#xff0c;突然前面拐弯处出现一辆无人驾驶汽车&#xff0c;你会继续坚持你的道路优先权&#xff0c;还是让位使它先过去&#xff1f; 目前&#xff0c;我们大多数人在涉及其他人的情况下能…

Docker安装 elasticsearch-head

目录 前言安装elasticsearch-head步骤1&#xff1a;准备1. 安装docker2. 搜索可以使用的镜像。3. 也可从docker hub上搜索镜像。4. 选择合适的redis镜像。 步骤2&#xff1a;拉取elasticsearch-head镜像拉取镜像查看已拉取的镜像 步骤3&#xff1a;创建容器创建容器方式1&#…

猿创征文|瑞吉外卖——管理端_菜品管理_1

个人名片&#xff1a; 博主&#xff1a;酒徒ᝰ. 专栏&#xff1a;瑞吉外卖 个人简介&#xff1a;沉醉在酒中&#xff0c;借着一股酒劲&#xff0c;去拼搏一个未来。 本篇励志&#xff1a;真正的程序员不看参考手册&#xff0c;新手和胆小鬼才会看。 本项目基于B站黑马程序员Jav…

【CSS】CSS 布局——常规流布局

<h1>基础文档流</h1><p>我是一个基本的块级元素。我的相邻块级元素在我的下方另起一行。</p><p>默认情况下&#xff0c;我们会占据父元素 100%的宽度&#xff0c;并且我们的高度与我们的子元素内容一样高。我们的总宽度和高度是我们的内容 内边距…

SpringBoot整合、SpringBoot与异步任务

目录 一、背景描述二、简单使用方法三、原理五、使用自定义线程池六、Async失效情况 一、背景描述 java 的代码是同步顺序执行&#xff0c;当我们需要执行异步操作时我们通常会去创建一个新线程去执行。比如new Thread()。start()&#xff0c;或者使用线程池线程池 new Thread…

stm工程文件夹

STM32工程文件构成 从下图可以看出我们的工程目录是由CORE、OBJ、STM32F10x_FWLib、USER、SYSTEM以及HARDWARE文件夹组成的。此外还有一个文本文档README.TXT、以及一个Windows 批处理文件 (.bat)keilkilll.bat。 1、CORE文件夹 CORE文件夹下一共有三个文件&#xff0c;它们分…

STL文件及其读取

1引言 STL(Stereo lithographic)文件格式是美国3D SYSTEMS公司提出的三维实体造型系统的一个接口标准&#xff0c;其接口格式规范。采用三角形面片离散地近似表示三维模型&#xff0c;目前已被工业界认为是快速成形(rapid prototypi ng)领域的标准描述文件格式。在逆向工程、有…

Python-OpenCV中的图像处理-直方图

Python-OpenCV中的图像处理-直方图 直方图统计直方图绘制直方图Matplotlib绘制灰度直方图Matplotlib绘制RGB直方图 使用掩膜统计直方图直方图均衡化Numpy图像直方图均衡化OpenCV中的直方图均衡化CLAHE 有限对比适应性直方图均衡化 2D直方图OpenCV中的2D直方图Numpy中2D直方图 直…

基于frida检测demo来学习frida检测及anti

原文地址:https://www.zhuoyue360.com/crack/108.html 前言 随着逆向的攻防强度不断的提升,目前主流的移动安全厂商的加固服务基本上都已包含了常见Hook框架的反调试,我们最常见的hook工具如下: fridaxposed 为了更好的提升自己相关的经验,我们可以拿这类demo来进行原理的学…

腾讯云轻量应用服务器镜像应用模板清单大全

腾讯云轻量应用服务器支持多种应用模板镜像&#xff0c;Windows和Linux镜像模板都有&#xff0c;如&#xff1a;宝塔Linux面板腾讯云专享版、WordPress、WooCommerce、LAMP、Node.js、Docker CE、K3s、宝塔Windows面板和ASP.NET等应用模板镜像&#xff0c;腾讯云服务器网分享腾…

聊一下互联网开源变现

(点击即可收听) 互联网开源变现其实是指通过开源软件或者开放源代码的方式&#xff0c;实现收益或盈利。这种方式越来越被广泛应用于互联网行业 在互联网开源变现的模式中&#xff0c;最常见的方式是通过捐款、广告、付费支持或者授权等方式获利。 例如&#xff0c;有些开源软件…

Linux 基础(五)常用命令-文件属性

文件属性 文件权限文件属性修改文件权限属性 文件所有者 文件权限 文件属性 Linux中文件权限 可以通过文件属性体现&#xff1b; 使用 ll 查看文件列表 最前面的 l d 表示文件类型 1 5 表示硬链接数 或者 子文件夹个数 所属用户 所属用户组 文件大小 创建/更新时间 文件&…

首个女性向3A手游要来了?获IGN认可,《以闪亮之名》能否突出重围

最近的手游市场可以说是热度十足&#xff0c;各大厂商都发布了旗下新作的消息&#xff0c;3A高自由度似乎成了所有新游的主基调&#xff0c;但说起与众不同&#xff0c;那便不得不说这款《以闪亮之名》&#xff0c;这是本季度新游中唯一一个女性向3A作品。 这款手游主打超自由时…

2009年“五一”假期市民旅游指南

信息来源于&#xff1a;上海旅游官网 为使广大市民更好地领略上海的都市风情&#xff0c;满足 市民的旅游消费需求&#xff0c;丰富节日生活 &#xff0c;本市部分景点 、旅游企业 精心策划&#xff0c;积极准备&#xff0c;推出一系列适合市民市内旅游的节目&#xff0c;在…

常州嬉戏谷游玩全攻略

攻略导读&#xff1a;常州环球动漫嬉戏谷&#xff0c;一座国际动漫游戏体验博览园&#xff0c;颠覆传统&#xff0c;突破创新&#xff0c;定位鲜明&#xff0c;以满足逾4亿中国互联网用户的庞大娱乐需求为目标&#xff0c;以更适合未来前往的体验型公园为前瞻。假面文化的“梦幻…

第四十八周周报

学习目标&#xff1a; 修改ViTGAN 学习内容&#xff1a; 位置编码和多尺度 学习时间&#xff1a; 8.5-8。12 学习产出&#xff1a; 这两周主要工作在修改ViTGAN的结构和代码&#xff0c;将相对位置编码加入ViTGAN并将生成器变为多尺度&#xff0c;由于匹配维度很困难&am…