将动态平均值添加到时间系列图表 [英] Adding dynamic mean to time series chart

问题描述

我会尽量解释我的问题，尽可能准确。我正在寻找一个满足以下两个条件的JavaScript图表库：

 从ajax请求检索时间序列，
更改时间窗口时动态显示数据。 
  

，如在highstocks上完成： http://www.highcharts.com/stock/demo/basic-line

和

 绘制对应于平均值的水平线，
用户更新图表上的时间窗口。 
  

实际上可以显示水平线。但是它们固定在整个数据上，并且在时间窗口被修改时不会相应地改变：

http://www.highcharts.com/stock/demo/yaxis-plotlines

我是相当新的话题，并想知道是否可以修改Highstock类有这样的结果。或者可能还有一些其他 js 库存在？

解决方案

这里的答案：

• Highchart，在setExtremes之后获取可见系列数据的总数

使用所有可见系列的动态平均的示例，我为一个以前的问题，在这里：

• http://jsfiddle.net/jlbriggs/gweuLegq/

我把这个例子放在一起，使用 afterSetExtremes 事件，例如：

 code> xAxis：{
 events：{
 afterSetExtremes：function（）{
 var ext = this.getExtremes（）; 
 getAverage（this.chart，ext.min，ext.max，show，width，avgColor，dashStyle）; 
} 
} 
}，
  

/ p>

• http：// jsfiddle .net / jlbriggs / c93543yL /

想法是：

1）捕获afterSetExtremes事件

2）获取结果轴min和max

循环通过系列数据

4）如果点在最小值和最大值之间，则增加计数，并将
点的y值添加到sum

5）计算平均值，检查平均系列的存在，如果存在，更新，如果不存在，添加

它可以很容易地使用你添加/删除根据需要，而不是一个系列，但我喜欢它作为一个系列，以便它有一个图例条目。

I will try to explain my problem as much accurate as possible. I am looking for a javascript chart library filling the two following conditions:

From an ajax request retrieving time series, 
display dynamically data when changing the time window.

such as it is perfectly done on highstocks: http://www.highcharts.com/stock/demo/basic-line

And

plot an horizontal line corresponding to the mean, 
changing when the user update the time window on the chart.

Actually it is possible to display an horizontal line. But they are fixed on the whole data and do not change accordingly when the time window is modified:

http://www.highcharts.com/stock/demo/yaxis-plotlines

I am quite new to the topic and would like to know if it'sp ossible to modify Highstock classes to have such a result. Or maybe some other js libraries exists?

解决方案

Using a combination of the answer here:

• Highchart, get total of visible series data after setExtremes

And an example of dynamic average using all visible series that I made for a previous question, here:

• http://jsfiddle.net/jlbriggs/gweuLegq/

I put together this example, using the afterSetExtremes event, like this:

xAxis      : { 
            events:{
                afterSetExtremes:function() {
                    var ext = this.getExtremes();
                  getAverage(this.chart, ext.min, ext.max, show, width, avgColor, dashStyle);                
                }
            }
        },

Working example here:

• http://jsfiddle.net/jlbriggs/c93543yL/

The idea is:

1) capture the afterSetExtremes event

2) get the resulting axis min and max

3) loop through the series data

4) if a point is between the min and max, increment the count, and add the point's y value to the sum

5) calculate the average accordingly, check for existence of average series, if exists, update, if not, add

It could as easily use a plot line that you add/remove as needed instead of a series, but I like having it as a series so that it has a legend entry.

这篇关于将动态平均值添加到时间系列图表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！