HighStock系列选择器中的定制YTD选件

时间:2013-02-14 11:16:19

标签: highstock

使用Highstock图表库,有没有办法使用Highstock Range选择器显示自定义YTD选项?

当您在范围选择器中使用某种类型的“ytd”时,它默认使用日历年。对于我的用例(我也想到金融机构)我需要显示从4月1日到3月31日的数据作为'ytd'选项

2 个答案:

答案 0 :(得分:3)

在没有黑客来源的情况下可能不可能,在Highstock中找到:

else if (type === 'ytd') {
        now = new Date(dataMax);
        year = now.getFullYear();
        newMin = rangeMin = mathMax(dataMin || 0, Date.UTC(year, 0, 1));
        now = now.getTime();
        newMax = mathMin(dataMax || now, now);
    }

正如您所看到的,日期是硬编码的。您可以将它们更改为需要。

答案 1 :(得分:1)

以下是我的表现。不应该看看以前的财务年初至今(这是我需要它的常见用例),但我确信我可以破解一些事情。

JSFiddle here

$(function() {   
var startDate  = new Date("April 01, 2012 00:00:00");
var today = new Date();

var count =  parseInt((today.getTime() - startDate)/(24*3600*1000)) -1;

$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
    // Create the chart
    window.chart = new Highcharts.StockChart({
        chart : {
            renderTo : 'container'
        },
        rangeSelector : {
            selected: 1,
            buttonTheme: {
                width:100
            },
            buttons: [{                                                 
                    type: 'ytd',
                    count: 1,
                    text: 'Calendar YTD'
                },
                   {
                    type: 'day',
                    count: count,
                    text: 'Financial YTD'
                }]
        },
        title : {
            text : 'AAPL Stock Price'
        },
        series : [{
            name : 'AAPL',
            data : data,
            tooltip: {
                valueDecimals: 2
            }
        }]            
    } );
});   
});