HTML+CSS+JS实现Echart大屏展示_echar富文本跳转资源-CSDN文库

共22个文件

png：6个

js：6个

html：1个

echarts

需积分: 48 88 浏览量 2022-04-11 21:10:30 上传评论 2 收藏 1004KB ZIP 举报

资源详情

资源评论

资源推荐

收起资源包目录

HTML+CSS+JS实现Echart大屏展示.zip （22个子文件）

code

css

index.less 6KB

index.css.map 2KB

index.css 5KB

images

map.png 302KB

head_bg.png 8KB

jt.png 72KB

lbx.png 81KB

bg.jpg 252KB

line(1).png 4KB

weather.png 2KB

index.html 4KB

jquery.js 82KB

flexible.js 1KB

myMap.js 9KB

index.js 21KB

china.js 136KB

echarts.min.js 727KB

.idea

code.iml 469B

modules.xml 267B

.gitignore 103B

font

DS-DIGIT.TTF 25KB

doc

HTML+CSS+JS实现Echart大屏展示.md 41KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0" /> <title>可视化</title> <link rel="stylesheet" href="css/index.css" /> </head> <body>  <header> <h1>数据可视化大屏展示</h1> <div class="showTime"></div> <script> var t = null; t = setTimeout(time, 1000);//開始运行 function time() { clearTimeout(t);//清除定时器 dt = new Date(); var y = dt.getFullYear(); var mt = dt.getMonth() + 1; var day = dt.getDate(); var h = dt.getHours();//获取时 var m = dt.getMinutes();//获取分 var s = dt.getSeconds();//获取秒 document.querySelector(".showTime").innerHTML = '当前时间：' + y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" + s + "秒"; t = setTimeout(time, 1000); //设定定时器，循环运行 } </script> </header>  <section class="mainbox"> <div class="column"> <div class="panel bar"> <h2>柱形图-就业行情 <a href="javascript:;">2020</a><a href="javascript:;">2021</a> </h2> <div class="chart"></div> <div class="panel-footer"></div> </div> <div class="panel line"> <h2>折线图-人员变化 <a href="javascript:;">2020</a><a href="javascript:;">2021</a> </h2> <div class="chart">图标</div> <div class="panel-footer"></div> </div> <div class="panel pie"> <h2>饼状图-年龄分布</h2> <div class="chart">图标</div> <div class="panel-footer"></div> </div> </div> <div class="column"> <div class="no"> <div class="no-hd"> <ul> <li>123456</li> <li>123456</li> </ul> </div> <div class="no-bd"> <ul> <li>前端需求人数</li> <li>市场供应人数</li> </ul> </div> </div>  <div class="map"> <div class="map1"></div> <div class="map2"></div> <div class="map3"></div> <div class="chart"></div> </div> </div> <div class="column"> <div class="panel bar2"> <h2>柱形图-就业行业</h2> <div class="chart">图标</div> <div class="panel-footer"></div> </div> <div class="panel line2"> <h2>折线图-播放量</h2> <div class="chart">图标</div> <div class="panel-footer"></div> </div> <div class="panel pie2"> <h2>饼状图-区域分布</h2> <div class="chart">图标</div> <div class="panel-footer"></div> </div> </div> </section> <script src="js/flexible.js"></script>  <script src="js/jquery.js"></script> <script src="js/echarts.min.js"></script> <script src="js/index.js"></script> <script src="js/china.js"></script> <script src="js/myMap.js"></script> <script src="js/size.js"></script> </body> </html>