Question

我需要使用Trendlines绘制Google折线图，但我使用Ajax请求将数据放入其中

在ajax文件中，我在一个数组中插入图形的元素，然后将其转换为JSON，如下所示：

$reply= json_encode($array);
echo $reply;

这是我的ajax回复的内容：

reply = [
    ["Periodo","Rome","Milan","Test"],
    ["20160830",1,2,3],
    ["20160831",2,3,6],
    ["20160901",2,3,20],
    ["20160902",20,30,12]
  ];

在我的程序中，我填充了这样的图形：

var replyJSON = JSON.parse(reply);
var data = google.visualization.arrayToDataTable(replyJSON);

这是我所拥有的和我将要做的类似的例子，但在这里我无法复制ajax调用：http://jsfiddle.net/roby492/srrrn9sa/384/

我需要回复JSON，在jquery日期转换日期字符串以正确显示趋势线。

我该怎么做？或者我如何通过Ajax发送带有日期而不是字符串的JSON？

谢谢。 Roberto R。

Answer 1

看看这个php to google chart via ajax example

在此推荐类似设置

该示例构建了Google可以接受的JSON

允许从JSON

直接创建DataTable，

以下是该答案的片段，它构建了JSON

$rows = array();
$table = array();

$table['cols'] = array(
    array('label' => 'Time', 'type' => 'string'),
    array('label' => 'Wind_Speed', 'type' => 'number'),
    array('label' => 'Wind_Gust', 'type' => 'number')
);

while ($row = mysql_fetch_assoc($sqlResult)) {
  $temp = array();
  $temp[] = array('v' => (string) $row['Time']);
  $temp[] = array('v' => (float) $row['Wind_Speed']);
  $temp[] = array('v' => (float) $row['Wind_Gust']);
  $rows[] = array('c' => $temp);
}

$table['rows'] = $rows;

echo json_encode($table);

在JSON中使用实际的Date列，有点棘手

主要是因为JavaScript中的月份数是从零开始的，不像php

因此，如果您在php中格式化日期，则需要将月份数减少1

这会产生冗长的格式声明

要在JSON中传递日期，您可以使用以下格式，请注意它是作为字符串传递的......

"Date(2016, 8, 28, 15, 34, 40)" - ＆gt;这相当于今天的日期
再次，月份为零（8 = 9月）

所以要在php中以这种格式建立一个日期，你可以使用以下内容......

$date1 = new DateTime();
$date2 = "Date(".date_format($date1, 'Y').", ".((int) date_format($date1, 'm') - 1).", ".date_format($date1, 'd').", ".date_format($date1, 'H').", ".date_format($date1, 'i').", ".date_format($date1, 's').")";

产生上面显示的"Date(...)"

从其他答案调整片段以包含日期列，可能看起来像这样...

$rows = array();
$table = array();

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

while ($row = mysql_fetch_assoc($sqlResult)) {
  $date1 = $row['Date'];
  $date2 = "Date(".date_format($date1, 'Y').", ".((int) date_format($date1, 'm') - 1).", ".date_format($date1, 'd').", ".date_format($date1, 'H').", ".date_format($date1, 'i').", ".date_format($date1, 's').")";

  $temp = array();
  $temp[] = array('v' => (string) $date2);
  $temp[] = array('v' => (float) $row['Wind_Speed']);
  $temp[] = array('v' => (float) $row['Wind_Gust']);
  $rows[] = array('c' => $temp);
}

$table['rows'] = $rows;

echo json_encode($table);

通过php中的ajax获取上述结果，您可以直接创建表

var data = new google.visualization.DataTable(reply);

无需解析JSON或使用arrayToDataTable

Google Chart在x轴上绘制日期的趋势线

1 个答案: