Skip to content

Instantly share code, notes, and snippets.

@amrrs
Created May 26, 2022 10:22
Show Gist options
  • Save amrrs/2f14c09f73fed4861ee87f12868789e3 to your computer and use it in GitHub Desktop.
Save amrrs/2f14c09f73fed4861ee87f12868789e3 to your computer and use it in GitHub Desktop.

Revisions

  1. amrrs created this gist May 26, 2022.
    75 changes: 75 additions & 0 deletions panelmatplotlib.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,75 @@
    <html>

    <head>

    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vega@5"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vega-lite@5"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vega-embed@6"></script>
    <script type="text/javascript" src="https://unpkg.com/[email protected]/dist/js/tabulator.js"></script>
    <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://unpkg.com/@holoviz/[email protected]/dist/panel.min.js"></script>
    <script type="text/javascript">
    Bokeh.set_log_level("info");
    </script>

    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    <py-env>
    - numpy
    - pandas
    - matplotlib
    - seaborn
    - panel==0.13.1a2
    </py-env>
    </head>

    <body>
    <h1>Upload csv</h1>



    <div id="fileinput"></div>
    <div id="upload"></div>
    <div id="op"></div>



    <py-script>
    import matplotlib.pyplot as plt
    import seaborn as sns
    import pandas as pd
    import asyncio
    import panel as pn
    from panel.io.pyodide import show

    fileInput = pn.widgets.FileInput(accept=".csv")
    uploadButton = pn.widgets.Button(name="Show Graph", button_type = 'primary')

    def process_file(event):
    if fileInput.value is not None:
    data = pd.read_csv(io.BytesIO(fileInput.value))
    x = data['arpi'] #change column name
    y = data['total_installs'] #change column name

    fig1, ax1 = plt.subplots(1)


    sns.lineplot(x=x, y=y, data=data)


    op = Element('op')

    op.write(fig1)

    await show(fileInput, 'fileinput')
    await show(uploadButton, 'upload')
    uploadButton.on_click(process_file)


    </py-script>
    </body>

    </html>