TianZD/hexo_blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

new

Browse Source
This commit is contained in:
tianzhendong
2022-04-25 13:40:12 +08:00
commit 41f187e460
349 changed files with 60741 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
themes/matery/layout/census.ejs
+54
View File
@@ -0,0 +1,54 @@
<%- partial('_partial/bg-cover') %>
<script type="text/javascript" src="<%- theme.jsDelivr.url %><%- url_for(theme.libs.js.echarts) %>"></script>
<main class="content">
<div class="container">
<div class="card">
<div class="card-content">
<div id="uv-container" style="min-width: 250px; height: 400px; margin-top: 50px; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1609569953900">
<div style="position: relative; width: 800px; height: 400px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1000" height="500" style="position: absolute; left: 0px; top: 0px; width: 800px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px / 21px &quot;Microsoft YaHei&quot;; padding: 5px; left: 146px; top: 150px; pointer-events: none;">二月<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#d223e7;"></span>2020年访客数: -<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#3F77FE;"></span>2021年访客数: 2,225</div></div>
<div id="pv-container" style="min-width: 250px; height: 400px; margin-top: 50px; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1609569953901"><div style="position: relative; width: 800px; height: 400px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1000" height="500" style="position: absolute; left: 0px; top: 0px; width: 800px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px / 21px &quot;Microsoft YaHei&quot;; padding: 5px; left: 577px; top: 315px; pointer-events: none;">九月<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#01C2F9;"></span>2020年访问量: 14,501<br><span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#18D070;"></span>2021年访问量: 9,436</div></div>
<div id="refer-container" style="min-width: 250px; height: 400px; margin-top: 50px; -webkit-tap-highlight-color: transparent; user-select: none; position: relative;" _echarts_instance_="ec_1609569953902"><div style="position: relative; width: 800px; height: 400px; padding: 0px; margin: 0px; border-width: 0px; cursor: default;"><canvas data-zr-dom-id="zr_0" width="1000" height="500" style="position: absolute; left: 0px; top: 0px; width: 800px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); padding: 0px; margin: 0px; border-width: 0px;"></canvas></div><div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px / 21px &quot;Microsoft YaHei&quot;; padding: 5px; left: 538px; top: 206px; pointer-events: none;">访问来源 <br>直达: 3412 (52.67%)</div></div> </div>
</div>
</div>
<script>
var uvChart=echarts.init(document.getElementById('uv-container'),'shine');
var option={color:['#d223e7','#3F77FE','#01C2F9','#18D070'],title:{text:'站点访客数统计',subtext:'数据来源: 百度统计（自 2020/01/01 开始统计）',textStyle:{color:'#504b4d',}},tooltip:{trigger:'axis'},
legend:{data:['2020年访客数','2021年访客数'],bottom:0,left:'center',textStyle:{color:'#504b4d',}},//修改年份
toolbox:{show:true,feature:{mark:{show:true},magicType:{show:true,type:['line','bar','stack','tiled']},restore:{show:true},saveAsImage:{show:true}}},
calculable:true,xAxis:[{type:'category',boundaryGap:false,data:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],yAxis:[{type:'value',axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],
series:[{name:'2020年访客数',type:'line',smooth:true,itemStyle:{normal:{areaStyle:{type:'default'}}},
data:[788,2225,3145,2522,2798,2442,4028,3556,2835,2331,2423,1124],//第一个年份对应的数据顺序对应月份
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}},},
{name:'2021年访客数',type:'line',smooth:true,itemStyle:{normal:{areaStyle:{type:'default'}}},
data:[2152,1656,2836,4606,null,null,null,null,null,null,null,null],//第二个年份对应的数据顺序对应月份
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}},}]};
uvChart.setOption(option);var pvChart=echarts.init(document.getElementById('pv-container'));
var pv_option={color:['#01C2F9','#18D070','#d223e7','#3F77FE'],
title:{text:'站点访问量统计',subtext:'数据来源: 百度统计（自 2020/01/01 开始统计）',
textStyle:{color:'#504b4d',}},legend:{data:['2020年访问量','2021年访问量'],//修改年份
bottom:0,left:'center',textStyle:{color:'#504b4d',}},
tooltip:{trigger:'axis'},toolbox:{show:true,feature:{mark:{show:true},
magicType:{show:true,type:['line','bar','stack','tiled']},
restore:{show:true},saveAsImage:{show:true}}},calculable:true,
xAxis:[{type:'category',boundaryGap:false,data:['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],yAxis:[{type:'value',axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}],
series:[{name:'2020年访问量',type:'line',stack:'总量',data:[1101,2909,3784,2978,3090,2682,5207,4887,4436,3047,3262,2474],axisLabel:{formatter:'{value}',//第一个年份对应的数据顺序对应月份
textStyle:{color:'#929298'}}},{name:'2021年访问量',type:'line',stack:'总量',data:[6648,3882,5580,8817,null,null,null,null,null,null,null,null],//第二个年份对应的数据顺序对应月份
axisLabel:{formatter:'{value}',textStyle:{color:'#929298'}}}]};
pvChart.setOption(pv_option);
var referChart=echarts.init(document.getElementById('refer-container'));
var refer_option={title:{text:'站点访客来源统计',itemGap:20,subtext:'数据来源: 百度统计（最近30天的统计数据）',left:'right',textStyle:{color:'#504b4d',}},
tooltip:{trigger:'item',
formatter:'{a} <br/>{b}: {c} ({d}%)'},
legend:{orient:'vertical',left:10,data:['直达','百度','Google','Bing','其他'],//来源
textStyle:{color:'#929298',}},series:[{name:'访问来源',type:'pie',selectedMode:'single',radius:[0,'30%'],label:{position:'inner'},labelLine:{show:false},
data:[{value:4067,name:'直接访问',selected:true},{value:423,name:'外链'},{value:4327,name:'搜索'}]},//大类数据，修改value后面的值
{name:'访问来源',type:'pie',radius:['40%','55%'],
label:{formatter:'{a|{a}}{abg|}\n{hr|}\n {b|{b}：}{c} {per|{d}%} ',backgroundColor:'#eee',borderColor:'#aaa',borderWidth:1,borderRadius:4,rich:{a:{color:'#999',lineHeight:22,align:'center'},hr:{borderColor:'#aaa',width:'100%',borderWidth:0.5,height:0},b:{fontSize:16,lineHeight:33},per:{color:'#eee',backgroundColor:'#334455',padding:[2,4],borderRadius:2}}},
data:[{value:2965,name:'直达'},{value:423,name:'外链'},{value:4072,name:'百度'},{value:187,name:'Google'},{value:35,name:'Bing'}]}]};//各个来源数据，修改value后面的值
referChart.setOption(refer_option);
</script
</main>