#user-interface #flask #plotly #plotly-dash
#пользовательский интерфейс #flask #сюжет #plotly-dash
Вопрос:
При написании программы в Dash у меня возникали проблемы. При использовании компонента Upload я изо всех сил пытаюсь правильно использовать эти данные в других компонентах. Моя цель — использовать загруженные данные (файл CSV), чтобы добавить параметры к 2 идентичным компонентам выпадающего списка, которые являются именами столбцов импортированного файла. График должен быть сгенерирован с использованием выбранных значений в выпадающих списках впоследствии в качестве оси для графика.
Любая помощь будет оценена.
import base64
import datetime
import io
import dash
import dash_table
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
import plotly.express as px
import pandas as pd
external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
df = pd.DataFrame()
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
app.layout = html.Div([
html.Div(children='this is an attempt to do stuff right'),
dcc.Dropdown(id='Drop1'),
dcc.Dropdown(id='Drop2'),
dcc.Dropdown(id='graphtype', options=[
{'label': 'Bar', 'value': 'Bar'},
{'label': 'Scatter', 'value': 'Scatter'},
{'label': 'Histogram', 'value': 'Hist'}
]),
dcc.Upload(
id='upload-data',
children=html.Div([
'Drag and Drop or ',
html.A('Select Files')
]),
style={
'width': '100%',
'height': '60px',
'lineHeight': '60px',
'borderWidth': '1px',
'borderStyle': 'dashed',
'borderRadius': '5px',
'textAlign': 'center',
'margin': '10px'
},
# Allow multiple files to be uploaded
multiple=True
),
html.Div(id='output-data-upload'),
dcc.Graph(id='output-graph')
]
)
def parse_contents(contents, filename, date):
content_type, content_string = contents.split(',')
decoded = base64.b64decode(content_string)
try:
if 'csv' in filename:
# Assume that the user uploaded a CSV file
df = pd.read_csv(
io.StringIO(decoded.decode('utf-8')))
elif 'xls' in filename:
# Assume that the user uploaded an excel file
df = pd.read_excel(io.BytesIO(decoded))
except Exception as e:
print(e)
return html.Div([
'There was an error processing this file.'
])
return html.Div([
html.H5(filename),
html.H6(datetime.datetime.fromtimestamp(date)),
dash_table.DataTable(
data=df.to_dict('records'),
columns=[{'name': i, 'id': i} for i in df.columns]
),
html.Hr(), # horizontal line
# For debugging, display the raw contents provided by the web browser
html.Div('Raw Content'),
html.Pre(contents[0:200] '...', style={
'whiteSpace': 'pre-wrap',
'wordBreak': 'break-all'
})
])
@app.callback(Output('output-data-upload', 'children'),
[Input('upload-data', 'contents')],
[State('upload-data', 'filename'),
State('upload-data', 'last_modified')])
def update_output(list_of_contents, list_of_names, list_of_dates):
if list_of_contents is not None:
children = [
parse_contents(c, n, d) for c, n, d in
zip(list_of_contents, list_of_names, list_of_dates)]
print(children)
return children
if __name__ == '__main__':
app.run_server(debug=True)
Комментарии:
1. Можете ли вы поделиться имеющимся у вас кодом и что с ним не так?
2. @coralvanda Я опубликовал код, проблема в основном заключается в том, что я не знаю, возможно ли преобразовать загруженный файл во фрейм данных (с которым я мог бы нормально работать) или мне следует использовать результирующую таблицу для всех вычислений и сохранить ее как скрытый div.
3. О. Да, вы, безусловно, можете преобразовать его во фрейм данных и использовать это.
4. итак, я бы сохранил результирующую таблицу и превратил ее во фрейм данных, когда мне нужно использовать ее для других компонентов? Я все еще не уверен, как это сделать…
Ответ №1:
Это страница из документов, которая должна предоставить вам все, что вам нужно. Если вы загружаете файл CSV, вы можете использовать:
df = pd.read_csv(io.StringIO(decoded.decode('utf-8')))
и оттуда просто используйте его как обычный фрейм данных pandas.