将数据从数据库插入谷歌图表codeigniter

Posted 2023-02-24

【中文标题】将数据从数据库插入谷歌图表codeigniter

【英文标题】：Insert data from database to google chart codeigniter

【发布时间】：2020-03-16 02:38:39

【问题描述】：

我想插入数据以从两个表中获取销售报告到谷歌图表中。我在model页面中尝试了join查询，但结果是饼图div中的No Data。

表格销售数据如下

id |    person_name  |      sales_id     |     status
 1       Michael                2                 1
 2       Daniel                 2                 3
 3       James                  2                 1
 4       Ricky                  1                 2
 5       Martin                 1                 3

表格状态数据如下

id |        status        |       color 
 1       Meeting                 #f00630
 2       Presentation            #f2478f     
 3       Proposal Sent           #170303       
 4       Invoice                 #7cb342 
 5       Lost                    #fe0725

我需要根据sales id 将数据status type、total status (in number) 和color status 插入到谷歌饼图中。我需要更改我手动编写的数据，如下所示

function drawChart() 
    var data = google.visualization.arrayToDataTable([
      ['Type', 'Total'],
      ['Meeting', 2],
      ['Presentation', 0],
      ['Proposal Sent', 1],
      ['Invoice', 0],
      ['Lost', 0]
    ]);

    var options = 
      is3D: true,
      colors: ['#f00630', '#f2478f', '#170303', '#7cb342', '#fe0725']
    ;

    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);        
  

这是我在模型页面中尝试过的脚本

 public function getAllStatus()
 
    $this->db->select('status');
    $this->db->from('sales');
    $this->db->join('sales_status', 'sales_status.id = sales.status');
    $this->db->where('sales_id', $id);
    return $query = $this->db->get();
 

这是controller页面中的脚本

 $data['sales'] = $this->Sales_model->getAllStatus()->result();

这是view页面中的脚本

 var data = google.visualization.arrayToDataTable([
      ['Type', 'Total'],
      <?php 
         foreach ($sales as $sale)
         echo "['".$sale->name."',".$sale->count."],";
         
         ?>
    ]);

 <div id="chart_div" style="width: 100%; "></div>

你知道我哪里需要修吗？

谢谢

【问题讨论】：

您的查询没有给出任何错误？

它只是在饼图中显示no data

【参考方案1】：

图表需要带有数据的 JSON 对象。您可以尝试使用循环构建类似 JSON 的结构，但仅输出 JSON 对象要简单得多。

在您看来，在调用图表之前：

var first_data = <?php echo json_encode($your_first_var); ?>;
var second_data = <?php echo json_encode($your_second_var); ?>;

然后，当你实际调用将绘制图表的 JS 时：

function drawChart() 
    var data = google.visualization.arrayToDataTable(first_data);

    var options = 
      is3D: true,
      colors: second_data
    ;

    var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);