highstock在selectorRange按钮中显示错误的日期

时间:2017-10-23 09:11:59

标签: javascript highcharts highstock

enter image description here我从服务器获取日期并将所有日期转换为时间戳作为必需的高级图表。但是,rangeSelector按钮显示错误的日期。例如,如果我有dateBegin = 02/07/2017和dateEnd 09/07/2017,highstock dateRange显示错误的日期,如2017年7月1日至2017年7月8日。看来highstock显示总是约会 - 1天。我该如何解决?

这是我的配置初始化   onInitConfig =({series,periodId,height})=> {     const {onSelectRange} = this.props

moment.locale('ru', localization)

const heightChart = `${ height }px`

const config = {
  chart: {
    height: heightChart,
    events: {
      redraw: function(event) {
        const currentDateBegin =  Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.rangeSelector.minInput.HCTime)
        const currentDateEnd = Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.rangeSelector.maxInput.HCTime)
        onSelectRange && onSelectRange({ currentDateBegin, currentDateEnd })
      }
    }
  },
  rangeSelector: {
    buttons: [{
      type: 'week',
      count: '1',
      text: 'н'
    },{
      type: 'month',
      count: 1,
      text: 'м',
    },{
      type: 'month',
      count: 3,
      text: 'кв'
    }, {
      type: 'month',
      count: '6',
      text: 'пг'
    },{
      type: 'year',
      count: 1,
      text: 'г'
    }],
    buttonSpacing: 2,
    selected: periodId - 1,
    inputDateFormat: '%d/%m/%Y',
    labelStyle: {
      fontFamily: 'HelveticaLight',
      fontSize: '14px',
    }
  },
  title: {
    align: 'left',
    text: '',
  },
  navigation: {
    buttonOptions: {
      enabled: false,
    }
  },
  navigator: {
    xAxis: {
      labels: {
        formatter: function () {
          return moment(this.value).format('DD MMMM')
        },
        style: {
          fontFamily: 'HelveticaLight',
          fontSize: '14px',
        }
      }
    },
  },
  xAxis: {
    labels: {
      formatter: function () {
        return moment(this.value).format('DD MMMM')
      },
      style: {
        fontFamily: 'HelveticaLight',
        fontSize: '14px',
      }
    }
  },
  plotOptions: {
    series: {
      compare: 'percent',
      showInNavigator: true
    }
  },
  tooltip: {
    pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b><br/>',
    valueDecimals: 2,
    split: true
  },
  series: series
}

return config

}

这是我的输入

order.map((id) => {
      const { dateBegin, dateEnd, valueAmount, valueCount, valueQuantity, valueCountCheck, valueCountCustomers } = data[id] || {}
      const dateTimeBegin = moment(dateBegin, 'DD.MM.YYYY').toDate().getTime()
      const dateTimeEnd = moment(dateBegin, 'DD.MM.YYYY').toDate().getTime()

      _.merge( dataCheckCount, { [id]: { id, x: dateTimeBegin, y: valueCount } })
      _.merge( dataCheckCount, { [id + 1]: { id: id + 1, x: dateTimeEnd, y: valueCount } })
}

1 个答案:

答案 0 :(得分:0)

问题出在timezoneOffset上。我将下一个代码添加到全局setOptions并解决了问题。

global: { useUTC: false, },