| About | Webslides is a Python package that creates HTML presentations like this one. It enables easy sharing of Python-generated content such as charts, other visuals and data |
| Contents | This presentation demonstrates features of the HTML format and should help you get started |
| PyPi | link |
| GitHub | link |
| WHY Advantages over Powerpoint 1. Dynamic pagelength 💡 2. Interactive content 💡 3. Any HTML content will render 💡 4. Styled Pandas Dataframes 💡 5. Super speed updates! 💡 HOW Getting Started 6. Install and Import 💡 7. Run Demo 💡 8. Hello World 💡 |
| column1 | column2 | column3 | column4 | column5 | |
|---|---|---|---|---|---|
| row1 | 50% | 29% | 6% | 95% | 82% |
| row2 | 58% | 38% | 96% | 29% | 70% |
| row3 | 41% | 29% | 49% | 25% | 96% |
| row4 | 93% | 20% | 46% | 87% | 94% |
| row5 | 9% | 43% | 43% | 32% | 26% |
| row6 | 96% | 92% | 82% | 15% | 58% |
| row7 | 16% | 9% | 70% | 50% | 30% |
| row8 | 54% | 21% | 38% | 13% | 2% |
| row9 | 32% | 75% | 96% | 18% | 96% |
| row10 | 70% | 35% | 89% | 91% | 96% |
#install package
pip install webslides
#import package
import webslides as ws#import
import webslides as ws
#create and open this demo.html in browser
ws.demo()
# imports
import webslides as ws
import plotly.graph_objects as go
# simple plotly fig
def simple_fig():
x = list(range(1, 11))
y1 = [2 * i for i in x]
y2 = [3 * i for i in x]
trace1 = go.Scatter(x=x, y=y1, mode='markers+lines', name='Line 1')
trace2 = go.Scatter(x=x, y=y2, mode='markers+lines', name='Line 2')
fig = go.Figure()
fig.add_trace(trace1)
fig.add_trace(trace2)
fig.update_layout(title='Simple Plotly Line Figure with Two Lines', height=600)
return fig
# title page
title_page = {
'title': 'Hello World!<br>Title of Title Page',
'title_image_url': 'https://datadept.nl/webslides/package.png',
'summary': {
'Summary item 1': 'This presentation demonstrates some of the features of webslides and could be used as a starting point for a new presentation',
'Summary item 2': 'item text 2'},
'footer': ['- configure title page image via the title_image_url parameter',
'- configure custom footer image via the footer_image_url parameter']
}
# tooltips (optional!)
tooltips = {'topcats': {'Topcat A': 'Put your own tooltip text here',
'Topcat B': 'Put your own tooltip text here'},
'subcats': {'Subcat X': 'Tooltip text for subcat x here',
'Subcat Y': 'Tooltip text for subcat y yere'}}
# content pages
content = {
'Topcat A': {
'Subcat X': {
'page1': {
'title': 'Page Title 1 - HTML body',
'highlights': ['- highlight 1', '- highlight 2'],
'body': 'Content 1: this is a <b>HTML string</b>',
'footer': ['- footer 1a', '- <i>italic footer 1b</i>'],
'show': True},
'page2': {
'title': 'Page Title 2 - No highlights',
'body': 'Content 2: this is a <b>HTML string</b>',
'footer': ['- Note: No highlights, so no lightbulb in the index page', '- <i>italic footer 2b</i>'],
'show': True}
},
'Subcat Y': {
'page3': {
'title': 'Page Title 3 - Plotly fig !',
'highlights': ['- highlight 3', '- note: no footer on this page'],
'body': simple_fig(),
'show': True}
}
},
'Topcat B': {
'Subcat Z': {
'page4':
{
'title': 'Page Title 4 - Different topcat',
'highlights': ['- highlight 5', '- highlight 6'],
'body': 'Content 3',
'footer': ['- footer 4a', '- footer 4b'],
'show': True
}
}
}
}
custom_css = '''
body {font-family: Arial, sans-serif; background-color: #FFF}
.page {border-radius:0px;}
#title_page_image {width:400px !important;}
#footer_image {opacity: 0.5;}'''
# MAIN
ws.create(content=content
, title_page=title_page
, fname='hello_world.html'
, open_in_browser=True
, show_index_page=True
, show_topcat=True
, show_subcat=True
, show_highlights_page=False
, show_highlights_only=False
, contents_title='Contents header'
, footer_image_url='https://datadept.nl/img/datadept_logo_black.png'
, embed_images=False
, custom_css=custom_css
, tooltips=tooltips)