高图x轴日期问题

时间:2019-02-01 15:39:59

标签: highcharts ionic3

我正在尝试在x轴上显示日期。所有日期都显示一天休假。这是我要在x轴上显示的日期4/23 / 2017、4 / 30 / 2017、5 / 7 / 2017、5 / 14 / 2017、05 / 21 / 2017、06 / 04/2017并且显示的是这个enter image description here。它显示的日期不存在或附近(5/29/2017)与其他日期重叠。这是我的代码xAxis: { tickAmount: 5, type: 'datetime', dateTimeLabelFormats: { day: '%m/%d/%Y', week: '%m/%d/%Y', month: '%m/%d/%Y', }, labels: { style: { fontFamily : "Open Sans" }, } }, time: {useUTC: false },

1 个答案:

答案 0 :(得分:0)

发生这种情况是因为您拥有time.useUTC = true(默认选项)。将其更改为false,它应该可以正常工作。

代码:

var data = [
  ['4 / 23 / 2017', 1], // [date, value]
  ['4 / 30 / 2017', 2],
  ['5 / 7 / 2017', 4],
  ['5 / 14 / 2017', 2],
  ['05 / 21 / 2017', 3],
  ['06 / 04 / 2017', 5]
];

Highcharts.chart('container', {

  xAxis: {
    tickAmount: 5,
    type: 'datetime',
    dateTimeLabelFormats: {
      day: '%m/%d/%Y',
      week: '%m/%d/%Y',
      month: '%m/%d/%Y',
    },
    labels: {
      style: {
        fontFamily: "Open Sans"
      },
    }
  },
  time: {
    useUTC: false
  },

  series: [{
    data: data.map(elem => {
        elem[0] = new Date(elem[0]).getTime();
      return elem;
    })
  }]
});

API:

演示: