Какой формат js-библиотека highcharts принимает для дат?

Question

Я использую старшие графики и не могу понять, какой должна быть дата, начиная с даты в рельсах и до формата, принятого старшими для дат.

В моем миграционном файле я храню дату, подобную этой:

t.date :consumption_date

Значение сохраняется в этом формате "2012-03-25", и, идя к терминалу и находя запись, я получаю это:

=>  Sat, 31 Mar 2012

При отображении диаграммы на отдельных точках отображается Недопустимая дата . Следующий массив возвращает вывод в старшие графики для визуализации

[[Sun, 25 Mar 2012, 1158], [Sat, 31 Mar 2012, 1200]]

Формат, который старшие диаграммы используют в одной из своих демонстрационных диаграмм, когда данные передаются в jquery, имеет вид:

[[Date.UTC(1970,  9, 27), 0   ], [Date.UTC(1970, 10, 10), 0.6 ]]

Как я могу избавиться от неверной даты, отправив правильный формат даты в верхние чарты.

Answer 1

Внутренне Highcharts использует числа даты javascript (количество миллисекунд с 1 января 1970 года) для представления дат.См. Справочник Mozilla .

. Чтобы получить даты на оси, сначала необходимо установить тип оси на «datetime»:

xAxis: {
    type: 'datetime'
}

У вас есть несколько вариантовпри указании данных серии (все три примера дают одну и ту же диаграмму):

1. Установка начальной точки и использование фиксированного интервала между точками

   pointStart: Date.UTC(2012, 2, 6, 10),
   pointInterval: 1000 * 60 * 60,
   data: [5, 6, 4]
   

2. Указание точной даты с помощью метода Date.UTC.Этот способ удобочитаем для людей:

   data: [
       [Date.UTC(2012, 2, 6, 10), 5], 
       [Date.UTC(2012, 2, 6, 11), 6], 
       [Date.UTC(2012, 2, 6, 12), 4]]
   

3. Или указание времени эпохи напрямую:

   [[1331028000000, 5], [1331031600000, 6], [1331035200000, 4]]
   

Пример на jsfiddle

Answer 2

Добавление @eolsson, время эпохи, как правило, является подходящим способом, поскольку технически объекты Date () являются javascript, а не JSON, и вы вряд ли найдете готовый сериализатор, который их генерирует.

Вы тоже захотите отформатировать дату примерно так -

xAxis: {
  type: 'datetime',
  labels: {
    formatter: function() {
      return Highcharts.dateFormat('%e %b', this.value*1000); // milliseconds not seconds
    },
  }
}

Форматирование даты выполнено php style .