Question

我现在大部分时间都在解决这个问题，所以我想我会在这里问...

我正在使用highcharts创建一个情节，我想使用日期时间xAxis。我希望在此轴上显示的标签是相对于一组特定日期的计算值。所以我使用了一个可以访问前一个和最后一个日期的labels.formatter函数，相对于这些日期，我做了一些逻辑。

逻辑是，如果this.value（来自格式化程序）在最后一个之前，轴应该显示自上一个月以来的几个月，如果this.value是== last，它应该显示0，如果this.value＆gt;最后它应该显示自上次以来的几个月。

我有一些在我的代码中调用的辅助函数，它们已经在很多场合使用并且可以正常工作。

以下是xAxis的标签格式化程序的实现。

gVars.reportAddedResistance.MonthSinceUsed = new Array();    

this.highchart.options.xAxis.labels.formatter = function() {
    var mbDec;
    var mod;
    var result;
    var returnValue = null;
    var isSet;
    var previous = new Date(self.data.plotConf.previousDrydockDate);
    var last = new Date(self.data.plotConf.lastDrydockDate);
    var val = new Date(this.value);

    if(val.getTime() < last.getTime()) {
      // BEFORE LAST DRYDOCK
      mbDec = Utils.monthsBetweenDecimal(previous, val);
      mod = mbDec % 1;
      if(mod <= (1 / 30.4375)) {
        result = Math.round(mbDec);
        isSet = gVars.reportAddedResistance.MonthSinceUsed.indexOf(result);
        if(isSet == -1) {
          gVars.reportAddedResistance.MonthSinceUsed.push(result);
          //console.log('',"LESS Returning "+result+" Used: "+gVars.reportAddedResistance.MonthSinceUsed);
          returnValue = result;
        }
      }
    }
    else if(val.getTime() == last.getTime()){
      // AT LAST DRYDOCK
      var result = 0;
      isSet = gVars.reportAddedResistance.MonthSinceUsed.indexOf(result);
      if(isSet == -1) {
        gVars.reportAddedResistance.MonthSinceUsed.push(result);
        //console.log('',"EVEN Returning "+result+" Used: "+gVars.reportAddedResistance.MonthSinceUsed);
        returnValue = result;
      }
    }
    else if(val.getTime() > last.getTime()){
      // AFTER LAST DRYDOCK
      mbDec = Utils.monthsBetweenDecimal(last, val);
      mod = mbDec % 1;
      if(mod <= (1 / 30.4375)) {
        result = Math.round(mbDec);
        isSet = gVars.reportAddedResistance.MonthSinceUsed.indexOf(result);
        if(isSet == -1) {
          gVars.reportAddedResistance.MonthSinceUsed.push(result);
          //console.log('',"MORE Returning "+result+" Used: "+gVars.reportAddedResistance.MonthSinceUsed);
          returnValue = result;
        }
      }
    }
    return returnValue;
  };

之前的值是（来自console.log）：

Date {Tue Jun 15 2010 02:00:00 GMT+0200 (Romance Daylight Time)}

last的值是（来自console.log）：

Date {Sat Jun 15 2013 02:00:00 GMT+0200 (Romance Daylight Time)}

如果我启用console.log输出，我会得到这个输出，这对我来说表明逻辑和日期比较按预期工作：

LESS Returning 31 Used: 31
LESS Returning 32 Used: 31,32
LESS Returning 33 Used: 31,32,33
LESS Returning 34 Used: 31,32,33,34
LESS Returning 35 Used: 31,32,33,34,35
EVEN Returning 0 Used: 31,32,33,34,35,0
MORE Returning 1 Used: 31,32,33,34,35,0,1
MORE Returning 2 Used: 31,32,33,34,35,0,1,2
MORE Returning 3 Used: 31,32,33,34,35,0,1,2,3
MORE Returning 4 Used: 31,32,33,34,35,0,1,2,3,4
MORE Returning 5 Used: 31,32,33,34,35,0,1,2,3,4,5
MORE Returning 6 Used: 31,32,33,34,35,0,1,2,3,4,5,6
MORE Returning 7 Used: 31,32,33,34,35,0,1,2,3,4,5,6,7
MORE Returning 8 Used: 31,32,33,34,35,0,1,2,3,4,5,6,7,8

我的问题是，返回的值不会显示在我的绘图上。如果我将formatter函数更改为只返回this.value它会全部显示，没有任何问题，但由于某种原因我无法识别返回值（如上面的console.log输出中所示）未显示。

我的xAxis配置如下：

xAxis: {
type : 'datetime',
dateTimeLabelFormats: {
  day: '%Y-%m-%d',
  week: '%Y-%m-%d',
  month: '%Y-%m-%d',
  year: '%Y-%m'
},
startOnTick : false,
tickInterval : 24 * 3600 * 1000 * 1, // 1 day
title : {
  text : 'Months relative to drydockings',
  style : {
    fontSize : '9pt',
    fontFamily : 'Arial'
  }
},
labels : {
  maxStaggerLines : 1,
  style : {
    fontSize : '7pt',
    fontFamily : 'Arial'
  }
}

}，

我被卡住了 - 请帮助！： - ）

编辑：我正在使用Highcharts JS v3.0.7（2013-10-24）

Answer 1

我的问题的解决方案是将其添加到格式化程序：

    if(this.isFirst) {
      gVars.noOfSeriesCalled++;
    }
    if(gVars.noOfSeriesCalled == this.axis.series.length) {
        // The stuff thats posted above
    }
    else {
      return null;
    }

我认为库中的错误是我必须使用全局变量来跟踪我经历过的迭代次数。

从我的角度看，正确的实现方式是格式化函数在xAxis 中的每个刻度都被称为一次，无论有多少系列被添加到绘图中。

Highchart xAxis标签格式化程序不显示返回值

1 个答案: