def plotly_view(*args, **kwargs) -> pn.Column:
"""## Dashboard Orders Chart View based on Plotly"""
fig = plotly_chart()
return pn.Column(
pnx.Header("Plotly"),
pn.Row(pn.layout.HSpacer(), pn.pane.Plotly(fig), pn.layout.HSpacer(),),
pnx.InfoAlert("Plotly cannot currently auto size to full width and be responsive"),
pnx.Code(code=inspect.getsource(plotly_chart)),
sizing_mode="stretch_width",
name="Plotly",
*args,
**kwargs,
)
def image_view(self, ):
"""A view of the image_file"""
if self.image_file:
bytes_io = io.BytesIO(self.image_file)
return pn.pane.HTML(
('<img application="data:image/jpg;base64,{0}" '
'style="height:400px;min-width:600px;"/>').format(
b64encode(bytes_io.getvalue()).decode("utf-8")))
return pnx.InfoAlert(
"Upload an image in .jpg format",
height=400,
min_width=600,
)
def test_info_alert():
"""
We can show an InfoAlert
- Blue Div with normal and bold text
- Full width by default
- With a nice bottom margin
"""
return TestApp(
test_info_alert,
pnx.InfoAlert("This is an **Info Alert**!"),
sizing_mode="stretch_width",
)
def test_info_alert():
"""## test_info_alert
- Blue Div with normal and bold text
- Curently not full width
"""
pn.config.raw_css.append(pnx.InfoAlert.raw_css)
app = pn.Column(
pnx.Markdown(test_info_alert.__doc__),
pnx.InfoAlert("This is an **Info Alert**!"),
sizing_mode="stretch_width",
)
app.servable(test_info_alert.__name__)
def _data(self, ):
if self.all_endpoints:
data = YahooQueryService.get_data(
self.symbols,
"all_endpoints",
)
else:
if not self.endpoints:
return pnx.InfoAlert("Please select one or more Endpoints")
data = YahooQueryService.get_data(
self.symbols,
"get_endpoints",
)(self.endpoints)
return pnx_json(data)
def __init__(self):
about = pnx.Markdown(path=ABOUT_PATH)
image = pn.pane.PNG(str(IMAGE_PATH),
max_width=600,
sizing_mode="scale_both")
info = pnx.InfoAlert(
"""\
Navigate to the **Dashboard Page** via the **Sidebar** to see the result.
Or Navigate to the **Limitations Page** to learn of some of the limitations of Panel that
I've experienced.""", )
super().__init__(
about,
image,
info,
sizing_mode="stretch_width",
name="About",
)
def test_info_alert_height_problem():
"""## test_info_alert_height_problem
We saw that the height of InfoAlert Div was much greater than it needed to be.
See [Issue 829](https://github.com/holoviz/panel/issues/829)
"""
pn.config.raw_css.append(pnx.InfoAlert.raw_css)
text = """\
Navigate to the **Dashboard Page** via the **Sidebar** to see the result.
Or Navigate to the **Limitations Page** to learn of some of the limitations of Panel that
I've experienced."""
app = pn.Column(
pnx.Markdown(test_info_alert_height_problem.__doc__),
pnx.InfoAlert(text, sizing_mode="stretch_width"),
sizing_mode="stretch_width",
)
app.servable(test_info_alert.__name__)
def __init__(self, ):
about = pn.pane.Markdown(ABOUT)
image = pn.pane.PNG(
str(IMAGE_PATH),
max_width=600,
sizing_mode="scale_both",
)
info = pnx.InfoAlert(
"""\
Navigate to the **Dashboard Page** via the **Tab** to see the result. The other tabs are comments on
what alternative layouts and widgets I could have used.""", )
super().__init__(
about,
image,
info,
sizing_mode="stretch_both",
name="About",
)
def dataframe_view(*args, **kwargs) -> pn.Column:
"""## Dashboard Orders Table View"""
table = pn.widgets.DataFrame(services.get_table_data(), sizing_mode="stretch_width")
text = """I did not use the
[DataFrame widget](https://panel.pyviz.org/reference/widgets/DataFrame.html#gallery-dataframe)
in the dashboard because it would not look like the GetBootstrap example.
But I would always use this power full DataFrame widget in practice
because it's so powerfull and nice. It's based on [SlickGrid](https://slickgrid.net/).
"""
return pn.Column(
pnx.Header("DataFrame"),
pnx.InfoAlert(text),
pn.layout.VSpacer(height=20), # Hack
table,
sizing_mode="stretch_width",
name="DataFrame",
*args,
**kwargs,
)