8000 GitHub - asaboor-gh/ipyslides: Create Interactive Slides in Jupyter Notebook with all kind of rich content. https://asaboor-gh.github.io/ipyslides/
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

asaboor-gh/ipyslides

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

IPySlides

DOI Binder PyPI version Downloads

IPySlides is a Python library for creating interactive presentations in Jupyter notebooks. It combines the power of Markdown, LaTeX, interactive widgets, and live variable updates in a single presentation framework.

See PDF Slides



Features

  • ๐Ÿ“Š Support for plots, widgets, and rich media
  • ๐ŸŽจ Customizable themes and layouts
  • ๐Ÿ“ฑ Responsive design for various screen sizes
  • ๐Ÿ“ค Export to HTML/PDF (limited content type)
  • ๐ŸŽฏ Frame-by-frame animations
  • ๐Ÿ“ Speaker notes support
  • ๐Ÿ”„ Markdown file synchronization
  • โœ๏ธ Drawing support during presentations

Quick Start

  1. Install:
pip install ipyslides        # Basic installation
pip install ipyslides[extra] # Full features
  1. Create Slides:
import ipyslides as isd
slides = isd.Slides()

# Add content programmatically
slides.build(-1, """
# My First Slide
- Point 1
- Point 2
$E = mc^2$
""")

# Or use cell magic
%%slide 0
# Title Slide
Welcome to IPySlides!
  1. Run Examples:
slides.docs()  # View documentation
slides.demo()  # See demo presentation

Content Types

Support for various content types including:

  • ๐Ÿ“œ Extended Markdown, see slides.xmd_syntax
  • ๐Ÿ“Š Plots (Matplotlib, Plotly, Altair)
  • ๐Ÿ”ง Interactive Widgets
  • ๐Ÿ“ท Images and Media
  • โž— LaTeX Equations
  • ยฉ๏ธ Citations and References
  • ๐Ÿ’ป Auto update variables in markdown
  • ๐ŸŽฅ Videos (YouTube, local)
  • ๐ŸŽฎ Enhanced interactive widgets (with fullscreen support, thanks to anywidget)
import numpy as np
from ipywidgets import HTML

@slides.ei.interact(html = HTML(), amplitude= (0, 2),frequency=(0, 5))
def plot(html, amplitude, frequency):
    x = np.linspace(0, 2*np.pi, 100)
    y = amplitude * np.sin(frequency    * x)
    plt.plot(x, y)
    html.value = slides.plt2html(). value
  • For comprehensive dashbords, subclass InteractBase
import numpy as np
from ipywidgets import HTML
from ipyslides.interaction import InteractBase, callback 

class MyDashboard(InteractBase):
    def _interactive_params(self): # Define interactive parameters
        return {
            'html': HTML(),
            'amplitude': (0, 2),
            'frequency': (0, 5),
        }

    @callback
    def plot(self, html, amplitude, frequency):
        x = np.linspace(0, 2*np.pi, 100)
        y = amplitude * np.sin(frequency * x)
        plt.plot(x, y)
        html.value = slides.plt2html().value
    
    @callback('out-text')
    def text(self, amplitude, frequency):
        print(f"Amplitude: {amplitude}\n Frequency: {frequency}")

dash = MyDashboard(auto_update=False)
dash.relayout( # can be set via app_layout parameter
    left_sidebar = dash.groups.controls, 
    center = ['html','out-text'], # out-plot, out-text collected in center
    pane_widths = [3,5,0]
)
dash.set_css(
    main = { # can be set via grid_css parameter
        'grid-gap': '4px', 'margin': '8px',
        '.left-sidebar': {'background': '#eee','border-radius': '8px'},
    },
    center = { # can be set via grid_css parameter targetting '> .center'
        '> *': {'background-color': 'whitesmoke', 'border-radius': '8px','padding':'8px'}
        'grid-template-columns': '5fr 3fr', # side-by-side layout for outputs
        'grid-gap': '4px', # central grid gap
        '> *': {'background-color': 'whitesmoke', 'border-radius': '8px','padding':'8px'}
})
display(dash)

Dashboard Example See more examples in einteract repository and on Binder.

  • And much more!

Export Options

  • HTML Export
    Use slides.export_html to build static slides that you can print as well. Read export details in settings panel, where you can also export with a single click.

  • PDF Export

  1. Export to HTML first
  2. Open in Chrome/Edge browser
  3. Use Print โ†’ Save as PDF and enable background graphics

Advanced Features

  • Custom Objects Serialization:

    • You can serialize custom objects to HTML using Slides.serializer API.
    • You can extend markdown syntax using Slides.extender API. See some good extensions to add from PyMdown.
  • Speaker Notes: Enable via Settings Panel โ†’ Show Notes and add notes via slides.notes.

  • Custom Styling:

slides.set_css({ # on all slides or slide[index,].set_css() per slide
    '--bg1-color': '#f0f0f0',
    '--text-color': '#333'
})
  • File Sync: Live edit a linked markdown file that updates slides in real-time using slides.sync_with_file.

Caveats

  1. Markdown Cells:

    • Jupyter markdown cells are not processed by IPySlides
    • Instead, you can use %%slide number -m cell magic and link an external markdown file using slides.sync_with_file
  2. Slide Numbering:

    • Use -1 for automatic slide numbering
    • Manual numbering requires careful tracking to avoid overwriting slides
  3. Speaker Notes:

    • Experimental feature - use with caution

Development

git clone https://github.com/asaboor-gh/ipyslides.git
cd ipyslides
pip install -e .

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.


Documentation

Acknowledgements


Made with โค๏ธ by Abdul Saboor

About

Create Interactive Slides in Jupyter Notebook with all kind of rich content. https://asaboor-gh.github.io/ipyslides/

Resources

License

Stars

Watchers

Forks

Packages

No packages published
0