javascript - 如何使用 HighStock 的 tickPositioner 设置月末报价？

Question

This highcharts admin response解释这在本地是不可能的:

There's no option for using the last date of the month, but you can create your own tickPositioner callback

我听从了建议，但是无论 tickPositioner 函数如何，似乎都没有任何改变! <强> I've created an isolated demo of the issue here. [就是this example添加了刻度定位器。]

在 jsFiddle 示例中，您可以在下面看到我的 tickPositioner。我减去一天 (60*60*24*1000) 15 次 (*15)。十五是随机的，只是为了表明没有影响。

        xAxis:{
            //LOOK HERE!
            tickPositioner:function(){
                return _.forEach(this.tickPositions, function(date){                         
                    console.log('date',date, new Date(date), new Date(date - 60*60*24*1000*15));
                    //return date;   //uncomment to show orginal dates                     
                    return (date - 60*60*24*1000*15);
                });
            //LOOK HERE!
            }
        },

---

补充说明:

我可以告诉 tickpositioner 正在做某事，因为我可以:

• 如果函数设置不正确，则完全删除勾号
• 如果日期不正确，则奇怪地格式化日期
• 如果一切设置正确，则根本不更改日期刻度。

我怀疑日期格式和最小刻度间隔有问题。在官方 highcharts example对于 tickpositioner，我可以看到它在工作，但如果你减少他们设置的自定义增量，你会看到一个类似的问题，其中对刻度位置没有影响。

Answer 1

首先，我认为您的问题在于使用 lodash 的 forEach。它不会返回您认为它返回的内容。来自 the documentation :

_.forEach(collection, [iteratee=_.identity], [thisArg])

...

Returns

(Array|Object|string): Returns collection.

话虽这么说，但这是在每个月末尝试解决您的总体问题:

$('#container').highcharts('StockChart', {
    xAxis:{
        tickPositioner:function(min, max){
            var result = [];
            var current = min;
            
            while(current < max) {
                var date = new Date(current);
                var lastDate = new Date(date.getFullYear(), 
                                        date.getMonth() + 1, 
                                        0, 
                                        0, 
                                        -date.getTimezoneOffset());
                var nextDate = new Date(date.getFullYear(), 
                                        date.getMonth() + 1, 
                                        1, 
                                        0, 
                                        -date.getTimezoneOffset());
                
                result.push(lastDate.getTime());
                current = nextDate.getTime();
            }
            
            result.info = this.tickPositions.info;
            return result;
        }
    },
    // ...
});

参见 this JSFiddle demonstration它的外观。代码可能还有改进的余地。