|
<link rel="stylesheet" href="/themes/echats/css/echartsHome.css">
|
<link rel="stylesheet" href="/themes/AdminLTE/plugins/daterangepicker/daterangepicker.css">
|
<script type="text/javascript" src="/themes/AdminLTE/plugins/daterangepicker/moment.min.js"></script>
|
<script type="text/javascript" src="/themes/AdminLTE/plugins/daterangepicker/daterangepicker.js"></script>
|
|
<section class="content-header">
|
<h1>
|
我的数据监控
|
</h1>
|
<ol class="breadcrumb">
|
<li><a href="/admin/index/index"><i class="fa fa-dashboard"></i> 平台首页</a></li>
|
<li><a href="#">数据监控管理</a></li>
|
<li class="active">我的数据监控</li>
|
</ol>
|
</section>
|
|
<!-- Main content -->
|
<section class="content">
|
<div class="row">
|
<div class="col-xs-12">
|
<div class="box">
|
|
<!-- /.box-header -->
|
<div class="box-body">
|
<div class="input-group">
|
<div class="input-group-addon">
|
<i class="fa fa-calendar"></i>
|
</div>
|
<input class="form-control pull-right" id="date_range" name="date_range" type="text">
|
</div>
|
<div id="main" class="main"></div>
|
</div>
|
<!-- /.box-body -->
|
</div>
|
<!-- /.box -->
|
</section>
|
<script type="text/javascript" src="/themes/echats/js/echarts-all.js"></script>
|
<script>
|
myChart = echarts.init(document.getElementById('main'));
|
window.onresize = myChart.resize;
|
var option = {
|
title : {
|
text: '辐射数据监控报表',
|
// subtext: ''
|
},
|
tooltip : {
|
trigger: 'axis'
|
},
|
calculable : true,
|
xAxis : [
|
{
|
type : 'category',
|
boundaryGap : false,
|
data : [
|
<?php foreach ($days_arr as $day): ?>
|
<?php echo "'".$day."',"?>
|
<?php endforeach ?>
|
]
|
}
|
],
|
yAxis : [
|
{
|
type : 'value',
|
axisLabel : {
|
formatter: '{value}'
|
}
|
}
|
],
|
series : [
|
{
|
name:'每日辐射平均值',
|
type:'line',
|
data:[
|
<?php $day_daily_arr[] =array();?>
|
<?php foreach ($user_dailys as $user_daily):?>
|
<?php $day_daily_arr[$user_daily['date']] = $user_daily['day_avg'];?>
|
<?php endforeach;?>
|
<?php foreach ($days_arr as $day): ?>
|
<?php if(isset($day_daily_arr[$day])):?>
|
<?php echo $day_daily_arr[$day].',';?>
|
<?php else:?>
|
0,
|
<?php endif;?>
|
<?php endforeach;?>
|
],
|
markPoint : {
|
data : [
|
{type : 'max', name: '最大值'},
|
{type : 'min', name: '最小值'}
|
]
|
},
|
},
|
]
|
};
|
myChart.setOption(option);
|
|
$(function(){
|
|
|
function getDay(add_days){
|
var date = new Date();
|
date.setDate(date.getDate()+add_days);
|
var year = date.getFullYear();
|
var month = date.getMonth()+1;
|
var day = date.getDate();
|
return year+"-"+month+"-"+day;
|
}
|
|
var start_time = getDay(-7);
|
var end_time = getDay(-1);
|
var max_time = getDay(-1);
|
$('#date_range').daterangepicker({
|
startDate:new Date(start_time),
|
endDate:new Date(end_time),
|
maxDate:new Date(max_time),
|
locale:{
|
format: 'YYYY-MM-DD',
|
separator: ' --- ',
|
applyLabel: "确定",
|
cancelLabel: "取消",
|
fromLabel: "起始时间",
|
toLabel: "结束时间",
|
customRangeLabel: "自定义",
|
weekLabel: "W",
|
daysOfWeek: ["日", "一", "二", "三", "四", "五", "六"],
|
monthNames: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
|
firstDay: 0
|
}
|
},function(start, end, lobel){
|
myChart.showLoading();
|
$.post({
|
url: "/data/manager/index",
|
data: {start_time:start.format('YYYY-MM-DD'), end_time:end.format('YYYY-MM-DD')},
|
success:function(data){
|
var days = [];
|
var user_dailys = [];
|
var is_exist_user_daily = false;
|
data = JSON.parse(data);
|
for (var i = 0; i < data.days_arr.length; i++) {
|
is_exist_user_daily = false;
|
days.push(data.days_arr[i]);
|
for (var j = 0; j < data.user_dailys.length; j++) {
|
if(data.days_arr[i] == data.user_dailys[j].date){
|
is_exist_user_daily = true;
|
user_dailys.push(data.user_dailys[j].day_avg);
|
break;
|
}
|
}
|
if(!is_exist_user_daily){
|
user_dailys.push(0);
|
}
|
}
|
|
myChart.setOption({
|
xAxis : [
|
{
|
type : 'category',
|
boundaryGap : false,
|
data : days
|
}
|
],
|
series : [
|
{
|
name:'每日辐射平均值',
|
type:'line',
|
data:user_dailys,
|
markPoint : {
|
data : [
|
{type : 'max', name: '最大值'},
|
{type : 'min', name: '最小值'}
|
]
|
},
|
},
|
]
|
});
|
myChart.hideLoading();
|
}
|
});
|
});
|
|
});
|
</script>
|
