mbostock / stack Goto Github PK
View Code? Open in Web Editor NEWA presentation library with intuitive, scroll-based navigation.
Home Page: https://mbostock.github.io/stack/
License: Other
A presentation library with intuitive, scroll-based navigation.
Home Page: https://mbostock.github.io/stack/
License: Other
Using stack for a presentation, and it's working great. It would be great for it to use hashes for slide indices so that you can link to individual slides - I could whip up a pull req if that sounds good.
First thanks for Stack it's great.
On touchscreen devices in Chrome keyboard action don't reveal all of the next slide, only part of it. Also, slides don't become active, which means things like the Lorenz animation in the example slide deck aren't triggered. However, things do work as expected in IE 11.
Phil
I don't know if how recent this change is, but this iOS check now returns true for Chrome (I've got 20.0.1180.79):
// Don't do anything fancy for iOS.
if (section.style("display") == "block")
return;
I looked at stack a few weeks ago, and it worked then. This might be due to a beta channel update, but I can't for the life of me figure out where they moved that information in the Chrome about dialog.
Hi @mbostock ,
I wanted to associate explanations to my slides so I added sound support to stack.
When loading, stack tries to pull the sound associated to each slide. The convention is pretty straight forward; sounds have to be under sounds/ and have to be named: (\d+).mp3
, where (\d+)
is the number of the slide. Right now the user can play the sound for a slide hitting the s
key. When transitioning between slides the sound will stop.
The component that implements all the sound logic is pretty self-contained. I have minimally modified stack.js
to add the necessary calls to the sound component.
You can see all these in action here. Warning: I have only added sounds to the first three slides.
If you find this interesting I can prepare a pull request. Let me know,
-drd
section[0] to be altered to section.nodes()
event.activate is not a function...
will there be a fix?
Have you planned to optimize Stack for small screens?
Hey there thank you for this quite easy-to-use library!
I was wondering though how I could implement navigation with links to a slide.
The intuitive approach of jumping to an anchor with both html an JS failed:
<a href="#one">Jump to one</a>
or:
<a href="#" onclick="document.getElementById('one').scrollIntoView()">Jump to one</a>
jumping to:
<p id="one">Slide one<p>
I just tried Stack, and it's great. Congratulations. I've been using D3 for a while, and even though Stack is a minor thing next to D3, well... it is still great.
It is not a big issue for me, as most of my traffic is from desktop. But I was wondering if there is a quick workaround to make Stack work on iPad / iPhone.
Thanks
In the demo:
https://mbostock.github.io/stack/
scrolling down works fine, but once down a few pages, if then resizing (vigorously) the Safari window, scrolling messages seem to be sent.
Perhaps this is a result of the resizing of the scroll bar hitting some limits that send scroll messages. But I'm only guessing.
This does not happen on the first slide/page. You'll need to go down a few pages/slides before resizing to see this happen.
Hi,
first of all: thanks for all the good stuff you're doing!
I was wondering how I could make sections preserve their size and height ratios no matter how much content is on them, so that I can position headers etc. on the slide and have them all appear in the same place, independent of the the other content on that slide? (My question is basically the same as this reveal.js one I guess: hakimel/reveal.js#1312).
Would be great if you could help!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.