Implémentation du framework Laravel dans le dessin statistique de données

Dans cet article, je vais partager avec vous l'utilisation du framework laravel pour implémenter un graphique de statistiques de données. Le code est très clair et a une certaine valeur de référence. J'espère qu'il pourra aider ceux qui en ont besoin. amis.

1. La vue frontale

utilise 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: []
      }
    }
  },

pour demander le traitement des données :

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

données de test mysql :

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);
}

Ce qui précède est l'intégralité du contenu de cet article, plus contenu de laravel Veuillez prêter attention au Tutoriel de démarrage de Laravel Framework.

Articles connexes recommandés :

Salon de discussion en temps réel : réalisé via la diffusion d'événements basés sur Laravel+Pusher+Vue

Cours recommandés :

Les cinq derniers didacticiels vidéo Laravel recommandés en 2017

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!