While we are waiting for the official Panel solution to convert Panel Apps to PyScript apps we can make them our selves like below.
<html>
<head>
<title>Panel Example</title>
<meta charset="iso-8859-1">
<link rel="icon" type="image/x-icon" href="./favicon.png">
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-2.4.2.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-2.4.2.min.js"></script>
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-2.4.2.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@holoviz/panel@0.13.1/dist/panel.min.js"></script>
<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>
<style>
body {
margin: 2em;
}
</style>
</head>
<py-env>
- pandas
- matplotlib
- seaborn
- panel==0.13.1
</py-env>
<body>
<h1>Visualizing CSVs with Pandas, Seaborn, Panel and PyScript</h1>
<div id="fileinput"></div>
<div id="op"></div>
<py-script>
import io
import pandas as pd
import panel as pn
import seaborn as sns
from matplotlib.figure import Figure
pn.config.sizing_mode="stretch_width"
fileInput = pn.widgets.FileInput(accept=".csv").servable(target="fileinput")
@pn.depends(fileInput)
def to_plot(file: bytes):
if file is None:
return "Please upload a `.csv` file with columns `arpi` and `total_installs`."
data = pd.read_csv(io.BytesIO(file))
x = data['arpi'] #change column name
y = data['total_installs'] #change column name
fig = Figure(figsize=(10, 6))
ax = fig.add_subplot(111)
sns.lineplot(x=x, y=y, data=data, ax=ax)
return fig
pn.Column(
to_plot
).servable(target="op")
None # For some reason an error is raised if I end with .servable()
</py-script>
</body>
</html>