Автор оригинала: Neeraj Sujan.
Визуализация данных является важным инструментом для A Данные ученые Отказ Строительство красивых приборных панелей – это важный навык для приобретения, если вы планируете показать свое представление о руководителях уровня C-уровня. В этом сообщении вы получите введение в рамки визуализации в Python Отказ Вы узнаете, как создать приборную панель от получения данных для создания интерактивных виджетов, использующих Dash – Рамки визуализации в Python.
Введение в черту
Фрамка Dash может быть разделена на два компонента
- Макеты : Макет – это элемент пользовательского интерфейса вашей приборной панели. Вы можете использовать такие компоненты, как кнопки, таблица, радиопередачи и определите их в своем макете.
- Обратные вызовы : Callbacks предоставляет функциональные возможности добавлять реактивность на вашу приборную панель. Работает с использованием функции декоратора для определения входных и выходных объектов.
В следующем разделе вы узнаете, как построить простую приборную панель для визуализации производительности марафона с 1991 по 2018 год.
Импорт библиотеки
Давайте сначала импортировать Все библиотеки импорта
import dash import dash_core_components as dcc import dash_html_components as html import dash_split_pane import plotly.express as px import pandas as pd from datetime import datetime
Мы импортируем библиотеку Pandas для загрузки данных и библиотеки Dash для создания приборной панели.
Библиотека сюжета Express построена на вершине Potty, чтобы обеспечить некоторые простой в использовании функциональные возможности для визуализации данных.
Сначала мы начнем с загрузки данных. Данные могут быть доступны к Kaggle, используя следующие ссылка на сайт
Шаг 1: Инициализация приложения Dash
Начнем с помощью приложения Dash и используя команду Run_Server запустить сервер.
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css'] app = dash.Dash(__name__, external_stylesheets=external_stylesheets) if __name__ == '__main__': app.run_server(debug=True)
Шаг 2: Создание макета
Мы начнем с разделить наш уровень пользовательского интерфейса на две части – левая панель покажет окно настроек, которое будет включать опцию для выбора года. Правая панель будет включать в себя графическое окно, отображающее гистограмму.
app.layout = html.Div(children=[
html.H1(children='World Marathon Analysis',
style={'textAlign': 'center'}),
dash_split_pane.DashSplitPane(
children=[
html.Div(children=[
html.H1(children='Settings', style={'textAlign': 'center'}),
], style={'margin-left': '50%', 'verticalAlign': 'middle'}),
html.Div(children=[
html.H1(children='Graph View', style={'textAlign': 'center'}),
])
],
id="splitter",
split="vertical",
size=1000,
)
])
Мы строим два Div Элементы – один для левой панели и другой для правой панели. Чтобы выровнять элементы заголовка в центр, мы используем Стиль Тег и использование стандартного синтаксиса CSS для определения элементов HTML.
Если вы сейчас начнете сервер и перейдите в свой браузер на localhost: 8050. , вы увидите следующее окно.
Шаг 3: Создание выпадающего виджета и графического окна
После того, как у нас будет базовая настройка макета, мы можем продолжить оставшиеся детали.
Загрузка данных
Мы начинаем с загрузки данных с использованием библиотеки Pandas
def convert_to_time(time_in_some_format):
time_obj = datetime.strptime(time_in_some_format, '%H:%M:%S').time()
return time_obj
def get_data():
df = pd.read_csv('world_marathon_majors.csv', engine="python")
df['time'] = df['time'].apply(convert_to_time)
return df
Мы создаем две функции для загрузки данных и преобразовывать значение времени на datetime Значения объектов.
В таблице ниже приведены первые пять рядов набора данных.
Каждая строка состоит из
- Год марафон состоялся
- Победитель марафона в этом году
- Пол победителя
- Страна победитель представляет
- Время закончить гонку
- Страна, в которой имел место марафон.
Расширение макета
Следующим шагом является расширение нашего слоя макета, добавив раскрывающийся виджет и графическое окно.
app.layout = html.Div(children=[
html.H1(children='World Marathon Analysis',
style={'textAlign': 'center'}),
dash_split_pane.DashSplitPane(
children=[
html.Div(children=[
html.H1(children='Settings', style={'textAlign': 'center'}),
dcc.Dropdown(id='dropdown-menu', options=[{'label':x, 'value': x} for x in range(df['year'].min(), df['year'].max()+1)],
value=df['year'].max(),
style={'width': '220px','font-size': '90%','height': '40px',}
)
], style={'margin-left': '50%', 'verticalAlign': 'middle'}),
html.Div(children=[
html.H1(children='Graph View', style={'textAlign': 'center'}),
dcc.Graph( id='input-graph',figure=get_default_data())
])
],
id="splitter",
split="vertical",
size=1000,
)
])
Мы даем раскрывающийся виджет уникальный идентификатор под названием DropDown-Menu И графическое окно дано ID Вход-график.
Обратные вызовы
Обратные вызовы используются для включения связи между двумя виджетами.
Мы определяем функцию под названием update_output_div, которая требует значение года, когда выпадающий мент изменен. На каждом изменении раскрывающегося значения функция update_output_div выполняется и бар Сюжет Рисуется, чтобы указать лучшие страны, которые выиграли гонку.
@app.callback(
dash.dependencies.Output('input-graph', 'figure'),
[dash.dependencies.Input('dropdown-menu', 'value')]
)
def update_output_div(value):
test_sample = df[df['year'] == value]
test_sample = test_sample.groupby('country')['time'].min().reset_index()
tt = test_sample.sort_values(by=['time'])
fig = px.bar(tt, y='country', x='time', orientation='h', hover_data=["time"], )
return fig
Живая демонстрация
Давайте теперь увидим приборную панель в действии.
В этом блоге вы узнали, как построить простую приборную панель в Python. Вы можете расширить приборную панель, чтобы включить больше виджетов и отображать больше графиков для дальнейшего анализа.