Deployment
Flask
Machine Learning
Libraries
Creando Todo El Pipeline De Machine Learning Con PyCaret y Python
Este tutorial cubre todo el proceso de Machine Learning, desde la ingestión de datos, el preprocesamiento, el entrenamiento del modelo, el ajuste de hiperparámetros, la predicción y el almacenamiento del modelo para su uso posterior.Completaremos todos estos pasos en menos de 10 comandos de construcción natural y muy intuitivos de recordar, como por ejemplo:create_model(),
tune_model(),
compare_models()
plot_model()
evaluate_model()
predict_model()
Flask
Data Science
Machine Learning
Crea Una Aplicación De Machine Learning Con React y Flask
Photo by Alvaro Reyes on UnsplashSiempre he querido desarrollar una aplicación completa de aprendizaje automático en la que tuviera una interfaz de usuario para incorporar algunas variables de entrada y un modelo de aprendizaje automático para predecir esos valores. La semana pasada, hice justo eso. En el proceso, creé una plantilla fácil de usar en React y Flask, que cualquiera puede modificar para crear su propia aplicación en cuestión de minutos.Lo más destacado del proyecto: 1. El front-end se desarrolla en React y comprendería una sola página con un formulario para presentar los valores de entrada 2. El back-end se desarrolla en Flask que expone los puntos finales de la predicción para predecir usando un clasificador entrenado y enviar el resultado de vuelta al front-end para su fácil consultaEl repo de GitHub está abajo. Forquea el proyecto y crea tu propia aplicación hoy!https://github.com/kb22/ML-React-App-TemplateLea También: Mejorar Tu Modelo De Machine Learning Probando Diferentes EnfoquesPlantilla React React es una biblioteca de JavaScript creada por Facebook para ayudar a que el trabajo con las interfaces de usuario sea simple y fácil de desarrollar y utilizar. Es uno de los principales lenguajes para el desarrollo de interfaces. Puede leer sobre ello aquí. El mejor recurso para aprender sobre React es su propia documentación, que es muy completa y fácil de comprender.Flask y Flask-RESTPlus Flask y Flask-RESTPlus nos permiten definir un servicio en Python que tendrá puntos finales que podemos llamar desde la UI. Puedes aprender más sobre el desarrollo de una aplicación Flask en mi artículo más abajo.Descripción Usé create-react-app para crear una aplicación básica de React para empezar. Luego, cargué el bootstrap que nos permite crear sitios web receptivos para cada tamaño de pantalla. Actualizé el archivo App.js para añadir un formulario con desplegables y botones de Predicción y Reinicio de Predicción. Añadí cada propiedad del formulario al estado y al pulsar el botón de Predicción, envío los datos al backend de Flask. También he actualizado el archivo App.css para añadir estilo a la página. Vista de la plantillaLa aplicación Flask tiene un punto final POST / predicción. Acepta los valores de entrada como un json, lo convierte en un array y vuelve a la UI. En la aplicación real, usaremos los mismos datos para hacer la predicción usando el clasificador almacenado en classifier.joblib y retorna la predicción.Predicción mostrada en la UIReiniciar la predicción eliminará la predicción de la UI.Le puede interesar leer también: Comprensión de la Matriz de Confusión y Cómo Implementarla en PythonIniciando la Plantilla Clona el repo a tu ordenador y ve dentro de él y abre dos terminales aquí. Preparando la interfaz de usuario En la primera terminal, entra en la carpeta ui usando cd ui. Asegúrate de que estás usando el nodo versión 10.4.1. Una vez dentro de la carpeta, ejecute el comando "yarn install" para instalar todas las dependencias. Para ejecutar la UI en el servidor, usaremos serve. Empezaremos instalando el serve globalmente, después de lo cual, construiremos nuestra aplicación y finalmente ejecutaremos la UI usando serve en el puerto 3000.npm install -g serve
npm run build
serve -s build -l 3000Ahora puedes ir al localhost:3000 para ver que la UI está en funcionamiento. Pero no interactuará con el servicio de Flask que aún no está funcionando. Así que, hagamos eso.UIPreparando el servicio En la segunda terminal, muévase dentro de la carpeta de service usando cd service. Empezamos creando un entorno virtual usando virtualenv y Python 3. Puedes leer sobre virtualenv aquí. Después de activar el entorno, instalaremos todas las dependencias necesarias usando pip. Finalmente, ejecutaremos la aplicación Flask.virtualenv -p Python3 .
source bin/activate
pip install -r requirements.txt
FLASK_APP=app.py flask runEsto iniciará el servicio en 127.0.0.1:5000.Service¡Voila! La aplicación completa ahora funcionará correctamente. ¡Yaay!Usando la plantilla para el caso de uso propioPara entender el proceso de usar la plantilla para cualquier modelo, usaré el conjunto de datos del iris y crearé un modelo para el mismo. Este ejemplo también está disponible en la carpeta de ejemplos del proyecto.Crear el modelo Entrené un Clasificador de Árbol de Decisión en el conjunto de datos del iris que requiere 4 características: Longitud del Sépalo, Ancho del Sépalo, Longitud del Pétalo y Ancho del Pétalo. Luego, guardé el modelo en classifier.joblib usando joblib.dump(). El clasificador puede ser usado ahora para predecir nuevos datos.Actualizar el servicio A continuación, abrí el archivo app.py en un editor de texto (Sublime Text es uno). Descompuse el clasificador de líneas = joblib.load('clasificador.joblib') para que el clasificador de variables contenga ahora el modelo entrenado. En el método post, hice las siguientes actualizaciones:prediction = classifier.predict(np.array(data).reshape(1, -1))
| types = { 0: "Iris Setosa", 1: "Iris Versicolour ", 2: "Iris Virginica"}
| response = jsonify({
| "statusCode": 200,
| "status": "Prediction made",
| "result": "The type of iris plant is: " + types[prediction[0]]
| })Primero, usé el clasificador.predict() para obtener la predicción. Luego, creé un mapa para las clases de tal manera que 0 significa Iris Setosa, 1 significa Iris Versicolour y 2 significa Iris Virginica. Finalmente devolví la predicción en la llave de "result".Actualización: Como señaló Martins Untals, olvidé mencionar que también necesitamos actualizar el modelo para que funcione correctamente y tenga el modelo actualizado en la interfaz de usuario de Swagger.model = app.model('Prediction params',
| {'sepalLength': fields.Float(required = True,
| description="Sepal Length",
| help="Sepal Length cannot be blank"),
| 'sepalWidth': fields.Float(required = True,
| description="Sepal Width",
| help="Sepal Width cannot be blank"),
| 'petalLength': fields.Float(required = True,
| description="Petal Length",
| help="Petal Length cannot be blank"),
| 'petalWidth': fields.Float(required = True,
| description="Petal Width",
| help="Petal Width cannot be blank")})Como se puede ver en la esencia, he actualizado los nombres de los campos, su tipo a Float, la descripción y el texto de ayuda. Lo mismo se reflejará ahora en el Swagger también.Modelo actualizado en la interfaz de usuario de SwaggerLea También: Construye Un Dashboard De Datos En La Web En Sólo Minutos Con PythonActualizar la interfaz de usuario La forma se compone de columnas dentro de filas. Así, como tengo 4 características, he añadido 2 columnas en 2 filas. La primera fila tendrá desplegables para la longitud y el ancho de los sépalos. La segunda fila tendrá desplegables para la longitud y el ancho del pétalo. Comencé creando una lista de opciones para cada uno de estos desplegables.var sepalLengths = []
| for (var i = 4; i <= 7; i = +(i + 0.1).toFixed(1)) {
| sepalLengths.push(<option key = {i} value = {i}>{i}</option>);
| }
| var sepalWidths = []
| for (var i = 2; i <= 4; i = +(i + 0.1).toFixed(1)) {
| sepalWidths.push(<option key = {i} value = {i}>{i}</option>);
| }
| var petalLengths = []
| for (var i = 1; i <= 6; i = +(i + 0.1).toFixed(1)){
| petalLengths.push(<option key = {i} value = {i}>{i}</option>);
| }
| var petalWidths = []
| for (var i = 0.1; i <= 3; i = +(i + 0.1).toFixed(1)) {
| petalWidths.push(<option key = {i} value = {i}>{i}</option>);
| }A continuación, definí dos filas con dos columnas cada una. Cada selección desplegable se verá como el código de abajo:<Form.Group as={Col}>
| <Form.Label>Petal Length</Form.Label>
| <Form.Control
| as="select"
| value={formData.petalLength}
| name="petalLength"
| onChange={this.handleChange}>
| {petalLengths}
| </Form.Control>
| </Form.Group>Para cada desplegable, tendremos que actualizar el texto dentro de <Form.Label></Form.Label>. Nombraremos cada grupo de selección también. Digamos que el nombre es petalLength, así que fijamos el valor como {formData.petalLength} y el nombre como "petalLength". Las opciones se añaden usando los nombres que definimos arriba dentro de <Form.Control></Form.Control> como podemos ver {petalLengths} arriba. Dos de estos grupos dentro de una <Form.Row></Form.Row> harán nuestra interfaz de usuario.El estado también debe ser actualizado con los mismos nombres dentro de formData con los valores por defecto como el valor más pequeño de los respectivos desplegables. El constructor se verá como abajo. Como puedes ver, el estado ha sido actualizado para tener formData con nuevas claves.constructor(props) {
| super(props);
|
| this.state = {
| isLoading: false,
| formData: {
| sepalLength: 4,
| sepalWidth: 2,
| petalLength: 1,
| petalWidth: 0
| },
| result: ""
| };
| }Añade una nueva imagen de fondo y un nuevo títuloDentro de app.css, cambia el enlace de la imagen de fondo a la tuya. Añadí una imagen de flores de Unsplash. También he actualizado el título a Iris Plant Classifier y el título de la página también dentro del archivo index.html en la carpeta pública.Le puede interesar leer: No Aprendas Machine LearningResultadoLa aplicación ya está lista para usar el modelo. Reinicie ambos servicios después de construir la UI usando npm run build. La aplicación tiene el aspecto que se muestra a continuación:Pagina PrincipalCon algunos valores de características, al pulsar el botón de predecir, el modelo lo clasifica como Iris Setosa.Con los nuevos valores de las características, el modelo predice que la planta es Iris Versicolor.ConclusiónComo pueden ver, en este artículo, he hablado de una plantilla de la aplicación ML React que hará que la creación de aplicaciones completas de ML sea simple y rápida.Pruebe la aplicación para su propio caso de uso y comparta sus comentarios. Me encantaría saber de ti.
Flask
Libraries
Deployment
Construye Un Dashboard De Datos En La Web En Sólo Minutos Con Python
Aumenta exponencialmente el poder y la accesibilidad convirtiendo tus visualizaciones de datos en un dashboard basado en la web con Plotly Dash."Frase de alguien" - Bejamin FranklinNo sé tú, pero yo a veces encuentro un poco intimidante tener que codificar algo. Esto es doblemente peor cuando estoy construyendo algo parecido al desarrollo web en lugar de hacer algún análisis de datos locales con visualización. Soy un programador de Python competente, pero no me llamaría a mí mismo un desarrollador web en absoluto, incluso después de haber más que chapoteado con Django y Flask.Puedes leer más artículos de Data Science en español aquí Aún así, convertir los datos de salida en una aplicación web conlleva algunas mejoras no triviales para tu proyecto.Es mucho más fácil incorporar una verdadera y poderosa interactividad en una aplicación web. También significa que puedes controlar exactamente cómo se presentan los datos, ya que la aplicación web puede convertirse en el informe de facto, así como en el punto de acceso a tus datos. Por último, y lo más importante, puedes escalar exponencialmente la accesibilidad a tus resultados; haciéndolos disponibles en cualquier lugar y en cualquier momento. Siempre hay un navegador web al alcance de la mano de un usuario.Build a web data dashboard — in just a few lines of Python codeAsí que, empecé a hacer esto con algunos de mis proyectos de ciencia de datos recientemente, con una velocidad y eficiencia sorprendentemente rápida. Convertí uno de mis resultados de este artículo en una aplicación web (que puedes encontrar aqui) en sólo un par de horas.My NBA analytics web app (link)Pensé que esto era bastante divertido, y quería compartir cómo esto se unió en sólo unas pocas líneas de código.Como siempre, incluyo todo lo que necesitas para replicar mis pasos (datos y código), y el artículo no es realmente sobre baloncesto. Así que no os preocupéis si no estáis familiarizados con él, y pongámonos en marcha.Antes de que empecemosDataIncluyo el código y los datos en mi repositorio GitLab aquí (directorio dash_simple_nba). Así que por favor, siéntete libre de jugar con él / mejorarlo.PaquetesAsumo que estás familiarizado con Python. Aunque seas relativamente nuevo, este tutorial no debería ser muy difícil.Necesitarás pandas, plotly y dash. Instala cada uno (en tu entorno virtual) con una simple instalación de pip [NOMBRE_PAQUETE].Anteriormente, en Python...Para este tutorial, simplemente voy a saltarme *la mayoría* de los pasos dados para crear la versión local de nuestra visualización. Si estáis interesados en lo que está pasando, echad un vistazo a este artículoTendremos una sesión de recapitulación, para que puedan ver lo que sucede entre el trazado del gráfico localmente con Plotly, y cómo portarlo a una aplicación web con Plotly Dash.Cargar datosHe preprocesado los datos y los he guardado como un archivo CSV. Es una colección de datos de los jugadores de la actual temporada de la NBA (a partir del 26/Feb/2020), que muestra:Qué parte de los tiros de su equipo están tomando, yCuán eficientes / eficaces son en hacerlo.Para esta parte, abra el local_plot.py de mi repositorio.Cargue los datos con:all_teams_df = pd.read_csv(‘srcdata/shot_dist_compiled_data_2019_20.csv’)Inspecciona los datos con all_teams_df.head(), y deberías ver:>>> all_teams_df.head()
player pl_acc pl_pps min_start min_mid min_end shots_count shots_made shots_freq shots_acc group
0 Jahlil Okafor 65.1 132.6 1 0.5 1 3 1 3.7 33.3 NOP
1 Jaxson Hayes 77.8 155.6 1 0.5 1 3 2 3.7 66.7 NOP
2 Nicolo Melli 36.4 88.6 1 0.5 1 1 1 1.2 100.0 NOP
3 Zion Williamson 54.3 111.4 1 0.5 1 2 1 2.5 50.0 NOP
4 Frank Jackson 44.7 105.3 1 0.5 1 0 0 0.0 0.0 NOPLos datos de cada jugador han sido compilados para cada minuto del juego (excluyendo las horas extras), siendo las estadísticas pl_acc y pl_pps la única excepción, ya que han sido compiladas por cuarto del juego (para cada período de 12 minutos).El marco de datos contiene todos los jugadores de la NBA, así que vamos a desglosarlo hasta un tamaño manejable, filtrando por equipo. Por ejemplo, los jugadores de los Pelícanos de Nueva Orleans pueden ser elegidos con:all_teams_df[all_teams_df.group == 'NOP']Entonces, nuestros datos pueden ser visualizados en Plotly, como sigue:import plotly.express as px
fig = px.scatter(all_teams_df[all_teams_df.group == 'NOP'], x='min_mid', y='player', size='shots_freq', color='pl_pps')
fig.show()Visualised player data for New Orlean PelicansA riesgo de hacer esto:How to Draw a Horse — Van Oktop (Tweet)Añadi algunos pequeños detalles a mi gráfico, para producir esta versión del mismo gráfico.Same chart, with a few ‘small details’ added (& different team).Este es el código que usé para hacerlo.Puedes leer más artículos de Data Science en español aquí Ahora, aunque es un montón de código de formato, pensé que era útil mostrarles cómo lo hice, porque vamos a reutilizar estas funciones en nuestra versión Dash del código.def clean_chart_format(fig):
import plotly.graph_objects as go
fig.update_layout(
paper_bgcolor="white",
plot_bgcolor="white",
annotations=[
go.layout.Annotation(
x=0.9,
y=1.02,
showarrow=False,
text="Twitter: @_jphwang",
xref="paper",
yref="paper",
textangle=0
),
],
font=dict(
family="Arial, Tahoma, Helvetica",
size=10,
color="#404040"
),
margin=dict(
t=20
)
)
fig.update_traces(marker=dict(line=dict(width=1, color='Navy')),
selector=dict(mode='markers'))
fig.update_coloraxes(
colorbar=dict(
thicknessmode="pixels", thickness=15,
outlinewidth=1,
outlinecolor='#909090',
lenmode="pixels", len=300,
yanchor="top",
y=1,
))
fig.update_yaxes(showgrid=True, gridwidth=1, tickson='boundaries', gridcolor='LightGray', fixedrange=True)
fig.update_xaxes(showgrid=True, gridwidth=1, gridcolor='LightGray', fixedrange=True)
return True
def make_shot_dist_chart(input_df, color_continuous_scale=None, size_col='shots_count', col_col='pl_acc', range_color=None):
max_bubble_size = 15
if color_continuous_scale is None:
color_continuous_scale = px.colors.diverging.RdYlBu_r
if range_color is None:
range_color = [min(input_df[col_col]), max(input_df[col_col])]
fig = px.scatter(
input_df, x='min_mid', y='player', size=size_col,
color=col_col,
color_continuous_scale=color_continuous_scale,
range_color=range_color,
range_x=[0, 49],
range_y=[-1, len(input_df.player.unique())],
hover_name='player', hover_data=['min_start', 'min_end', 'shots_count', 'shots_made', 'shots_freq', 'shots_acc', ],
render_mode='svg'
)
fig.update_coloraxes(colorbar=dict(title='Points per<BR>100 shots'))
fig.update_traces(marker=dict(sizeref=2. * 30 / (max_bubble_size ** 2)))
fig.update_yaxes(title="Player")
fig.update_xaxes(title='Minute', tickvals=list(range(0, 54, 6)))
return fig
fig = make_shot_dist_chart(
all_teams_df[all_teams_df.group == 'SAS'], col_col='pl_pps', range_color=[90, 120], size_col='shots_freq')
clean_chart_format(fig)
fig.update_layout(height=500, width=1250)
fig.show()Ahora, vayamos al evento principal: cómo crear una aplicación web a partir de estos graficos.En la World Wide WebPuedes leer más sobre Plotly Dash aquí, pero por ahora todo lo que necesitas saber es que es un paquete de software de código abierto desarrollado para abstraer las dificultades de poner tus visualizaciones en la web.Funciona con Flask under the hood, y puedes reutilizar felizmente la mayor parte del código que usaste para desarrollar los gráficos en plotly.py.Esta es la versión simple que he armado:import pandas as pd
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
all_teams_df = pd.read_csv('srcdata/shot_dist_compiled_data_2019_20.csv')
app = dash.Dash(__name__)
server = app.server
team_names = all_teams_df.group.unique()
team_names.sort()
app.layout = html.Div([
html.Div([dcc.Dropdown(id='group-select', options=[{'label': i, 'value': i} for i in team_names],
value='TOR', style={'width': '140px'})]),
dcc.Graph('shot-dist-graph', config={'displayModeBar': False})])
@app.callback(
Output('shot-dist-graph', 'figure'),
[Input('group-select', 'value')]
)
def update_graph(grpname):
import plotly.express as px
return px.scatter(all_teams_df[all_teams_df.group == grpname], x='min_mid', y='player', size='shots_freq', color='pl_pps')
if __name__ == '__main__':
app.run_server(debug=False)¡Pruébalo! Debería abrir este grafico en tu navegador.Our first Dash app!¿Cuál es el tema de todo esto? Bueno, para empezar, es una aplicación web en vivo, en menos de 25 líneas de código. ¿Y notan el menú desplegable en la parte superior izquierda? Intenta cambiar los valores en él, y mira el gráfico cambiar *mágicamente*.Puedes leer más artículos de Data Science en español aquí Adelante, esperaré.¿De acuerdo? Hecho.Repasemos brevemente el código.En un nivel alto, lo que estoy haciendo aquí es:Iniciar una aplicación Dash;Obtener una lista de nombres de equipos disponibles, y proporcionarla a un menú desplegable (con DOM id group-select) con un valor por defecto o 'TOR';Instanciar un objeto Graph como el identificador shot-dist-graph dentro de Dash; yCrear una función de devolución de llamada en la que, si se modifica alguno de los valores, llamará a la función update_graph y pasará el objeto devuelto a la salida.Si echas un vistazo al código, muchas de las cosas que probablemente son triviales para los desarrolladores web pero molestas para mí se abstraen.dcc.Graph envuelve el objeto figurativo de plotly.py en mi aplicación web y los componentes HTML como divs pueden ser llamados y configurados convenientemente con los objetos html.Div.Lo más gratificante para mí, personalmente, es que los objetos de entrada y las llamadas de esas entradas están configuradas de forma declarativa, y puedo evitar tener que lidiar con cosas como formularios HTML o JavaScript.Y la aplicación resultante sigue funcionando maravillosamente. El gráfico se actualiza en el momento en que el menú desplegable se utiliza para seleccionar otro valor.Y hemos hecho todo eso en menos de 25 líneas de código.¿Por qué Dash?En este punto, podrías estarte preguntando - ¿por qué Dash? Podemos hacer todo esto con un framework de JS, y Flask, o cualquier otra de las innumerables combinaciones.Para alguien como yo, que prefiere la comodidad de Python que tratar nativamente con HTML y CSS, el uso de Dash abstrae muchas cosas que no agregan mucho valor al producto final.Tomemos, por ejemplo, una versión de esta aplicación que incluye más formato y notas para la audiencia:(Es simple_dash_w_format.py en el git repo)def clean_chart_format(fig):
fig.update_layout(
paper_bgcolor="white",
plot_bgcolor="white",
annotations=[
go.layout.Annotation(
x=0.9,
y=1.02,
showarrow=False,
text="Twitter: @_jphwang",
xref="paper",
yref="paper",
textangle=0
),
],
font=dict(
family="Arial, Tahoma, Helvetica",
size=10,
color="#404040"
),
margin=dict(
t=20
)
)
fig.update_traces(marker=dict(line=dict(width=1, color='Navy')),
selector=dict(mode='markers'))
fig.update_coloraxes(
colorbar=dict(
thicknessmode="pixels", thickness=15,
outlinewidth=1,
outlinecolor='#909090',
lenmode="pixels", len=300,
yanchor="top",
y=1,
))
fig.update_yaxes(showgrid=True, gridwidth=1, tickson='boundaries', gridcolor='LightGray', fixedrange=True)
fig.update_xaxes(showgrid=True, gridwidth=1, gridcolor='LightGray', fixedrange=True)
return True
def make_shot_dist_chart(input_df, color_continuous_scale=None, size_col='shots_count', col_col='pl_acc', range_color=None):
max_bubble_size = 15
if color_continuous_scale is None:
color_continuous_scale = px.colors.diverging.RdYlBu_r
if range_color is None:
range_color = [min(input_df[col_col]), max(input_df[col_col])]
fig = px.scatter(
input_df, x='min_mid', y='player', size=size_col,
color=col_col,
color_continuous_scale=color_continuous_scale,
range_color=range_color,
range_x=[0, 49],
range_y=[-1, len(input_df.player.unique())],
hover_name='player', hover_data=['min_start', 'min_end', 'shots_count', 'shots_made', 'shots_freq', 'shots_acc', ],
render_mode='svg'
)
fig.update_coloraxes(colorbar=dict(title='Points per<BR>100 shots'))
fig.update_traces(marker=dict(sizeref=2. * 30 / (max_bubble_size ** 2)))
fig.update_yaxes(title="Player")
fig.update_xaxes(title='Minute', tickvals=list(range(0, 54, 6)))
return fig
app.title = 'Dash Demo - NBA'
team_names = all_teams_df.group.unique()
team_names.sort()
app.layout = html.Div([
html.Div([
dcc.Markdown(
"""
#### Shot Frequencies & Efficiencies (2019-20 NBA Season)
This page compares players based on shot *frequency* and *efficiency*,
divided up into minutes of regulation time for each team.
Use the pulldown to select a team, or select 'Leaders' to see leaders from each team.
*Notes*:
* **Frequency**: A team's shots a player is taking, indicated by **size**.
* **Efficiency**: Points scored per 100 shots, indicated by **colour** (red == better, blue == worse).
* Players with <1% of team shots are shown under 'Others'
"""
),
html.P([html.Small("See more data / NBA analytics content, find me on "), html.A(html.Small("twitter"), href="https://twitter.com/_jphwang", title="twitter"), html.Small("!")]),
]),
html.Div([
dcc.Dropdown(
id='group-select',
options=[{'label': i, 'value': i} for i in team_names],
value='TOR',
style={'width': '140px'}
)
]),
dcc.Graph(
'shot-dist-graph',
config={'displayModeBar': False}
)
])
@app.callback(
Output('shot-dist-graph', 'figure'),
[Input('group-select', 'value')]
)
def update_graph(grpname):
fig = make_shot_dist_chart(
all_teams_df[all_teams_df.group == grpname], col_col='pl_pps', range_color=[90, 120], size_col='shots_freq')
clean_chart_format(fig)
if len(grpname) > 3:
fig.update_layout(height=850, width=1250)
else:
fig.update_layout(height=500, width=1250)
return figPuedes leer más artículos de Data Science en español aquí La mayoría de los cambios son cosméticos, pero notará que aquí, sólo escribo el texto del cuerpo en Markdown, y simplemente llevo mis funciones de formato de Plotly para ser usadas en el formato de los gráficos en Dash.Esto me ahorra una tremenda cantidad de tiempo entre el análisis de datos y la visualización hasta el despliegue a las vistas de los clientes.Con todo, desde que empecé con mi gráfico inicial, creo que probablemente llevó menos de una hora desplegarlo en Heroku. Lo cual es bastante sorprendente.Me adentraré en las características más avanzadas de Dash, y en realidad haciendo algunas cosas geniales con él en cuanto a funcionalidad, pero estoy muy contento con este resultado en términos de facilidad y velocidad.Pruébalo tú mismo, creo que te impresionará. La próxima vez, pienso escribir sobre algunas cosas realmente geniales que puedes hacer con Dash, y construir dashboards verdaderamente interactivos.Si te gustó esto, di 👋 / follow en twitter, o sigueme para las actualizaciones. Este es el artículo en el que se basan los datos
