趋势线未在Google图表上显示

时间:2014-08-16 10:24:07

标签: google-visualization

我试图在下图中获得指数趋势线。从这里搜索我明白问题可能是第一列类型是一个字符串,但是当我尝试将其更改为'date'或'number'时,我在页面上收到错误。我还需要做些什么来改变它?

$rows = array();
$table = array();
$table['cols'] = array(
    array('label' => 'Date', 'type' => 'string'),
    array('label' => 'Amount', 'type' => 'number')
);

$sessions = $wpdb->get_results($wpdb->prepare("SELECT Due,Date from patient_sessions WHERE Type='Session' AND Date >= '2014-01-01'"));
$work_times = $wpdb->get_results($wpdb->prepare("SELECT Amount,Date from work_times AND Date >= '2014-01-01'"));
$expenses = $wpdb->get_results($wpdb->prepare("SELECT Amount,Date from expenses WHERE Client='Psychotherapy' AND Date >= '2014-01-01'"));
$i=1;
while($i<=53) {
    $week_start = new DateTime();
    $week_start->setISODate(2014,$i);
    $date_display = $week_start->format('j M Y');

    $session_total = 0;
    $work_time_total = 0;
    $expense_total = 0;


      foreach ($sessions as $session) {
    if (date("W", strtotime($session->Date)) == $i) {
    $session_total = ($session_total+$session->Due);
    }
    }

         foreach ($work_times as $work_time) {
    if (date("W", strtotime($work_time->Date)) == $i) {
    $work_time_total = ($work_time_total+$work_time->Amount);
    }
    }

          foreach ($expenses as $expense) {
    if (date("W", strtotime($expense->Date)) == $i) {
    $expense_total = ($expense_total+$expense->Amount);
    }
          }

    $balance = ($session_total + $work_time_total - $expense_total);

    $temp = array();

    $temp[] = array('v' => (string) $date_display); 
    $temp[] = array('v' => (string) $balance); 
    $rows[] = array('c' => $temp);
    $i++;
}

$table['rows'] = $rows;
$jsonTable = json_encode($table);
//echo $jsonTable;
?>

    <script type="text/javascript">

    // Load the Visualization API and the piechart package.
    google.load('visualization', '1', {'packages':['corechart']});

    // Set a callback to run when the Google Visualization API is loaded.
    google.setOnLoadCallback(drawChart);

    function drawChart() {

      // Create our data table out of JSON data loaded from server.
      var data = new google.visualization.DataTable(<?=$jsonTable?>);
                                                    var formatter = new google.visualization.NumberFormat({fractionDigits:2,prefix:'\u00A3'});
      formatter.format(data, 1);
      var options = {
          pointSize: 5,
          legend: 'none',
          series: {0:{color:'2E838F',lineWidth:2}},
          chartArea: {left:50,width:"95%",height:"80%"},
          backgroundColor: '#F7FBFC',
          hAxis: {textStyle: {paddingTop: '50'},showTextEvery:4},
          height: 400,
          trendlines: {
              0: {
                type: 'exponential',
                color: 'green',
              }
            }
        };
      // Instantiate and draw our chart, passing in some options.
      //do not forget to check ur div ID
      var chart = new google.visualization.LineChart(document.getElementById('chart_div2'));
      chart.draw(data, options);
    }
    </script>

1 个答案:

答案 0 :(得分:1)

您可以将字符串日期转换为Date对象,如下所示:

$table['cols'] = array(
    array('label' => 'Date', 'type' => 'date'),
    array('label' => 'Amount', 'type' => 'number')
);

然后在你的while循环中:

$week_start = new DateTime();
$week_start->setISODate(2014,$i);
$date_display = $week_start->format('j M Y');
$year = (int) $week_start->format('Y');
$month = ((int) $week_start->format('m')) - 1; // adjust for javascript's 0-indexed months
$day = (int) $week_start->format('d');

//...

$temp = array();

$temp[] = array('v' => "Date($year, $month, $day)", 'f' => $date_display); 
$temp[] = array('v' => (string) $balance); // you should use (float) or (int) here, not (string)
$rows[] = array('c' => $temp);