标题: [已失效] 为首页添加一个七牛云流量图
时间: 2019-06-14发布,2022-06-17修改
人工监控,避免流量飞跑
效果(展开查看代码):
虎绿林离开了七牛云,已失效。
导入网页插件:七牛云流量图(当前用户:0,总安装次数:0)<script src="/tpl/jhin/js/jquery-3.1.1.min.js"></script>
<script src="/tpl/jhin/js/chartjs/analytics.js"></script>
<script src="/tpl/jhin/js/chartjs/Chart.js" type="text/javascript"></script>
<script src="/tpl/jhin/js/chartjs/utils.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
if (location.pathname == "/q.php/index.index.html") {
$('.layout-head').html('<canvas id="qiniu_traffic" style="display: block; height: 300px; width: 100%;" class="chartjs-render-monitor"></canvas>');
var ctx = document.getElementById('qiniu_traffic').getContext('2d');
window.myLine = new Chart(ctx, config);
$.get('https://hu60.cn/q.php/api.qiniu_traffic.json', function(result) {
if (result.data) {
config.data.labels = result.time.map(function(time) {
return time.split(' ')[0];
});
config.data.datasets[0].data = result.data.china;
config.data.datasets[1].data = result.data.oversea;
window.myLine = new Chart(ctx, config);
}
});
}
});
function bytes_format(bytes) {
if (bytes < 1024)
return bytes + ' B';
if (bytes < 1048576)
return (bytes / 1024).toFixed(0) + ' KB';
if (bytes < 1073741824)
return (bytes / 1048576).toFixed(0) + ' MB';
return (bytes / 1073741824).toFixed(2) + ' GB';
}
var config = {
type: 'line',
data: {
labels: [],
datasets: [{
label: '中国',
backgroundColor: window.chartColors.red,
borderColor: window.chartColors.red,
data: [],
fill: false,
},{
label: '海外',
backgroundColor: window.chartColors.green,
borderColor: window.chartColors.green,
data: [],
fill: false,
}]
},
options: {
responsive: true,
title: {
display: true,
text: '七牛云流量图'
},
tooltips: {
mode: 'index',
intersect: false,
callbacks: {
label: function (item) {
return config.data.datasets[item.datasetIndex].label + ': ' + bytes_format(item.yLabel);
}
},
},
hover: {
mode: 'nearest',
intersect: true
},
scales: {
xAxes: [{
display: true,
scaleLabel: {
display: false,
labelString: '日期'
}
}],
yAxes: [{
display: true,
scaleLabel: {
display: false,
labelString: '流量'
},
ticks: {
callback: bytes_format
}
}]
}
}
};
</script>
『回复列表(11|隐藏机器人聊天)』