# 0 前言
Hi,大家好,今天给大家介绍一个大数据可视化项目,大家可以用于自己的课设或毕设,可以灵活耦合任意数据,为自己的项目添加灵活的可视化动态效果!
今天要分享的是:
包含内容:
项目获取:https://gitee.com/sinonfin/system-sharing
大数据大屏可视化系列:
可搭载任意自己想用的数据,动态效果不错
整体实现效果如下,可以看到CSS优化相对漂亮的,而且动态效果也很好,适合搭载各种数据。
<!-- 声明文档类型 -->
<!DOCTYPE html>
<html lang="en">
<head>
<!-- 指定网页字符编码 -->
<meta charset="UTF-8">
<!-- 适配移动端 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="refresh" content="15>
<title>全国疫情实时监控</title>
<link rel="stylesheet" href="css/index.css">
</head>
<body>
<div id="title">全国疫情实时监控</div>
<div id="left1">
</div>
<div id="left2">
</div>
<div id="center1">
<div class="item">
<div class="number" id="confirm"></div>
<div class="text">累计确诊</div>
</div>
<div class="item">
<div class="number" id="heal"></div>
<div class="text">累计治愈</div>
</div>
<div class="item">
<div class="number" id="dead"></div>
<div class="text">累计死亡</div>
</div>
<div class="item">
<div class="number" id="nowConfirm"></div>
<div class="text">现有确诊</div>
</div>
<div class="item">
<div class="number" id="noInfect"></div>
<div class="text">无症状感染者</div>
</div>
<div class="item">
<div class="number" id="importedCase"></div>
<div class="text">境外输入</div>
</div>
</div>
<div id="center2">
</div>
<div id="right1"></div>
<div id="right2"></div>
<script src="js/data.js"></script>
<script src="js/center1.js"></script>
<script src="js/echarts.min.js"></script>
<script src="js/china.js"></script>
<script src="js/center2.js"></script>
<script src="js/left1.js"></script>
<script src="js/left2.js"></script>
<script src="js/right1.js"></script>
<script src="js/right2.js"></script>
</body>
</html>
项目获取:https://gitee.com/sinonfin/system-sharing