Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/455.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 谷歌图表中每个日期有多个数据点_Javascript_Php_Charts_Google Visualization - Fatal编程技术网

Javascript 谷歌图表中每个日期有多个数据点

Javascript 谷歌图表中每个日期有多个数据点,javascript,php,charts,google-visualization,Javascript,Php,Charts,Google Visualization,我正在使用一个标准的php数组,它从数据库中以相反的顺序提取数据来创建一个Google图表。像这样的 $graph_data = array(array('Date', 'Amount')); foreach (array_reverse($transactions) as $transaction) { array_push($graph_data, array(date("d M", strtotime(substr($transaction->createdOn, 0,

我正在使用一个标准的php数组,它从数据库中以相反的顺序提取数据来创建一个Google图表。像这样的

$graph_data = array(array('Date', 'Amount'));
foreach (array_reverse($transactions) as $transaction) 
{ 
    array_push($graph_data, array(date("d M", strtotime(substr($transaction->createdOn, 0, 10))), $transaction->balanceAfter + 0));
    }
很好

此过程在图表上为数组的每一行创建一个新数据点。我遇到的问题是,在一个日期上有多个事件($transaction)。每个事件都被绘制为一个新的图表点,而我想绘制每个日期的最后一个数据点。(恒定时间序列)

最好的办法是什么

是否有一个简单的谷歌图表设置来使用每个日期的最后一个数据点?我已经找过了,但在这上面什么也没找到

谢谢

我们可以使用,
使用自定义聚合功能,
仅显示给定日期的最后一个点

var dataLast = google.visualization.data.group(
  data,  // data table
  [0],   // group by column
  [{     // aggregated column
    column: 1,
    type: 'number',
    label: data.getColumnLabel(1),
    // aggregation function
    aggregation: function (values) {
      // return the last value for the group
      return values[values.length - 1];
    }
  }]
);
上面的聚合属性,
应该是一个接受单个参数的函数,
这是每个组的一个值数组

在本例中,我们只返回数组中的最后一个值

group方法返回一个数据表,
我们可以用它来画图表

请参阅以下工作片段

google.charts.load('current'{
软件包:['corechart']
}).然后(函数(){
var data=google.visualization.arrayToDataTable([
[“日期”,“金额”],
[09年1月13日],,
[1月29日,11],
[1月29日,9],
[1月29日,4],
['1月29日',-3],
[1月29日,0],
['1月29日',-3],
['1月30日',-5],
[1月30日,0],
['1月30日',-1],
['1月30日',-2],
['1月30日',-3],
['1月30日',-4],
['1月30日',-5]
]);
var dataLast=google.visualization.data.group(
data,//数据表
[0],//按列分组
[{//聚合列
专栏:1,
键入:“编号”,
标签:data.getColumnLabel(1),
//聚合函数
聚合:函数(值){
//返回组的最后一个值
返回值[values.length-1];
}
}]
);
var chart=new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(dataLast);//使用分组数据绘制图表
});


当然,这是阵列输出。正如你所看到的,在同一天有很多点。尽管共享相同的日期0:(2)[“日期”,“金额”]…,但每个在图形上显示为一个新点。。。。1月29日,9月13日,14日,14日,2月29日,1月29日,1月29日,1月29日,1月29日,1月29日,1月16日,2月29日,1月29日,1月29日,1月30日,1月18日,1月30日,1月19日,2月30日,1月21日,2月30日,1月22日,1月23日,谢谢。这正是我要找的。我发现的唯一问题是,它将第七行(2018年10月日期)作为图表中的最后一行,放在今天日期之后。“data”数组的处理顺序正确,但group方法没有处理前6行并对第7行重新排序。是的,我没有注意到,对于示例数据,group函数将自动排序。由于这些值是字符串,而不是实际日期,因此它们的顺序不正确。最好的解决方案是使用实际日期,否则,年份必须是第一个,然后是月数,而不是名称…如果字符串,格式选项不可用--使用实际日期是一种方法,但需要进行大量更改,这里有一个--您可以尝试使用第三列,但需要将其添加到“按列分组”中在group方法-->
[0,2]
中,或者在分组之前,您可以尝试使用客户端上的数据视图将iso日期转换为实际日期。。。使用-->
dataLast.getNumberOfRows()