1

I'm still learning about bokeh and reveal.js, have been impressed with both and so apologies if this is a basic question.

How can I fully display a bokeh chart on a Jupyter slide without scroll bars appearing?

Below is an example: This chart appears fine in Jupyter as a notebook (note the absence of horizontal scroll bar and the x axis ends at 2015) enter image description here

But when converted to slides (via the outstanding RISE) it doesn't fit on the slide (missing years 2012 onward) and a horizontal scroll bar appears.

enter image description here

Do i need to set the size of the Bokeh figure? If so, what should it be?

or

Can I add some metadata code to the Jupyter cell to increase the page size?

I'm using RISE to automatically create the slide from Jupyter thanks

prosoitos
  • 6,679
  • 5
  • 27
  • 41
bs123
  • 1,183
  • 3
  • 11
  • 21
  • This is probably because crash between css from RISE, reveal.js and Bokeh. Can you open an issue at RISE repo and link the notebook so I can try to figured out the css overlapping? Thanks! – Damian Avila Oct 28 '15 at 20:41
  • Thanks Damian and apologies for delay in reply, Issue opened https://github.com/damianavila/RISE/issues/162 – bs123 Oct 29 '15 at 02:20

1 Answers1

0

(disclaimer: I am a founder of Gryd)

Try something like this: https://beta.gryd.us/notebook/published/dTBiH2W8qCdfj3Qvfd3bNP/Reveal%20+%20Bokeh.ipynb

You have to internally increase the size of the slides and then you can set the height and width parameters on Bokeh plots to fill up the screen (pre-enabled on Gryd). If you clone the notebook, you will see that I also collapse the code cell in the last slide to allow the figure to take up most of the space.

Looks like this: enter image description here

abhishekbajpayee1990
  • 11
  • 2