簡體   English   中英

當日期不連續時,Highstock比較先前的數據點

[英]Highstock compare previous data point when date does not exist in series

我正在使用highstock在折線圖中顯示基金數據,我正在使用的數據系列缺少日期(主要是周末)。 我無法控制數據系列的源代碼,盡管我已經通過在JS中循環遍歷來對其進行了格式化,以便可以與Highstock一起使用。 當我在缺少的日期上使用rangeSelector時,會出現問題,當我在范圍選擇器中選擇“ ”到一個周末日期(數據系列中缺少的日期)時,比較百分比將從下一個可用數據點開始計算。

  1. 轉到此演示: http : //www.highcharts.com/stock/demo/compare
  2. 選擇2014年12月14日作為開始日期。

計算從2014年12月15日開始,為0值,這是一個星期一。 我希望它始終在上一個數據點而不是下一個數據點開始比較百分比。 我希望它從2014年12月12日開始,這是星期五。

如何在JS中啟動高庫存:

var opts = {
    chart : {
        backgroundColor: '#f9f9fa',
        borderWidth: 0,
        type: 'line'
    },
    rangeSelector : {
        buttons: [{
            type: 'month',
            count: 3,
            text: '3m'
        }, {
            type: 'month',
            count: 6,
            text: '6m'
        }, {
            type: 'ytd',
            text: 'YTD'
        }, {
            type: 'year',
            count: 1,
            text: '1y'
        }, {
            type: 'all',
            text: 'All'
        }],
        selected : 3,
        inputEnabled: false
    },

    plotOptions: {
        series: {
            compare: 'percent'
        }
    },

    title : {
        text : ''
    },

    navigator : {
        enabled : false
    },

    credits: {
        enabled: false
    },

    series : [{
        name : '',
        data : seriesData,
        lineColor : '#002855',
        tooltip: {
            valueDecimals: 4
        },
        turboThreshold : 0
    }],

    xAxis : {
        dateTimeLabelFormats: {
            millisecond: '%H:%M:%S.%L',
            second: '%H:%M:%S',
            minute: '%H:%M',
            hour: '%H:%M',
            day: '%e %b.',
            week: '%b %y',
            month: '%b %y',
            year: '%Y'
        },
        ordinal: false,
        minTickInterval : 4 * 7 * 24 * 3600 * 1000
    },

    yAxis : {
        labels: {
            format: '{value} %'
        }
    },

    tooltip : {
        valueSuffix : '',
        pointFormat : '<span style="color:{point.color}">\u25CF</span> {point.y} SEK ({point.change}%)<br/>'
    }
};

$(el).highcharts('StockChart', opts);

在將其格式化以用於Highstock后,我的seriesData var看起來像這樣:

[ 
    { name="2005-01-03", x=1104710400000, y=100 },
    { name="2005-01-04", x=1104796800000, y=99.9983 },
    { name="2005-01-05", x=1104883200000, y=99.9175014 },
    { name="2005-01-07", x=1105056000000, y=100.0739722 },
    // This continues to the current date
]

x是一個時間戳。
y是股票價值
name是一個字符串,表示x中的時間戳

el是在之前定義的,並且是元素節點對象。

當數據序列中的日期不存在時,是否可以使比較從上一個可用數據點開始而不是從下一個開始?

關於此問題的任何幫助將不勝感激!

編輯:添加我的解決方案作為下面的答案

我發現afterSetExtremes對修改最小值和最大值非常有用,我檢查日期是星期六還是星期天。 如果是星期六,我會回到-1天,如果是星期日,我會回到-2天。 對我來說,這應該涵蓋所有正常的周末,並且效果很好。 雖然它不會涵蓋工作日中發生的假期。 我也沒有修改最大時間,盡管我可能需要這樣做。

我當前的xAxis

xAxis : {
    events: {
        afterSetExtremes: function(e){

            var maxTimestamp = this.max,
                minTimestamp = this.min;

            var dateMin = new Date( minTimestamp ),
                dateMax = new Date( maxTimestamp ),
                minDayOfTheWeek = dateMin.getDay();

            // Test to see if its saturday or sunday
            if( minDayOfTheWeek === 6 || minDayOfTheWeek === 0 ){

                if( minDayOfTheWeek === 6 ){
                    dateMin.setDate( dateMin.getDate() - 1 );
                }else if( minDayOfTheWeek === 0 ){
                    dateMin.setDate( dateMin.getDate() - 2 );
                }

                this.setExtremes( dateMin.getTime(), dateMax.getTime() );
            }

        }
    },
    dateTimeLabelFormats: {
        millisecond: '%H:%M:%S.%L',
        second: '%H:%M:%S',
        minute: '%H:%M',
        hour: '%H:%M',
        day: '%e %b.',
        week: '%b %y',
        month: '%b %y',
        year: '%Y'
    },
    ordinal: false,
    minTickInterval : 4 * 7 * 24 * 3600 * 1000
}

並將其添加到圖表中,原因是afterSetExtremes對我不帶負載運行:

chart : {
    backgroundColor: '#f9f9fa',
    borderWidth: 0,
    events:{
        load: function(){
            var max = this.xAxis[0].max,
                min = this.xAxis[0].min;

            this.xAxis[0].setExtremes( min, max );
        }
    },
    type: 'line'
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM