jQuery Flot Tick/Date Alignment

Код

Пример моей проблемы: http://jsfiddle.net/x46RQ/

Цель

Я хочу, чтобы график представлял собой гистограмму, например: http://jsfiddle.net/Lbd85/, но, очевидно, с датами в качестве оси x. Если я добавлю свои данные в эту скрипку, они испортятся, как указано выше, как показано здесь: http://jsfiddle.net/73G7Z/

Вопросы

  • Почему все 3 дня, указанные в переменной данных, не отображаются?
  • Почему столбцы не выровнены с соответствующими делениями по оси X?
  • Почему изменение данных и режима на время полностью портит то, что в противном случае было бы функциональной и точной гистограммой?

Окружающая обстановка

  • jQuery 1.7.1
  • jQuery для мобильных устройств 1.0.1
  • Флот 0,7

Спасибо

Дайте мне знать, если потребуется какая-либо дополнительная информация.


javascript flot jquery-plugins
person Eric H    schedule 27.02.2012    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Часть № 1. Вы указали минимальное значение y, равное 0, в параметрах флота, а ваша точка данных № 2 имеет нулевое значение. Так что он есть, но очень маленький, почти невидимый.

Часть № 2, вы должны сместить свои даты по часовому поясу пользователей:

Что-то вроде этого:

var tzOffset = new Date();
tzOffset = tzOffset.getTimezoneOffset()*60*1000;
data.push([(new Date("2012/02/20").getTime()-tzOffset), 1]);

Часть № 3. На вашем графике беспорядок, потому что вы указали width, хотя на самом деле вы искали вариант barWidth, и вам нужно указать ширину во времени, то есть в миллисекундах. См. здесь, как это сделать. Что-то вроде barWidth: 12*60*60*1000 выглядит нормально.

В общем, вот как это будет выглядеть: http://jsfiddle.net/ncTd3/

person Ryley    schedule 27.02.2012
comment
Спасибо за ответ. Почему столбцы не отцентрованы и почему галочки по оси X все еще смещены от центра? Мне бы очень хотелось, чтобы он выглядел идентично гистограмме, которую я упомянул в вопросе. Еще раз спасибо за ваш ответ. - person Eric H; 28.02.2012
comment
В моем примере jsfiddle я не использовал код для вычисления tzOffset, я просто установил его на свой (PST). Проверьте это здесь, теперь это должно работать для любого часового пояса: jsfiddle.net/ryleyb/ncTd3/1< /а> - person Ryley; 28.02.2012