现在冠状病毒肆虐，假期不断充值，大家都被迫困在家里，闲来无事在导航站添加了新型冠状病毒 COVID-19 疫情实时数据，效果如下：(演示站:http://us.wpon.cn)
数据来源于丁香园，数据api来源于：BlankerL
添加方法
WebStack Pro 导航主题复制下方代码到主题文件 index.php 的搜索模块下方（注意主题的 <?php ?>标签）。
其他主题请放到需要显示的位置，然后自行调整 css 样式。
?>
<div class="row row-sm" style="position: relative;">
<div class="col-12">
<div class="card" style="color:#fff;background-color:#61adff">
<div class="card-body py-2">
<div class="d-flex flex-fill text-sm">
<span>新型冠状病毒数据</span>
<div class="flex-fill"></div>
<div>截至 <span id="updateTime">0000-00-00 00:00:00</span></div>
</div>
</div>
</div>
</div>
<div class="col-6 col-md-3">
<div class="card" style="color:#fff;background-color:#FF464D">
<div class="card-body py-3">
<div class="d-flex flex-fill text-md mb-4">
<span>确诊</span>
<div class="flex-fill"></div>
<span class="text-sm">较昨日：<span id="confirmedIncr">00</span></span>
</div>
<h1 id="confirmedCount" class="h2 m-0">000</h1>
</div>
</div>
</div>
<div class="col-6 col-md-3">
<div class="card" style="color:#fff;background-color:#FFA746">
<div class="card-body py-3">
<div class="d-flex flex-fill text-md mb-4">
<span>疑似</span>
<div class="flex-fill"></div>
<span class="text-sm">较昨日：<span id="suspectedIncr">00</span></span>
</div>
<h1 id="suspectedCount" class="h2 m-0">000</h1>
</div>
</div>
</div>
<div class="col-6 col-md-3">
<div class="card" style="color:#fff;background-color:#67727d">
<div class="card-body py-3">
<div class="d-flex flex-fill text-md mb-4">
<span>死亡</span>
<div class="flex-fill"></div>
<span class="text-sm">较昨日：<span id="deadIncr">00</span></span>
</div>
<h1 id="deadCount" class="h2 m-0">000</h1>
</div>
</div>
</div>
<div class="col-6 col-md-3">
<div class="card" style="color:#fff;background-color:#02B88C">
<div class="card-body py-3">
<div class="d-flex flex-fill text-md mb-4">
<span>治愈</span>
<div class="flex-fill"></div>
<span class="text-sm">较昨日：<span id="curedIncr">00</span></span>
</div>
<h1 id="curedCount" class="h2 m-0">000</h1>
</div>
</div>
</div>
<div class="col-12 col-md-6 d-none d-md-block">
<div class="card" style="">
<div class="card-body py-3">
<h1 class="h5 mb-3">病毒资料</h1>
<div class="overflow-auto" style="height:100px">
<div id="bd_note">
<div class="text-sm mb-2"><i class="iconfont icon-point mr-2"></i><span id="note1"></span></div>
<div class="text-sm mb-2"><i class="iconfont icon-point mr-2"></i><span id="note2"></span></div>
<div class="text-sm mb-2"><i class="iconfont icon-point mr-2"></i><span id="note3"></span></div>
</div>
</div>
<div class="d-flex flex-fill text-xs text-muted pt-2 mb-n2">
<span>数据来源：<a href= "https://ncov.dxy.cn/ncovh5/view/pneumonia" target="_blank" rel='external nofollow' style="color:#6c757d">丁香园</a></span>
<div class="flex-fill"></div>
<span><a href= "https://lab.isaaclin.cn/nCoV/" target="_blank" rel='external nofollow' style="color:#6c757d">API</a></span>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6">
<div class="card" style="">
<div class="card-body py-3">
<h1 class="h5 mb-3">疫情资讯</h1>
<div class="overflow-auto" style="height:100px">
<div id="bd_news">
</div>
</div>
<div class="d-flex flex-fill text-xs text-muted pt-2 mb-n2">
<span>数据来源：<a href= "https://ncov.dxy.cn/ncovh5/view/pneumonia" target="_blank" rel='external nofollow' style="color:#6c757d">丁香园</a></span>
<div class="flex-fill"></div>
<span><a href= "https://lab.isaaclin.cn/nCoV/" target="_blank" rel='external nofollow' style="color:#6c757d">API</a></span>
</div>
</div>
</div>
</div>
<div id="bd-loading" class="ajax-loading text-center rounded" style="position:absolute;display:flex;width:100%;top:-1rem;bottom:.5rem;background:rgba(125,125,125,.5)"><div id="bd-success" class="col align-self-center"><i class="iconfont icon-loading icon-spin icon-2x"></i></div></div>
</div>
<script>
let url = "https://lab.isaaclin.cn/nCoV/api/overall";
let newsurl = "https://lab.isaaclin.cn/nCoV/api/news";
$.getJSON(url,function(data,status){
let res = data["results"][0];
$("#confirmedCount").text(res["confirmedCount"]);
$("#confirmedIncr").text(res["confirmedIncr"] ? res["confirmedIncr"] : '待更新');
$("#suspectedCount").text(res["suspectedCount"]);
$("#suspectedIncr").text(res["suspectedIncr"] ? res["suspectedIncr"] : '待更新');
$("#curedCount").text(res["curedCount"]);
$("#curedIncr").text(res["curedIncr"] ? res["curedIncr"] : '待更新');
$("#deadCount").text(res["deadCount"]);
$("#deadIncr").text(res["deadIncr"] ? res["deadIncr"] : '待更新');
$("#note1").text(res["note1"]);
$("#note2").text(res["note2"]);
$("#note3").text(res["note3"]);
$("#updateTime").text(timestampToTime(res["updateTime"],1));
$("#bd-loading").hide();
}).fail(function () {
$("#bd-success").html('被api服务器屏蔽，请稍后再试，说明：<a href= "https://lab.isaaclin.cn/nCoV/" rel="external nofollow" target="_blank">API</a>');
});
$.getJSON(newsurl,function(data,status){
let res = data["results"][0];
let html = '';
for(let item of data['results']) {
html += '<div class="text-sm mb-2">'+timestampToTime(item['pubDate'],1,true)+'<a class="ml-2" href="'+item['sourceUrl']+'" target="_blank" rel="external nofollow">'+item['title']+'</a></div>';
}
$("#bd_news").html(html);
}).fail(function () {
$("#bd-success").html('被api服务器屏蔽，请稍后再试，说明：<a href= "https://lab.isaaclin.cn/nCoV/" rel="external nofollow" target="_blank">API</a>');
});
function timestampToTime(timestamp,s,time = false) {
var date = new Date(timestamp * s);
Y = date.getFullYear() + '-';
M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
D = date.getDate() + ' ';
h = date.getHours();
m = ':' + (date.getMinutes() < 10 ? '0'+(date.getMinutes()) : date.getMinutes());
s = ':' + (date.getSeconds() < 10 ? '0'+(date.getSeconds()) : date.getSeconds());
if(time)
return h+m;
else
return Y+M+D+h+m+s;
}
</script>
<?php
数据获取不到请使用站长接口:
let url = "https://china.wpon.cn/novelcoronavirus/DXY-COVID-19-Data-master/json/DXYOverall.json"; let newsurl = "https://china.wpon.cn/novelcoronavirus/DXY-COVID-19-Data-master/json/DXYNews.json";
更换地址:上面代码第100-101行直接替换即可!
注意：GitHub数据库仓库有1个小时左右的数据延时，但获取速度稳定。
演示排版:
新型冠状病毒数据
截至 2020-02-16 17:07:16
确诊
较昨日：2014
68589
疑似
较昨日：1918
8228
死亡
较昨日：142
1666
治愈
较昨日：1485
