Cakephp到Google Chart

时间:2012-07-16 01:25:51

标签: cakephp google-visualization

在我的控制器中,我创建了要绘制的数组

function chart() {  
    $results = $this->Visit->query(
        "SELECT date(visits.created) as visit_date, 
            Count(visits.id) AS count_visits
            FROM visits
            GROUP BY date(visits.created)"
    );

    foreach($results AS $result) {
        $row = array(
            $result[0]['visit_date'],
            $result[0]['count_visits']          
        );
        $chartData[] = json_encode($row);
    }

    pr($chartData);

}

pr($ chartData)给出以下数组

Array
 (
    [0] => ["2012-07-11","5"]
    [1] => ["2012-07-13","1"]
    [2] => ["2012-07-14","1"]
)

在图表视图中我有

google.load('visualization', '1.0', {'packages':['corechart']});

google.setOnLoadCallback(drawChart);

function drawChart() {
    // Create the data table.

    var data = google.visualization.arrayToDataTable($chartData);

    var options = {
      title: 'Visits by Date',
      hAxis: {title: 'Date', titleTextStyle: {color: 'black'}}
    };

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

但这不会给我一张图表..没有错误......只是没有图表..

如果我手动输入一个数组来测试我的视图,它工作正常......例如,如果我替换..

var data = google.visualization.arrayToDataTable($chartData);

使用Google Chart示例中的以下格式生成一个漂亮的柱形图

    var data = google.visualization.arrayToDataTable([
              ['Date',  'Count'],  
      ['2012-07-11',  5],
      ['2012-07-13',  1],
      ['2012-07-14',  1]
    ]);
几个问题: - 如何在var数据数组中获得标题标题? - 在数组中使用双引号或单引号会有所不同吗? - 我正在将数组$ chartData从php传递给Google图表javascript吗? - Google示例在数组周围有'[]',我如何获取数组周围的那些?

(bwt,我知道所有关于cakephp的Find(全部),但我只是迷失在关于如何获得我想要的文档和sql更容易的文档中)

1 个答案:

答案 0 :(得分:0)

您在控制器中使用了json_encode,但在您的视图中使用了 -

google.visualization.arrayToDataTable($chartData);

json_encode创建json对象,而不是javascript数组。

在控制器功能图表中使用json_encode()尝试:

$chartData['cols'] = array(
    array('id' => 'visit_date', 'label' => 'Visit date', 'type' => 'date'),
    array('id' => 'count_visits', 'label' => 'Count', 'type' => 'number')
);
foreach($results AS $result) {
    $time = strtotime($result[0]['visit_date']);
    $dateJs = 'Date('.date("Y", $time).', '.(date('n', $time) - 1).', '.date('j', $time).')';
    $row = array(
        'c' => array(
            array('v' => $dateJs),
            array('v' => $result[0]['count_visits']),
         )
    );
    $chartData['rows'][] = $row;
}
//make the data available for view
$this->set('chartData', json_encode($chartData);
在您的视图中

使用:

var data = new google.visualization.DataTable($chartData);