Question

我有每日数据的图表，我创建x轴，间隔一小时，在minDate中指定名为minDate和maxDate的范围，指定minDate当天的开始时间，并在当天的第二天开始时指定maxDate。 i-e用户选择20 / aug / 2015 minDate将于20-08-2015 00：00：00：00，maxDate将于21-08-2015 00：00：00：00 in millis。

代码下的代码：

dateRangeFromMilli: function(startDate, noOfDays){
        var minMax = [],
            oneDayMilli = 24 * 60 * 60 * 1000,
            firstDate = new Date(startDate);
        minMax.push(firstDate.getTime());

    for(var i = 1; i < noOfDays ; i++) {
        minMax.push(firstDate.getTime() + oneDayMilli);
    }

    return minMax;
},

var $date = $("#selDate"),
        minMax = HSDateUtils.dateRangeFromMilli($date.val(), 2);

Highcharts.setOptions({
   global: {
            useUTC: false,
            timezoneOffset: new Date().getTimezoneOffset()
   }
});


xAxis: {
       title: {
               enabled: true,
               text: 'Hours'
       },
       type: 'datetime',
       tickInterval: 3600 * 1000,
       min: minMax[0],
       max: minMax[1],
       labels: {
               enabled: true,
               formatter: function (){
                        return Highcharts.dateFormat('%I %p',this.value);
               },
               style:{
                      width:'1px'
               },
               step: 1
               },
       dateTimeLabelFormats: {
               hour: '%I %p'
       },
       plotBands: {
             color: 'rgba(101, 109, 120, 0.2)', // Color value
             from: 0.5, // Start of the plot band
             to: 2.7
          }
      },

数据不一致的图片如下：

请参阅jsfiddle链接对于Image4： http://jsfiddle.net/oa4mo6ww/5/

for image3 http://jsfiddle.net/oa4mo6ww/6/

Answer 1

作为一种解决方法，您可以为系列设置pointRange。示例：http://jsfiddle.net/641dpb11/1/

这是一个已报告的错误 - https://github.com/highslide-software/highcharts.com/issues/4184

Answer 2

看起来问题是您尝试显示的数据超出了您显示的日期间隔并且可以解决问题。我添加了一个检查数据是否在范围内，然后才将其添加到数据数组中并且它可以工作试一试http://jsfiddle.net/Paulson/oa4mo6ww/8/

     $.each(data.DATA, function (index, activity) {
        var valArray = [];
        if(activity.timestamp>=minMax[0]&&activity.timestamp<=minMax[1]){
            valArray.push(activity.timestamp);
            valArray.push(activity.minutesPerformed);
            labelsArray[activity.timestamp] = activity.type;
            activityArray.push(valArray);
        }
    });

Highcharts条形图x轴不一致的行为

2 个答案: