2014-01-28 16 views
2

我一直在尝试使用Highcharts库创建一个类似于http://bit.ly/1jF6AY7的图表几个星期。然而,它不理解的是应该有以下一系列零个值(如果未提供任何值/日期):Laravel and Charting - 确定数据之间的差异

12-18-13 
01-01-14 
01-03-14 
01-06-14 
01-15-14 

然而,清楚地使用谷歌图表也能够与上述图表表示的间隙恰当地在“贡献”日期之间。我需要为我的created_at日期做同样的事情。有什么建议么?我宁愿为此使用Highcharts,但在这一点上我的压力和头发是比什么都更有价值;)

香草PHP代码示例:

 $q = $_GET['search']; 

     if(isset($_GET['time'])) { 
      $time = $_GET['time']; 
     } else { 
      $time = NULL; 
     } 

     include_once('../../vendors/HighchartsPHP-master/Highchart.php'); 

     $chart = new Highchart(Highchart::HIGHSTOCK); 
     $chart->includeExtraScripts(); 

     $chart->chart->renderTo = "chart"; 
     $chart->title->text = "Potential Impact for \${$q}"; 
     $chart->rangeSelector->selected = 1; 
     $chart->xAxis->type = 'datetime'; 
     $chart->xAxis->gapGridLineWidth = 3; 
     $chart->xAxis->dateTimeLabelFormats->hour = "%H:%M"; 
     $chart->xAxis->dateTimeLabelFormats->month = "%e. %b"; 
     $chart->xAxis->dateTimeLabelFormats->year = "%b"; 
     // $chart->xAxis->tickInterval = 3600 * 1000; 
     $chart->yAxis->title->text = "Volume"; 
     $chart->yAxis->min = 0; 
     $chart->credits->enabled = false; 

     // $chart->rangeSelector->buttons[] = array(
     //  'type' => "minute", 
     //  'count' => 5, 
     //  'text' => "5" 
     //); 
     ... 

     $chart->rangeSelector->buttons[] = array(
      'type' => "month", 
      'count' => 6, 
      'text' => "6M" 
     ); 

     $chart->rangeSelector->buttons[] = array(
      'type' => "year", 
      'count' => 1, 
      'text' => "1Y" 
     ); 

     $chart->rangeSelector->buttons[] = array(
      'type' => "all", 
      'text' => "All" 
     ); 

     $option = new HighchartOption(); 
     $option->global->useUTC = false; 
     Highchart::setOptions($option); 

     $chart->series[] = array(
      'name' => "Potential Impact for \${$q}", 
      'data' => new HighchartJsExpr("data"), 
      'step' => 1, 
      'gapSize' => 5, 
      'connectNulls' => false, 
      'tooltip' => array(
       'valueDecimals' => 0 
      ) 
     ); 
     $data = format_data($q, $time); 
     $chart->series[0]->data = $data; 

     ?> 

    <div id="chart"></div> 
    <script type="text/javascript"><?php echo $chart->render("chart1"); ?></script> 

,并在格式数据功能:

function format_data($q, $time = NULL) { 
    $msg_vol = correlate_created_at_with_msg_vol($q, $time); 

    while ($tweet = mysqli_fetch_array($msg_vol, MYSQL_ASSOC)) { 
     $date = $tweet['date'] * 1000; 
     $count = intval($tweet['count']); 
     $formatted[] = array($date, $count); 
    } 
    return $formatted; 
} 

enter image description here

在上述图像中,可以看到,它不仅是绘图单数据点(由工具提示所示)而不showi在图表上的任何可视引用,但它正在跳过空的时间段,并且不在xAxis上正确显示相应的时间。奇怪的是,如果你引用了允许用户通过拖动栏来改变时间段的底部栏......那个栏有正确的说明,就像我正在寻找的那样。

如果我无法让Highcharts得到零值,我至少需要显示时间间隔而不会跳过不可预知的分钟数,小时数,在某些情况下,几天和几周。

+0

我希望Carbon的diff方法能够工作,但如果系列中有数百个缺口,那么它不是真正实用的...... – DroBuddy

回答

1

如果您使用基于日期时间的系列,并且没有这些点的数据,那么highcharts应该处理它。在没有看到你的代码的情况下,我形象地说你正在做一个基于类别的xAxis,而你并没有在这个时间段中“分类”任何数据。

编辑: 快速浏览一下你粘贴的代码,表明你正在使用HighStock,这很好。您可以使用ordinal设置。设置为false,你应该看到差距。现在仍然很难说,因为我不能看到你的数据是真的,但这应该让我们继续下去。您可能还想启用connectNulls

+0

今天早上我刚开始使用Laravel,所以我没有这部分的代码。之前我在香草PHP中做过。 The xAxis是日期时间系列,但它从一个日期直到下一个日期,而不是在两者之间填入空白,并将相应的时间值显示为零。 – DroBuddy

+0

我不确定“binning”是什么意思......你能澄清一下吗? – DroBuddy

+0

你的高级代码是什么样的? – wergeld

-1

简易解决方案,如果没有数据,则强制为0。

+0

问题是如何以编程方式完成这项工作。如果日期之间存在较大差距,则diff方法不太实用,因为所有比较都会显着减慢加载时间。尽管如此,我计划缓存结果,但是如果系列中有超过1,000个数据点......这可能是初始页面加载时的噩梦。显然有更好的方法,就像GitHub所做的那样。 – DroBuddy