Implementation of laravel framework in data statistical drawing

In this article, I will share with you about using the laravel framework to implement a data statistics chart. The code is very clear and has certain reference value. I hope it can help those in need. friend.

1. Front-end vue

uses vue-highcharts

<highcharts></highcharts>

data() {
    return {
      options: {
        title: {
          text: ''
        },
        xAxis: {
          categories: []
        },
        yAxis: {
          title: {
            text: ''
          },
          plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
          }]
        },
        legend: {
          layout: 'horizontal',
          align: 'center',
          verticalAlign: 'bottom',
          borderWidth: 0
        },
        credits: {
          enabled: false   // 去掉highcharts商标
        },
        series: []
      }
    }
  },

to request data Processing:

getTimingHistoryAct(time) {
      getTimingHistory(time).then(response => {
        const curHour = new Date().getHours()
        const hoursArr = []
        const dayArr = []
        const seriesData = []
        switch (time) {
          case 1:
            seriesData.length = 0
            for (let i = 0; i  x + ':00')
            response.data.forEach(record => {
              const index = hoursArr.indexOf(record.hour)
              if (index > -1) {
                seriesData[index] = record.count
              }
            })
            break
          case 7:
            seriesData.length = 0
            for (let i = 0; i  x.substr(5))
            response.data.forEach(record => {
              const index = dayArr.indexOf(record.date)
              if (index > -1) {
                seriesData[index] = record.count
              }
            })
            break
          case 30:
            // 同7天
            break
        }
        this.options.series = [{
          name: '商品点击',
          data: seriesData
        }]
      })
    },

2. Backend laravel

mysql test data:

1 5440935 1php中文网 2018-07-28 19:20:49
2 5440935 1 php中文网 2018-07-29 15:26:21
3 5440935 1 测试方案1 2018-07-29 15:38:43
...

public function getTimingHistory($time)
{
    switch ($time) {
        case '1':
            $data = StatsPlanClick::where('created_at','where('created_at','>', Carbon::today())->select([DB::raw('DATE_FORMAT(created_at,\'%H\') as hour'), DB::raw('COUNT("*") as count')])->groupBy('hour')->get();
            break;
        case '7':
            $data = StatsPlanClick::where('created_at','where('created_at','>', Carbon::today()->subDays(7))->select([DB::raw('DATE(created_at) as date'), DB::raw('COUNT("*") as count')])->groupBy('date')->get();
            break;
        case '30':
            $data = StatsPlanClick::where('created_at','where('created_at','>', Carbon::today()->subDays(30))->select([DB::raw('DATE(created_at) as date'), DB::raw('COUNT("*") as count')])->groupBy('date')->get();
            break;
        default:
            # code...
            break;
    }
    return $this->successWithData($data);
}

The above is the entire content of this article. For more laravel content, please pay attention to laravel Framework introductory tutorial.

Recommended related articles:

Real-time chat room: realized through event broadcast based on Laravel Pusher Vue

Recommended related courses:

The latest five recommended Laravel video tutorials in 2017

The above is the detailed content of Implementation of laravel framework in data statistical drawing. For more information, please follow other related articles on the PHP Chinese website!