先上一张效果图
这边用的是echarts插件http://echarts.baidu.com/
源码部分
<div> <button onclick="zhou()" class="btnweek week active" style="margin-left: 300px">按周排</button><button onclick="yue()" class="btnweek month" style="margin-left: 100px">按月排</button> </div> <!-- 为 ECharts 准备一个具备大小(宽高)的 DOM --> <div id="main" style="width: 95%;height:400px;"></div> <script type="text/javascript"> zhou(); function zhou() { var myChart = echarts.init(document.getElementById('main')); $(".week").attr("class","btnweek week active"); $(".month").attr("class","btnweek month"); $.get('?act=welcome&op=index&get_data=week',function(data){ myChart.setOption(data); },'json'); } function yue(){ var myChart = echarts.init(document.getElementById('main')); // 异步加载数据 $(".week").attr("class","btnweek week"); $(".month").attr("class","btnweek month active"); $.get('?act=welcome&op=index&get_data=month',function(data){ myChart.setOption(data); },'json'); } </script>
这些是html代码,需要引入一个erchars.js文件 可以从上面网址down下来,接下来上统计的代码
/* * * VIP列表 * */ public function indexOp() { $model_shop = Model('shop'); $model_admin = Model('admin'); $model_member = Model('member'); $model_ap = Model('ap'); $user=$this->getAdminInfo(); $admin=$model_admin->getOneAdmin($user["id"]); if($admin["admin_area"]){ $condition["areacode"]=array("in",$admin["admin_area"]); } //ap $shop_id = $model_shop->getShopList($condition, '*'); $sid=array(); foreach($shop_id as $shid){ $sid[]=$shid["id"]; } $condition_ap["shop_id"]=array("in",$sid); if ($_GET['get_data']=='week') { echo $this->get_json_arr(6); }else if ($_GET['get_data']=='month') { echo $this->get_json_arr(30); }else{ Tpl::showpage('welcome.index'); } } public function get_json_arr($num=6){ $model_shop = Model('shop'); $model_ap = Model('ap'); //统计商铺 for($i=$num;$i>=0;$i--){ $daystr=date('Y-m-d', strtotime("-$i day")); $searchstr="TO_DAYS(from_unixtime(addtime,'%Y-%m-%d'))=TO_DAYS('".$daystr."')"; $shopCount=$model_shop->where($searchstr)->count(); $shopDayCountArray[]=$shopCount; } //统计ap for($i=$num;$i>=0;$i--){ $daystr=date('Y-m-d', strtotime("-$i day")); $searchstr="TO_DAYS(from_unixtime(addtime,'%Y-%m-%d'))=TO_DAYS('".$daystr."')"; $apCount=$model_ap->where($searchstr)->count(); $dateArray[]=date('m-d', strtotime("-$i day")); $apDayCountArray[]=$apCount; } // echo "<pre>"; // print_r($dateArray);die; if ($num==6) { $title='近一周的商铺和AP的统计'; }else{ $title='近一月的商铺和AP的统计'; } //处理json包 $json_arr = array( 'title'=>array('text'=>$title), 'tooltip'=>array('trigger'=>'axis'), 'legend'=>array('data'=>array('商铺','AP')), 'toolbox'=>array( 'show'=>true, 'feature'=>array( 'dataZoom'=>array('yAxisIndex'=>'none'), 'dataView'=>array('readOnly'=>false), 'magicType'=>array('type'=>array('line','bar')), 'restore'=>array(), 'saveAsImage'=>array() ), ), 'xAxis'=>array('type'=>'category','boundaryGap'=>false,'data'=>$dateArray), 'yAxis'=>array('type'=>'value','interval'=>1,'min'=>0,'axisLabel'=>array('formatter'=>'{value} 个')), 'series'=>array( array( 'name'=>'商铺', 'type'=>'line', 'data'=>$shopDayCountArray ), array( 'name'=>'AP', 'type'=>'line', 'data'=>$apDayCountArray ) ) ); return json_encode($json_arr);exit; }
来源:oschina
链接:https://my.oschina.net/u/4479011/blog/4319411