У меня есть набор данных для дат. Какое значение следует предоставлять значениям оси X? Как заставить Rickshaw отображать значения данных X в качестве дат?Как график даты на оси X в Рикше
Я просмотрел документы и примеры и ничего не могу найти.
Я наконец понял, что значения оси X должны быть значениями времени эпохи. Затем, используя код из примеров, я смог показать правильную временную шкалу.
У меня все еще есть проблема, потому что я хотел бы показать отметки на недели по оси Х. Однако установка timeUnit в «week» вызывает ошибки JavaScript. Однако он работает с другими единицами времени.
Дополнительно к ответу Ларс, я нашел по умолчанию Рикша звонит
.toUTCString(x.value*1000) //(just ctrl+F to find where =)).
В моем случае, я видел другую метку времени на X между графитом и Рикшей по этой причине, и он прекрасно работает, когда я изменил это
.toLocaleString(x.value*1000).
Кроме того, вы, возможно, потребуется изменить это в двух местах: Rickshaw.Graph.Axis.Time и ... HoverDetails
Я только начал использовать R ickshaw и находился в конкретной ситуации.
Но, прежде чем я пойду дальше, документация Рикши практически не существует, что очень расстраивает, поскольку производительность Рикши по сравнению с другими графическими библиотеками JS является выдающейся.
Лучший способ найти примеры - выкопать исходный код и пример кода на их странице github, чтобы понять смысл (не так, как должна быть документация).
Это, как говорится, попробуем построить сильную базу вопросов/ответов здесь, на StackOverflow!
Итак, вернемся к вопросу :) Похоже, вы уже нашли свое собственное решение вопроса, но я также предоставлю свое решение.
Вместо того, чтобы использовать Rickshaw.Graph.Axis.Time, я использовал Rickshaw.Graph.Axis.X и установил tickFormat соответственно.
var data = [ { x: TIME_SINCE_EPOCH_IN_SECONDS, y: VALUE },
{ x: NEXT_TIME_SINCE_EPOCH_IN_SECONDS, y: NEXT_VALUE } ]
var xAxis = new Rickshaw.Graph.Axis.X({
graph: graph,
tickFormat: function(x){
return new Date(x * 1000).toLocaleTimeString();
}
})
xAxis.render();
toLocaleTimeString() может быть любой из функций Javascript даты, такие как toLocaleString(), toLocaleDateString(), toTimeString() или toUTCString(). Очевидно, потому что tickFormat принимает функцию в качестве аргумента, которую может предоставить собственный форматтер.
Koliber, мне было бы интересно понять ваш ответ, если бы вы могли предоставить более подробную информацию.
Имя функции в образце кода неправильно указано как «toLocateString», когда оно должно быть «toLocaleString». Не удалось сделать редактирование, так как «редактирование должно быть 6 символов»:/ –
@BarnabyMercer, хороший улов - обновлен. – MandM
Я также должен был поблагодарить вас, поскольку это решение было именно тем, что мне было нужно. Ура! –
Ничего из этого не сработало для меня. То, что работало с angularjs было:
'x' : d3.time.format.iso.parse(date).getTime(), 'y' : 10
Вы видели [пример] (http://code.shutterstock.com/rickshaw/examples/lines.html)? –
Да. Я рассмотрел примеры. Теперь я понял, что моя ось не проявлялась хорошо, потому что я не включил css. Но я до сих пор не понял, как предоставить данные о дате и сделать их как даты. Примеры генерируют случайные данные, и я не знаю, в каком формате он находится. –
Я думаю, что проще всего было бы распечатать переменную, содержащую данные на консоли отладки, чтобы вы могли ее просмотреть. –