4 ms·

Graph-scroll.js – Simple scrolling events for D3.js graphics

71 points by sebg 11y ago

sebg 11y ago
If you liked this walk through, definitely check out Jim Vallandingham's write up -> http://vallandingham.me/scroller.html http://vallandingham.me/scroller.html as well as his presentation from the 2015 OpenVis Conf titled "So You Think You Can Scroll"-> https://www.youtube.com/watch?v=fYQGgaE_b4I https://www.youtube.com/watch?v=fYQGgaE_b4I
mgalka 11y ago
Really like this one. Lots if practical uses. Only problem I see us that the graphics momentarily disapper after reaching the top if the page.
tudorw 11y ago
The global warming link is a great example of this in use, look forward to finding some excuse to use it as soon as I can!
- 1wheel 11y ago
  NYT and Guardian have also put out great scrolling graphics over the last few days: http://www.nytimes.com/interactive/2015/10/27/world/greenland-is-melting-away.html http://www.nytimes.com/interactive/2015/10/27/world/greenlan... http://www.theguardian.com/us-news/ng-interactive/2015/oct/19/homan-square-chicago-police-detainees http://www.theguardian.com/us-news/ng-interactive/2015/oct/1... https://source.opennews.org/en-US/articles/how-we-made-homan-square-portrait/ https://source.opennews.org/en-US/articles/how-we-made-homan...
arxpoetica 11y ago
We maxed out on scrollytelling when we built http://hollowdocumentary.com/ http://hollowdocumentary.com/. I think we probably violated some of his rules here, but it was experimental for us.
temo4ka 11y ago
There is also ScrollMagic http://scrollmagic.io/ http://scrollmagic.io/
andy_ppp 11y ago
It's such a shame it's still impossible (AFAIK, would love to be corrected) to accurately hook into momentum scrolling on iOS Safari. window.scrollTop only changes once the scroll momentum has finished. Be pretty simple for Apple to pass this information in requestAnimationFrame but of course they don't. Don't even talk to me about the mess that is replacing the native scrolling!
- temo4ka 11y ago
  Safari serves a very important role of showing users how decidedly inadequate web experience is compared to native.
- ninjay 11y ago
  I think this was changed in iOS 8 http://developer.telerik.com/featured/scroll-event-change-ios-8-big-deal/ http://developer.telerik.com/featured/scroll-event-change-io...
  - andy_ppp 11y ago
    This does not seem to be true for me in iOS 9.1: try this... http://johnpolacek.github.io/superscrollorama/ http://johnpolacek.github.io/superscrollorama/ The article does mention scrollerama so no idea what is going on.
kelvin0 11y ago
This is cool, and can potentially enhance some presentations. However, what I like less is the fact then that this type of thing is peppered any which way on a bunch of pages and ends up making the reading experience less than enjoyable ... Kinda like the animated gifs of the 90's web pages
brogrammmer 11y ago
Holy shit. SCROLLING. This is technology. This is why I became a coder. To bring this to the world. #disruption

71 points by sebg 11y ago

sebg 11y ago

If you liked this walk through, definitely check out Jim Vallandingham's write up -> http://vallandingham.me/scroller.html http://vallandingham.me/scroller.html as well as his presentation from the 2015 OpenVis Conf titled "So You Think You Can Scroll"-> https://www.youtube.com/watch?v=fYQGgaE_b4I https://www.youtube.com/watch?v=fYQGgaE_b4I

mgalka 11y ago

Really like this one. Lots if practical uses. Only problem I see us that the graphics momentarily disapper after reaching the top if the page.

tudorw 11y ago

The global warming link is a great example of this in use, look forward to finding some excuse to use it as soon as I can!

1wheel 11y ago
NYT and Guardian have also put out great scrolling graphics over the last few days: http://www.nytimes.com/interactive/2015/10/27/world/greenland-is-melting-away.html http://www.nytimes.com/interactive/2015/10/27/world/greenlan... http://www.theguardian.com/us-news/ng-interactive/2015/oct/19/homan-square-chicago-police-detainees http://www.theguardian.com/us-news/ng-interactive/2015/oct/1... https://source.opennews.org/en-US/articles/how-we-made-homan-square-portrait/ https://source.opennews.org/en-US/articles/how-we-made-homan...

arxpoetica 11y ago

We maxed out on scrollytelling when we built http://hollowdocumentary.com/ http://hollowdocumentary.com/. I think we probably violated some of his rules here, but it was experimental for us.

temo4ka 11y ago

There is also ScrollMagic http://scrollmagic.io/ http://scrollmagic.io/

andy_ppp 11y ago

It's such a shame it's still impossible (AFAIK, would love to be corrected) to accurately hook into momentum scrolling on iOS Safari. window.scrollTop only changes once the scroll momentum has finished. Be pretty simple for Apple to pass this information in requestAnimationFrame but of course they don't. Don't even talk to me about the mess that is replacing the native scrolling!

temo4ka 11y ago
Safari serves a very important role of showing users how decidedly inadequate web experience is compared to native.
ninjay 11y ago
I think this was changed in iOS 8 http://developer.telerik.com/featured/scroll-event-change-ios-8-big-deal/ http://developer.telerik.com/featured/scroll-event-change-io...
- andy_ppp 11y ago
  This does not seem to be true for me in iOS 9.1: try this... http://johnpolacek.github.io/superscrollorama/ http://johnpolacek.github.io/superscrollorama/ The article does mention scrollerama so no idea what is going on.

kelvin0 11y ago

This is cool, and can potentially enhance some presentations. However, what I like less is the fact then that this type of thing is peppered any which way on a bunch of pages and ends up making the reading experience less than enjoyable ... Kinda like the animated gifs of the 90's web pages

brogrammmer 11y ago

Holy shit. SCROLLING. This is technology. This is why I became a coder. To bring this to the world. #disruption