def view() -> pn.Column: """# Bootstrap Dashboard Page. Creates a Bootstrap Dashboard Page with a Chart and a Table - inspired by the [GetBoostrap Dashboard Template] (https://getbootstrap.com/docs/4.4/examples/dashboard/) - implemented using the `awesome_panel' Python package and in particular the `awesome_panel.express.templates.BootstrapDashboardTemplate` Returns: pn.Column -- The Orders View """ table = pn.Pane( _get_table_data(), sizing_mode="stretch_width", ) pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), pn.Column( pnx.SubHeader("Dashboard"), pn.pane.HoloViews(_holoviews_chart()), ), pn.Column( pnx.SubHeader("Section Title"), table, ), ] return site.create_template(title="Bootstrap Dashboard", main=main, main_max_width="800px")
def view() -> pn.Column: """Wraps all tests in a Column that can be included in the Gallery or served independently Returns: pn.Column -- A Column containing all the tests """ pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), pn.pane.Alert( """**You can also use the Social Sharing Buttons** in your site via the [`awesome_panel_extensions`](https://pypi.org/project/awesome-panel-extensions/) package. Please click and share if you like awesome-panel.org or the `awesome-panel-extensions`. Thanks.""", margin=0, ), pn.Row( pn.Spacer(), ShareOnTwitter(url="https://awesome-panel.org", size=6), ShareOnLinkedIn(url="https://awesome-panel.org", size=6), ShareOnReddit(url="https://awesome-panel.org", size=6), ShareOnFacebook(url="https://awesome-panel.org", size=6), ShareOnMail(url="https://awesome-panel.org", size=6), ), ] return site.create_template(title="Share Links", main=main)
def _get_view(self): """Returns the application view""" pn.config.sizing_mode = "stretch_width" intro_section = APPLICATION.intro_section() main = [ intro_section, pn.Column( pn.pane.Markdown("#### Settings"), pn.Param( self, parameters=["load_time", "update_action"], show_name=False, sizing_mode="stretch_width", widgets={"update_action": { "button_type": "primary" }}, ), pn.pane.Markdown("#### Progress"), self.progress_widget, pn.pane.Markdown("#### Plot"), self.plot_pane, ), ] template = site.create_template(title="Data Explorer Loading", main=main) self.plot_pane.theme = template.theme.bokeh_theme return template
def __init__(self, **params): super().__init__(**params) pn.config.sizing_mode = "stretch_width" app = pn.Column( pn.pane.Markdown("## Background Task"), pn.Param( self, parameters=["do_stuff", "result"], widgets={"result": {"disabled": True}, "do_stuff": {"button_type": "primary"}}, show_name=False, ), progress.view, pn.pane.Markdown("## Other Tasks"), pn.Param( self, parameters=["select", "slider", "text"], widgets={"text": {"disabled": True}}, show_name=False, ), ) main = [APPLICATION.intro_section(), app] self.view = site.create_template( main=main, main_max_width="700px", )
def view(): """Returns a instance of the Dashboard.view""" pn.config.sizing_mode = "stretch_width" intro_section = APPLICATION.intro_section() main = [intro_section, Dashboard().view] return site.create_template(title="Classic Dashboard", theme="default", main=main, main_max_width="80%")
def view(): """Returns a column with the main view. The main view is displayed at awesome-panel.org""" css_and_js = """ <script src="https://unpkg.com/@webcomponents/[email protected]/webcomponents-loader.js">\ </script> <script src="https://wiredjs.com/dist/showcase.min.js"></script> <link href="https://wiredjs.com/fonts/font.woff2" as="font"> <style> @font-face { font-family: 'Gloria Hallelujah'; font-style: normal; font-weight: 400; font-display: fallback; src: local('Gloria Hallelujah'), local('GloriaHallelujah'), \ url(https://wiredjs.com/fonts/font.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, \ U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } </style> <style> .bk-root .bk .wired-intro * { font-size: 16px; font-family: 'Gloria Hallelujah', sans-serif; } .bk-root .bk .wired-intro h1 { font-size: 32px; font-weight: 900; } .bk-root .bk.wired-bar h1 { color: rgb(240, 230, 244); font-family: 'Gloria Hallelujah', sans-serif; font-size: 36px; margin:0px; margin-block:0px; } </style> """ pn.config.sizing_mode = "stretch_width" css_and_js_pane = pn.pane.HTML(css_and_js, height=0, width=0, margin=0, sizing_mode="fixed") intro = pn.pane.Markdown(__doc__, css_classes=["wired-intro"]) app_bar = pn.Row( pn.pane.PNG(wired.LOGO, width=50, height=50, sizing_mode="fixed"), pn.pane.Markdown("# Wired Elements"), sizing_mode="stretch_width", height=60, background=wired.GRAY, margin=(25, 0, 25, 0), css_classes=["wired-bar"], ) wired_view = test_wired_view() # param_view = test_param_view() # tabs = pn.layout.Tabs(wired_view, param_view) main = [css_and_js_pane, intro, app_bar, wired_view] return site.create_template(title="Test Wired", main=main)
def view(): """Run this to run the application""" slider = Slider(start=0, end=10, step=0.1, value=0, title="value") custom = Custom(text="Special Slider Display", slider=slider) layout = column(slider, custom, sizing_mode="stretch_width") pn.config.sizing_mode = "stretch_width" main = [APPLICATION.intro_section(), pn.pane.Bokeh(layout)] pn.config.sizing_mode = "fixed" return site.create_template(title="Custom Model Model", main=main)
def view(): """Returns the app in a Template""" pn.config.sizing_mode = "stretch_width" template = site.create_template() app = LoadingApp(name="Loading Spinner App") template.sidebar[:] = [app.settings_panel] template.main[:] = [APPLICATION.intro_section(), app.main] if not issubclass(template.theme, pn.template.base.DefaultTheme): app.styler.background_rgb = (0, 0, 0) return template
def view() -> pn.Column: """Wraps all tests in a Column that can be included in the Gallery or served independently Returns: pn.Column -- A Column containing all the tests """ pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), test_get_default_formatters, ] return site.create_template(title="Test DataFrame", main=main)
def view(configure=True) -> pn.Column: """Returns a view of the Material Components Args: configure (bool, optional): Set this to True to include Material JS and CSS. Defaults to False. Returns: pn.Column: A Column view of the Material Components """ pn.config.sizing_mode = "stretch_width" button = material.Button(name="Click Me", icon="favorite") # select = material.Select(name="Select me", options=["Data", "Models", "Analytics"], value="Analytics", icon="favorite",) intslider = material.IntSlider(name="Slider", value=3, start=1, end=9, step=2) floatslider = material.FloatSlider(name="Slide Me", value=2.5, start=0.0, end=5.0, step=0.1) linear_progress = material.LinearProgress(name="Progress", value=10, max=100) circular_progress = material.CircularProgress(name="Progress", value=75, max=100, density=25) objects = [ APPLICATION.intro_section(), # pn.pane.Alert("If you don't see the components please reload the page!"), *section(button), *section(intslider), *section(floatslider), # *section(select), *section(linear_progress), *section(circular_progress), ] if configure: objects.append(material.Extension()) return site.create_template( title="Material Components", template="material", theme="default", main=objects, main_max_width="500px", )
def view() -> pn.Column: """Wraps all tests in a Column that can be included in the Gallery or served independently Returns: pn.Column -- A Column containing all the tests """ pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), test_info_alert(), test_error_alert(), test_warning_alert(), ] return site.create_template(title="Test Bootstrap Alerts", main=main)
def view(): """Returns the File Input Area App""" pn.config.sizing_mode = "stretch_width" fileinput_section = pn.Column( pn.pane.HTML(STYLE, width=0, height=0, sizing_mode="stretch_width", margin=0), pn.widgets.FileInput(height=100, css_classes=["pnx-file-upload-area"]), ) main = [ APPLICATION.intro_section(), fileinput_section, ] return site.create_template(main=main)
def view( self, ): """Map dashboard""" css = """ .bk.owid-card { border: 1px solid rgba(0,0,0,.125); border-radius: 0.25rem; font-family: Lato,"Helvetica Neue",Arial,sans-serif; font-weight: 400; box-shadow: 5px 5px 20px grey; } """ style = f"<style>{css}</style>" pn.config.sizing_mode = "stretch_width" content = pn.Column( self.param.dataset_name, self.map_plot, self.param.year, pn.Row( pn.layout.HSpacer(), self.download_link, sizing_mode="stretch_width", ), css_classes=["owid-content"], margin=( 10, 12, 12, 10, ), sizing_mode="stretch_width", ) card = pn.Column( content, css_classes=["owid-card"], sizing_mode="stretch_width", max_width=1000, ) main = [ pn.pane.Markdown(__doc__), pn.pane.HTML(style), card, INFO, ] return site.create_template(title="Owid Choropleth Map", main=main)
def view() -> pn.Column: """Wraps all tests in a Column that can be included in the Gallery or served independently Returns: pn.Column -- A Column containing all the tests """ pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), test_card(), test_card_fixed_width(), test_card_with_plot(), test_card_with_multiple_panels(), test_card_collapsible(), test_card_with_code(), ] return site.create_template(title="Test Bootstrap Card", main=main)
def create_app(**params): pn.config.sizing_mode = "stretch_width" template = site.create_template(title="Test Model Viewer") if "dark" in str(template.theme).lower(): background = template.theme.style.neutral_fill_card_rest else: background = GRAY top_app_bar = pn.Column( pn.layout.Row( pn.pane.HTML(MODELVIEWER_LOGO, width=50, sizing_mode="fixed"), pn.pane.Markdown( "## model-viewer", width=250, sizing_mode="fixed", margin=(10, 5, 10, 5) ), sizing_mode="stretch_width", ), pn.layout.HSpacer(height=2), height=60, sizing_mode="stretch_width", background=background, ) model_viewer = ModelViewer(height=500, width=650) settings_bar = pn.Param( model_viewer, parameters=["src", "height", "width", "exposure", "auto_rotate", "camera_controls"], width=200, sizing_mode="stretch_height", background=background, ) template.main[:] = [ APPLICATION.intro_section(), pn.Column( pn.pane.Alert("Downloading the model the first time might take a while!"), top_app_bar, pn.Row(model_viewer, pn.layout.HSpacer(), settings_bar, background=BLUE), model_viewer.css_pane, model_viewer.js_pane, ), ] return template
def view(): """Run this to run the application""" set_environ() image_classifier_app = ImageClassifierApp() pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), pn.Column( pnx.SubHeader("Classifier"), pn.Param( image_classifier_app.param["model"], widgets={ "model": { "type": pn.widgets.RadioButtonGroup, "button_type": "primary", } }, ), pnx.SubHeader("Image"), pn.Param( image_classifier_app.param["image_file"], widgets={ "image_file": { "type": pn.widgets.FileInput, "accept": ".jpg", "css_classes": ["pnx-fileinput-area"], "height": 100, } }, ), image_classifier_app.predictions_view, pnx.SubHeader("Image"), image_classifier_app.image_view, ), image_classifier_app.resources_view, ] return site.create_template( title="Image Classifier", main=main, )
def view() -> pn.Column: """Wraps all tests in a Column that can be included in the Gallery or served independently Returns: pn.Column -- A Column containing all the tests """ pn.config.sizing_mode = "stretch_width" main = [ APPLICATION.intro_section(), test_view_value_and_message, test_view_message_only, test_view_value_only, test_view_none, test_bar_color, test_report_as_context_manager, test_report_as_decorator, test_increment_as_context_manager, test_increment_as_decorator, ] return site.create_template(title="Test Progress Extension", main=main, main_max_width="800px")
def view(): """Returns a view of the app Used by the awesome-panel.org gallery""" pn.config.sizing_mode = "stretch_width" style = pn.pane.HTML(STYLE, width=0, height=0, sizing_mode="fixed", margin=0) example_tabs = pn.Tabs(copy_to_clipboard()) info = APPLICATION.intro_section() main = [ info, pn.Column( style, example_tabs, ), ] return site.create_template(title="JS Actions", main=main)
def view(self) -> pn.Column: """Returns the view of the application Returns: pn.Column: The view of the app """ pn.config.sizing_mode = "stretch_width" pn.extension("echart") top_app_bar = pn.Row( pn.pane.PNG( "https://echarts.apache.org/en/images/logo.png", sizing_mode="fixed", height=40, margin=(15, 0, 5, 25), embed=False, ), pn.layout.VSpacer(), "", background="rgb(41, 60, 85)", height=70, ) settings_pane = pn.Param( self, show_name=False, width=200, sizing_mode="fixed", background="rgb(245, 247, 250)", ) main = [ APPLICATION.intro_section(), pn.Column( top_app_bar, pn.layout.HSpacer(height=50), pn.Row(self.plot, settings_pane, sizing_mode="stretch_width"), ), ] return site.create_template(title="Test ECharts", theme="default", main=main)
def view(self, ) -> pn.viewable.Viewable: """The main view of the app Returns: pn.viewable.Viewable: Serve this via .servable() """ pn.config.sizing_mode = "stretch_width" pages_list = [( key, value.view(), ) for key, value in self.pages.items()] main = [ APPLICATION.intro_section(), YahooQueryView( self.param.symbols, pages_list, sizing_mode="stretch_width", ), ] return site.create_template(title="Yahoo Query App", main=main)
def view(self, ): """A Reactive View of the KickstarterDashboard""" pn.config.sizing_mode = "stretch_width" template = site.create_template(title="Kickstarter Dashboard") template.sidebar[:] = [ pn.pane.HTML("<h2>Settings</h2>"), pn.Param( self.param.categories, widgets={"categories": { "size": len(self.categories), }}, ), ] template.main[:] = [ APPLICATION.intro_section(), pn.Row( pn.Column(self.scatter_plot_view, self.bar_chart_view, sizing_mode="stretch_width"), ), ] return template
def view(): """Returns the app in a nice template for use at awesome-panel.org""" pn.config.sizing_mode = "stretch_width" template = site.create_template(main_max_width="1024px", ) select_continent = pn.widgets.Select(name="Continent", options=CONTINENTS, value=CONTINENTS[0]) select_city = pn.widgets.Select(name="City", options=CITIES[select_continent.value], value=CITIES[select_continent.value][0]) select_city_auto = pn.widgets.AutocompleteInput(name="City", options=CITIES_LIST, value=select_city.value) @pn.depends(select_continent.param.value, watch=True) def _update_cities(continent): cities = CITIES[continent] select_city.options = cities select_city.value = cities[0] @pn.depends(select_city_auto.param.value, watch=True) def _update_from_auto_complete(city): select_continent.value = CONTINENTS_LOOKUP[city] select_city.value = city @pn.depends(select_city.param.value, watch=True) def _update_auto_complete(city): select_city_auto.value = city plot_panel = pn.pane.HoloViews(sizing_mode="stretch_width") accent_base_color = template.theme.style.accent_base_color @pn.depends(select_city.param.value, watch=True) def _update_plot(*_): city = select_city.value data = np.random.rand(100) plot_panel.object = hv.Curve(data).opts(title=city, color=accent_base_color, responsive=True, height=400) _update_plot() main = [ APPLICATION.intro_section(), pn.Column( pn.Tabs( pn.Row(select_continent, select_city, name="By Continent", margin=(25, 5, 10, 5)), pn.Row(select_city_auto, name="By City and Autocomplete", margin=(10, 5, 25, 5)), ), plot_panel, ), ] template.main[:] = main return template
def _get_view(self, config): pn.config.sizing_mode = "stretch_width" style = pn.pane.HTML(STYLE, width=0, height=0, margin=0, sizing_mode="fixed") description = APPLICATION.intro_section() app_bar = pn.Row( pn.pane.PNG( LOGO_URL, embed=False, height=50, width=62, sizing_mode="fixed", margin=(10, 0, 10, 25), ), pn.pane.Markdown( "# Pandas Profiling Report", sizing_mode="stretch_width", margin=(0, 0, 0, 25), align="center", ), sizing_mode="stretch_width", margin=(25, 0, 0, 0), css_classes=["app-bar"], background=GREEN, ) widgets = { "csv_url": { "sizing_mode": "stretch_width", }, "update_report": { "align": "end", "width": 150, "sizing_mode": "fixed", "button_type": "primary", }, "random_report": { "button_type": "default", "align": "end", "width": 150, "sizing_mode": "fixed", "css_classes": ["id-random-report-button"], }, } top_selections = pn.Param( self, parameters=["csv_url", "update_report", "random_report"], widgets=widgets, default_layout=pn.Row, show_name=False, sizing_mode="stretch_width", ) html_report_pane = pn.pane.HTML(EMPTY_HTML_REPORT, height=900, sizing_mode="stretch_both") report_tab = pn.Column( top_selections, html_report_pane, sizing_mode="stretch_width", name="Report", ) config_tab = pn.Param(config, sizing_mode="stretch_width", name="Configuration", show_name=False) tabs = pn.Tabs( report_tab, config_tab, ) self._tabs = tabs main = [ pn.Column( style, description, ), pn.Column( app_bar, pn.layout.HSpacer(), tabs, # pn.layout.HSpacer(height=400), # Gives better scrolling ), ] _view = site.create_template( title="Pandas Profiling App", main=main, ) return html_report_pane, _view
def create_app(**params) -> pn.Column: """Returns app using PerspectiveViewer Returns: pn.Column: The app """ pn.config.sizing_mode = "stretch_width" template = site.create_template(title="Test Perspective") if "dark" in str(template.theme).lower(): background = DARK_BACKGROUND theme = "material-dark" else: background = "white" theme = "material" perspective_viewer = PerspectiveViewer( value=DATAFRAME, columns=COLUMNS, theme=theme, sizing_mode="stretch_both" ) top_app_bar = pn.Row( pn.pane.PNG(PERSPECTIVE_LOGO, height=50, margin=(10, 25, 10, 10)), # pn.pane.PNG(PANEL_LOGO, height=40, margin=(10, 0, 10, 0)), pn.layout.HSpacer(), margin=0, background=DARK_BACKGROUND, ) settings_parameters = [ "theme", "row_pivots", "plugin", "columns", "aggregates", "filters", "sort", "rows", "column_pivots", ] settings_pane = pn.Param( perspective_viewer, parameters=settings_parameters, width=200, sizing_mode="stretch_height", ) template.main[:] = [ APPLICATION.intro_section(), pn.Column( top_app_bar, pn.Row( perspective_viewer, pn.layout.VSpacer(width=10), settings_pane, sizing_mode="stretch_both", background=background, margin=0, ), ), pn.pane.Alert(INFO, margin=0), pn.Column( "For more inspiration checkout", pn.pane.HTML(VIDEO), ), ] return template
def view() -> pn.viewable.Viewable: """A View of an Athlete and his Power Curve Returns: pn.viewable.Viewable: The main Viewable of the app. """ pn.config.sizing_mode = "stretch_width" template = site.create_template(title="Param Reference Example") athlete = Athlete() athlete_view = pn.Param( athlete, widgets={ "birthday": pn.widgets.DatePicker, "weight": { "type": pn.widgets.LiteralInput, "width": 100, }, }, parameters=[ "name_", "birthday", "weight", ], show_name=False, default_layout=pn.Row, width=600, ) power_curve_two_columns_view = pn.Param( athlete.power_curve, default_layout=GridBoxWithTwoColumns, show_name=False, widgets={ "ten_sec_date": pn.widgets.DatePicker, "one_min_date": pn.widgets.DatePicker, "ten_min_date": pn.widgets.DatePicker, "twenty_min_date": pn.widgets.DatePicker, "one_hour_date": pn.widgets.DatePicker, }, ) power_curve_with_plot_view = pn.Row( power_curve_two_columns_view, pn.layout.VSpacer(width=25), athlete.power_curve.plot, pn.layout.VSpacer(width=10), ) template.main[:] = [ APPLICATION.intro_section(), pn.Column( pn.Column( pn.pane.Markdown("### Athlete"), athlete_view, pn.pane.Markdown("#### Power Curve"), power_curve_with_plot_view, margin=20, ), css_classes=["app"], ), ] return template
def view(): """The resources view of awesome-panel.org""" main = [Markdown(RESOURCES, sizing_mode="stretch_width")] template = site.create_template(main=main) return template
def view(): """The about view of awesome-panel.org""" main = [Markdown(ABOUT, sizing_mode="stretch_width")] template = site.create_template(title="About", main=main) return template
def view(): """The home view of awesome-panel.org""" pn.config.sizing_mode = "stretch_width" template = site.create_template(main=SECTIONS, main_max_width="900px") return template
def view(): """Returns an instance of the Streaming Plots app""" pn.config.sizing_mode = "stretch_width" echart_pane = pn.pane.ECharts(theme="dark", sizing_mode="stretch_both") plotly_pane = pn.pane.Plotly(sizing_mode="stretch_width", height=371, config={"responsive": True}) hvplot_pane = pn.pane.HoloViews(sizing_mode="stretch_both") altair_pane = pn.pane.Vega(sizing_mode="stretch_both") df_stream = sDataFrame( example=pd.DataFrame({"y": []}, index=pd.DatetimeIndex([]))) df_window_stream = df_stream.cumsum().stream.sliding_window(50).map( pd.concat) def update_echarts(data): echart_pane.object = _create_echarts(data) def update_plotly(data): plotly_pane.object = _create_plotly(data) def update_altair(data): altair_pane.object = _create_altair(data) def update_hvplot(data): hvplot_pane.object = _create_hvplot(data) df_window_stream.sink(update_echarts) df_window_stream.sink(update_plotly) df_window_stream.sink(update_altair) df_window_stream.sink(update_hvplot) def emit(): df_stream.emit( pd.DataFrame({"y": [np.random.randn()]}, index=pd.DatetimeIndex([datetime.utcnow()]))) emit() pn.state.add_periodic_callback(emit, period=250, count=240) # Will stream for 1 mins layout = site.create_template( template="fastgrid", theme="dark", main_max_width="", row_height=110, ) site_intro = APPLICATION.intro_section() layout.main[0:3, 0:12] = site_intro layout.main[3:7, 0:6] = pn.Column(pn.pane.Markdown("## BOKEH via HOLOVIEWS"), hvplot_pane, sizing_mode="stretch_both") layout.main[3:7, 6:12] = pn.Column(pn.pane.Markdown("## VEGA via ALTAIR"), altair_pane, sizing_mode="stretch_both") layout.main[7:11, 0:6] = pn.Column(pn.pane.Markdown("## PLOTLY"), plotly_pane, sizing_mode="stretch_both") layout.main[7:11, 6:12] = pn.Column(pn.pane.Markdown("## ECHART"), echart_pane, sizing_mode="stretch_both") return layout