-
Notifications
You must be signed in to change notification settings - Fork 941
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Timezone is not adjustable for Time based axis #140
Comments
👍 See also https://github.com/shutterstock/rickshaw/blob/master/src/js/Rickshaw.Fixtures.Time.js#L5 -- this |
+1 |
Yes, it would be nice if this were more flexible. |
We actually ran into this problem recently, and we forked the repo to include time zone offset. You can check out the code here: https://github.com/alphaboost/rickshaw/blob/master/src/js/Rickshaw.Graph.Axis.Time.js Basically, we added an argument to the Rickshaw.Graph.Axis.Time.js, which should be the time zone offset from UTC (i.e. -7 for PDT) * the number of seconds in an hour (3600, since Rickshaw uses seconds instead of milliseconds). The code isn't quite ready for a pull request on Rickshaw, but it did the trick for us. When we have time to polish it up we'll drop it on a pull. |
That's great, I'll use that in the mean time but would love to it to be pulled into Rickshaw after cleanup |
Cool, I'll get this on a pull by the end of the week. |
Any update on the pull request? |
+1 as well as formatting the hover timestamp |
It seems you can accomplish this by overriding the xFormatter function like so. var hoverDetail = new Rickshaw.Graph.HoverDetail( {
graph: graph,
formatter: function(series, x, y) {
var date = '<span class="date">' + new Date(x * 1000).toDateString() + '</span>';
var swatch = '<span class="detail_swatch" style="background-color: ' + series.color + '"></span>';
var content = swatch + series.name + ": " + numberWithCommas(parseInt(y)); // + '<br>' + date;
return content;
},
xFormatter: function(x) {
return new Date(x * 1000).toDateString();
},
} );
|
Sorry about the delay...I haven't been able to get online with the east On Friday, November 2, 2012, Skye Nott wrote:
|
I think that the time axis should be drop in favor of If we do that, we could close this issue. |
+1 as well as formatting the hover timestamp |
I fix it Here: https://github.com/idning/giraffe |
Hey @idning - I had a quick look, but it's hard to see which changes were made to Rickshaw / D3 to make this work. As far as I could see, those were the only changes - and not specifically inside Giraffe? I think it would be great if you could make a pull request to Rickshaw, so this might hopefully get merged-in and supported by the Rickshaw library. |
I made a Pull Request #239 out of necessities. My goal was more narrow to show local time, instead of make timezone adjustable. I didn't go the I post it here because it might help other, before the real fix. |
You can also just make your own unit formatter and send it to timeUnit. I'm using moment in this example: # Create the formatter
unit_formatter = name: '2 hour', seconds: 3600 * 2, formatter: (d) -> moment(d).format('h:mm a')
# Pass to the time axis
xAxis = new Rickshaw.Graph.Axis.Time
graph: graph,
ticksTreatment: ticksTreatment,
timeUnit: unit_formatter
xAxis.render() |
This looks like a great suggestion/workaround @rbriski, thanks! I'll try to see if I can use it for giraffe, to resolve kenhub/giraffe#15 and kenhub/giraffe#21 |
+1 for handling timezones |
The trick actually is hacking the ticks like @ryancurtin did, and use a custom time unit formatter as @rbriski said too. The first hack is used to sync the X axis ticks with your data points, and the second one is to avoid having the wrong date displayed on the ticks. Anyway, the ticks offsets will be often wrong because they are calculated with seconds span and not from a real calendar (i.e: month = 86400 * 30.5), so I think this Time Axis has to be rewritten from scratch. Will post one I have time to write it. |
Hi guys, Took time this morning to write a new component wich uses d3.time to compute ticks offsets and allow you to customize the labels for displaying proper timezone formats. Here is the code: https://gist.github.com/pierre-b/f9be76e3237c12951262 Feel free to merge it with the official code base if you want to. |
@pierre-b , thanks for putting in the time (in multiple senses of the phrase.) The link to your code is giving a 404 at the moment, however UPDATE: I've since placed in @ryancurtin's suggested edits, and got things to work. Thanks! |
Sorry @RashidClark since there was no much activity here I thought the Rickshaw project was dead and I deleted my code to switch to another graph lib (a commercial one), however thank you for Rickshaw I was really happy to use it by the time ;) |
So there's still no official, merged solution for this, despite multiple attempts at solutions and pull requests? Is anyone even still managing this project? |
+1 (even if this is like 5 month late, still it's really worth it to have timezone offsetting) |
The Rickshaw documentation is really bad, so you have to read the source code to make sense of the library which is agony for new comers. Maybe we all should make a public documentation for this amazing library. Anyway, here's a simple solution. For the X-Axis use -
Now you might have face inconsistency with
This is because Rickshaw by default uses Side note: Rickshaw uses seconds instead of milliseconds, therefore the |
+1 for handling timezones |
While very elegant, the existing system doesn't seem to allow displaying the x axis unix timestamps using whatever time zone is appropriate (browser time zone for example).
It ends up using (for hour formatting) something like this:
no matter what
The text was updated successfully, but these errors were encountered: