Введение в Dash в Python
Dash, успешный фреймворк Python, стал популярным вариантом для создания интерфейсов для визуализации данных. Он идеально подходит для создания аналитических веб-приложений на чистом Python с высокоинтерактивным пользовательским интерфейсом. В этой статье представлено подробное введение в Dash, а также полезные примеры, которые помогут вам приступить к работе.
Что такое Даша?
Dash — это платформа Python, созданная Plotly, которая позволяет создавать аналитические онлайн-приложения без необходимости разбираться в JavaScript, CSS или HTML. Приложения Dash состоят из двух основных компонентов: макета, определяющего, как приложение будет выглядеть, и взаимодействия, определяющего, как приложение будет функционировать.
Начало работы с Дашем
Pip, установщик пакетов для Python, можно использовать для установки Dash —
pip install dash
Вы можете импортировать пакет Dash в свой скрипт Python после его установки −
import dash
import dash_core_components as dcc
import dash_html_components as html
Создание приложения Dash
Давайте теперь посмотрим, как создать приложение Dash.
Пример 1. Базовое приложение Dash
Код очень простого приложения Dash представлен здесь −
import dash
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash(__name__)
app.layout = html.Div(children=[
html.H1(children='Hello, Dash!'),
html.Div(children='''
Dash: A web application framework for Python.
'''),
dcc.Graph(
id='example-graph',
figure={
'data': [
{'x': [1, 2, 3], 'y': [4, 1, 2], 'type': 'bar', 'name': 'SF'},
{'x': [1, 2, 3], 'y': [2, 4, 5], 'type': 'bar', 'name': 'Montreal'},
],
'layout': {
'title': 'Dash Data Visualization'
}
}
)
])
if __name__ == '__main__':
app.run_server(debug=True)
В программе отображаются заголовок, текст и простая гистограмма.
Пример 2. Использование обратных вызовов Dash для интерактивности
Dash делает приложения интерактивными, используя обратные вызовы. Обратные вызовы связывают различные части, так что при изменении входных данных изменяется и выходной. Вот иллюстрация −
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash(__name__)
app.layout = html.Div([
dcc.Input(id='my-input', value='initial value', type='text'),
html.Div(id='my-output')
])
@app.callback(
Output(component_id='my-output', component_property='children'),
[Input(component_id='my-input', component_property='value')]
)
def update_output_div(input_value):
return 'You've entered "{}"'.format(input_value)
if __name__ == '__main__':
app.run_server(debug=True)
На этом рисунке, если компонент «мой-вход» изменяется, обратный вызов обновляет компонент «мой-выход».
Пример 3: Несколько входов и выходов
Обратные вызовы с несколькими входами и выходами поддерживаются Dash −
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash(__name__)
app.layout = html.Div([
dcc.Input(id='input-1', type='text'),
dcc.Input(id='input-2', type='text'),
html.Div(id='output')
])
@app.callback(
Output(component_id='output', component_property='children'),
[Input(component_id='input-1', component_property='value'),
Input(component_id='input-2', component_property='value')]
)
def update_output_div(input1, input2):
return 'You've entered "{}" and "{}"'.format(input1, input2)
if __name__ == '__main__':
app.run_server(debug=True)
На этой иллюстрации два компонента ввода подключены к функции обратного вызова update_output_div. Выходной компонент обновляется, чтобы отразить любые изменения входных значений.
Пример 4. Использование компонентов Dash Core
Компоненты более высокого уровня, такие как раскрывающиеся списки, графики, блоки уценки и многое другое, доступны через библиотеки компонентов, предлагаемые Dash, включая Dash_core_comComponents и Dash_html_comComponents. Вот иллюстрация того, как использовать раскрывающийся компонент −
import dash
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash(__name__)
app.layout = html.Div([
dcc.Dropdown(
id='dropdown',
options=[
{'label': 'Option 1', 'value': '1'},
{'label': 'Option 2', 'value': '2'},
{'label': 'Option 3', 'value': '3'}
],
value='1'
),
html.Div(id='display-selected-values')
])
@app.callback(
dash.dependencies.Output('display-selected-values', 'children'),
[dash.dependencies.Input('dropdown', 'value')])
def set_display_children(selected_value):
return 'You've selected "{}"'.format(selected_value)
if __name__ == '__main__':
app.run_server(debug=True)
На этом рисунке выходные данные обновляются с помощью функции обратного вызова, чтобы отобразить выбранный элемент из раскрывающегося меню.
Заключение
Эффективный набор инструментов для создания веб-приложений для визуализации данных предоставляется платформой Python Dash. Его универсальность, которая позволяет пользователям создавать сложные и интерактивные информационные панели, используя только код Python, делает его очень востребованным инструментом в области науки о данных.
Эта статья послужила введением в Dash и его функции, в том числе о том, как его установить и использовать при программировании на Python. Кроме того, мы рассмотрели четыре примера, каждый из которых показывал, как разработать приложение Dash по-своему, в том числе как спроектировать простую программу, добавить взаимодействие с обратными вызовами, использовать несколько входов и выходов, а также использовать основные компоненты Dash.
Однако представленные здесь образцы лишь намекают на весь потенциал Dash. Чтобы лучше понять потенциал Dash, мы рекомендуем вам больше исследовать и экспериментировать с различными компонентами и структурами обратных вызовов. Для сложных приложений его официальная документация является отличным ресурсом, предлагающим множество информации.