PyCafe - Panel - Hello World App with Panel

app.py
app_database_test.py
requirements.txt
app_database_test.py
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
import os
import toml
import earthaccess
import xarray as xr
from datetime import datetime
from concurrent.futures import ThreadPoolExecutor
import hvplot.pandas
import numpy as np
import pandas as pd
import panel as pn
import holoviews as hv

# Lectura de datos

SM200 = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Humedad_Suelo/Humedad_FLDAS200_CRB_CLA_Completo.csv")
SM200_cuencas = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Humedad_Suelo/Humedad_FLDAS200_Cuencas_Completo.csv")
SM100 = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Humedad_Suelo/Humedad_FLDAS100_CRB_CLA_Completo.csv")
SM100_cuencas = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Humedad_Suelo/Humedad_FLDAS100_Cuencas_Completo.csv")

prec = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Precipitacion/Prec_FLDAS_CRB_CLA_Completo.csv")
prec_cuencas = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Precipitacion/Prec_FLDAS_Cuencas_Completo.csv")

temp = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Temperatura/Temp_FLDAS_CRB_CLA_Completo.csv")
temp_cuencas = ("C:/Users/luis_/Desktop/BASE_DE_DATOS/Series/Series_Productos/Series_Temperatura/Temp_FLDAS_Cuencas_Completo.csv")

# Fijamos la interfaz de Panel con configuraciones específicas, así como la distribución de los widgets según el ancho del dispositivo del usuario
pn.extension(design="material", sizing_mode="stretch_width")

@pn.cache
def get_data(serie):
  return pd.read_csv(serie, parse_dates=[0], index_col=[0])

data1 = get_data(SM200)
data2 = get_data(SM200_cuencas)
data3 = get_data(SM100)
data4 = get_data(SM100_cuencas)

prec1 = get_data(prec)
prec2 = get_data(prec_cuencas)

temp1 = get_data(temp)
temp2 = get_data(temp_cuencas)

# FLDAS200 CRB CLA
def get_plot(variable="Rio Bravo"):
    return data1[variable].hvplot(color='b', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_plot(variable='Rio Bravo')
cuenca_widget = pn.widgets.Select(name="Cuenca", value="Rio Bravo", options=list(data1.columns)) # Creamos el widget interactivo
bound_plot = pn.bind(get_plot, variable=cuenca_widget) # Creamos bound_plot para vincular el widget con el ploteo del gráfico
pn.Column(cuenca_widget, bound_plot); # Acomodamos el widget y el grafico de forma vertical (columna)

# FLDAS200 cuencas
def get_plot2(variable="1"): 
    return data2[variable].hvplot(color='b', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_plot2(variable='1')
cuenca_widget2 = pn.widgets.Select(name="Cuenca", value="1", options=list(data2.columns))
bound_plot2 = pn.bind(get_plot2, variable=cuenca_widget2)
pn.Column(cuenca_widget2, bound_plot2);

# FLDAS100 CRB CLA
def get_plot3(variable="Rio Bravo"):
    return data3[variable].hvplot(color='b', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_plot3(variable="Rio Bravo")
cuenca_widget3 = pn.widgets.Select(name="Cuenca", value="Rio Bravo", options=list(data3.columns))
bound_plot3 = pn.bind(get_plot3, variable=cuenca_widget3)
pn.Column(cuenca_widget3, bound_plot3);

# FLDAS100 cuencas
def get_plot4(variable="1"):  
    return data4[variable].hvplot(color='b', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_plot4(variable='1')
cuenca_widget4 = pn.widgets.Select(name="Cuenca", value="1", options=list(data4.columns))
bound_plot4 = pn.bind(get_plot4, variable=cuenca_widget4)
pn.Column(cuenca_widget4, bound_plot4);

# Prec CRB CLA
def get_prec(variable="Rio Bravo"):
    return prec1[variable].hvplot(color='g', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_prec(variable="Rio Bravo")
prec_widget = pn.widgets.Select(name="Cuenca", value="Rio Bravo", options=list(prec1.columns))
prec_plot = pn.bind(get_prec, variable=prec_widget)
pn.Column(prec_widget, prec_plot);

# Prec cuencas
def get_prec2(variable="1"):  
    return prec2[variable].hvplot(color='g', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_prec2(variable="1")
prec_widget2 = pn.widgets.Select(name="Cuenca", value="1", options=list(prec2.columns))
prec_plot2 = pn.bind(get_prec2, variable=prec_widget2)
pn.Column(prec_widget2, prec_plot2);

# Temp CRB CLA
def get_temp(variable="Rio Bravo"):   
    return temp1[variable].hvplot(color='r', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_temp(variable="Rio Bravo")
temp_widget = pn.widgets.Select(name="Cuenca", value="Rio Bravo", options=list(temp1.columns))
temp_plot = pn.bind(get_temp, variable=temp_widget)
pn.Column(temp_widget, temp_plot);

# Temp cuencas
def get_temp2(variable="1"):   
    return temp2[variable].hvplot(color='r', padding=0.1, legend=False, dynamic=True).opts(framewise=True)
get_temp2(variable="1")
temp_widget2 = pn.widgets.Select(name="Cuenca", value="1", options=list(temp2.columns))
temp_plot2 = pn.bind(get_temp2, variable=temp_widget2)
pn.Column(temp_widget2, temp_plot2);

pn.template.MaterialTemplate(
    title="Database Application Prototype",
    main=[
        pn.Tabs(
            ("Humedad del Suelo - FLDAS200",  # Primera pestaña
             pn.Column(
                 pn.pane.Markdown("### Cuenca del Río Bravo y La Amistad"), # Título
                 cuenca_widget, # Widget interactivo para cambiar de CRB a CLA
                 bound_plot, # Gráficos de la series de tiempo
                 pn.pane.Markdown("### Cuencas"), # Título del segundo grafico dentro de la misma tab
                 cuenca_widget2, # Widget interactivo para cambiar de cuenca
                 bound_plot2, #Gráficos de la series de tiempo
             )),
            ("Humedad del Suelo - FLDAS100", # Segunda pestaña
             pn.Column(
                 pn.pane.Markdown("### Cuenca del Río Bravo y La Amistad"),
                 cuenca_widget3,
                 bound_plot3,
                 pn.pane.Markdown("### Cuencas"),
                 cuenca_widget4,
                 bound_plot4,
             )),
            ("Precipitacion - FLDAS", # Tercer pestaña
             pn.Column(
                 pn.pane.Markdown("### Cuenca del Río Bravo y La Amistad"),
                 prec_widget,
                 prec_plot,
                 pn.pane.Markdown("### Cuencas"),
                 prec_widget2,
                 prec_plot2,
             )),
            ("Temperatura - FLDAS", # Cuarta pestaña
             pn.Column(
                 pn.pane.Markdown("### Cuenca del Río Bravo y La Amistad"),
                 temp_widget,
                 temp_plot,
                 pn.pane.Markdown("### Cuencas"),
                 temp_widget2,
                 temp_plot2,
             )),
        )
    ],
).servable();
Py.Cafe

panel-hello-world

Hello World App with Panel
