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

Question

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

餐 table 销售数据如下

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

我需要插入数据status type , total status (in number) ，和color status进入基于sales id的谷歌饼图。我需要更改我手动编写的数据，如下所示

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>

你知道我哪里需要修复吗？

谢谢

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