为什么我不能在 Codeigniter 中使用 Chart.js 创建月度销售报告答案

【问题标题】：Why can't I create monthly sales report with Chart.js in Codeigniter为什么我不能在 Codeigniter 中使用 Chart.js 创建月度销售报告
【发布时间】：2019-10-12 13:37:30
【问题描述】：

我有一个用 chart.js 创建的图表

我每天从数据库中获取总数，有些日子没有这样的收入：

id | seller | date             | quantity | price | total

1    3636    2019-10-09 10:00   4           1,2      4,8
2    3045    2019-10-09 15:51   2           0,6      1,2
3    3636    2019-10-06 11:05   8           1,0      8,0
4    3636    2019-10-04 14:03   5           0,9      4,5
5    3636    2019-10-01 14:57   3           0,4      1,2

如您所见，10 月 9 日有 2 次销售，10 月 6 日有 1 次销售，10 月 4 日有 5 次销售，10 月 1 日有 1 次销售。

我为此创建了一个代码，但效果不佳：

//$kazanc_v is sales dates array which is come from the controller
            for($i=1;$i<31;$i++)
            { 
                $arr2[]=date('Y').'-'.date('m').'-'.$i;
            }
            for($k=0;$k<30;$k++){
                  if(in_array($arr2[$k],$kazanc_v[0])){
                         echo $kazanc_v->sub_total;
                      } else {
                          echo '0,';
                }
             }

当我将数据放入数据集时，图表如下所示：

因为看不到图片：wrong chart

我无法在图表数据中写入“0”，因为表格中没有数据。当日期没有销售时我想写 0 并且图表应该是我想要的这样

看不到 img ：[october reports]3

如何创建真实报告？

【问题讨论】：

可能有更优雅的方式，但这在过去对我有用。首先生成一个数组，其中包含要查看的日期的键（和默认的0 值）。然后您可以遍历该数组以使用数据库中的现有数据填充它。这样，所有日期都有一个条目和一个值，因此在 chart.js 中输出它变得微不足道。
我添加代码，我从控制器获取数据以查看但它不是在非销售日期写入'0'，因为没有数据
你能发布实际生成的 JS（并且正在创建图表）吗？真的很难仅通过显示它不起作用的图像来提供更多帮助。
js文件来自原chart.js网站link我对js文件没有问题。我的问题出在我的代码上。我不能在javascript的数据集上写'0' for($i=1;$isub_total; } 其他 { 回声 '0,'; } }

标签： php codeigniter chart.js

【解决方案1】：

首先，让我们明确一点，我看到$kazanc_v[0] 和$kazanc_v->sub_total 这是对象还是数组？这个变量的输出是什么？

使用这样的输出也会迫使你犯错。如果您想显示每个日期的销售总数或总价格，您应该从数据库中获取按日期分组的数据。

您的模型中的查询应该是这样的；

//in your model
$this->db->select("count(quantity) as qty, DATE(order_date) as date") 
         ->from("orders")
         ->where(order_date > "2021-01-01") //beginning of this month
         ->group_by('date')
         ->get()
         ->result_array()
 ;

现在，您需要先创建x-axis。在您的情况下，一个月的总天数（我们认为是 31 天）

//in your controller
$begin = new DateTime( date('Y-m-01') ); //or given date
$end = new DateTime( date('Y-m-t') );
$end = $end->modify( '+1 day' ); 
$interval = new DateInterval('P1D');
$dateRange = new DatePeriod($begin, $interval ,$end);

您有一个包含日期的数组，现在您可以使用来自模型的数据创建带有 y 轴和 x 轴的图表数据。

$chartData =[];
$kazanc = $this->some_model->some_method();  

foreach($dateRange as $date){
  $dataKey = array_search($date->format("Y-m-d"), array_column($kazanc, 'date'));
  if ($dataKey !== false) { // if we have the data in given date
      $chartData[$date->format("Y-m-d")] = $kazanc[$dataKey]['qty'];
  }else {
      //if there is no record, create default values
     $chartData[$date->format("Y-m-d")] = 0;
  }
}

//send data to view
$this->load->view('template', ["chartData" => $chartData]);

现在，$chartData 变量中有 31 天数据的日期（x 轴）和数量（y 轴）。

最后，我们可以在视图中打印我们的数据。根据chartjs文档，类似这样的东西。

// in your view
var options = {
  type: 'line',
  data: {
   labels: <?php echo json_encode(array_keys($chartData)); ?>,
   datasets: [
        {
          label: '# Total Quantity',
          data: <?php echo json_encode(array_values($chartData)); ?>,
          borderWidth: 1
        }
    ]
 },

示例工作代码（php）https://www.tehplayground.com/pmiPYk3yhIpExJqa

用于 chartjs 的 jsfiddle。 https://jsfiddle.net/jwf67voe/

【讨论】：