Question

我目前正在开发第一个网络应用程序。我最近开始关注python和一些模块的教程。我所能提出的大部分问题都是通过查找来解决的，除了这个问题。我无法弄明白。

目标如下： - 我正在尝试显示带有线图的图表，该图表通过用户输入动态更新。用户可以从多值下拉列表中选择多个项目。

如果我添加多个'go.Scatters'，我可以在图表中添加多行，除非图中的跟踪是静态的。因此，我尝试在go.Scatter中编写一个for循环，为data_name中的每个项添加更多go.Scatters。每次我尝试我都有语法错误。我试图在dcc.Graph中为数据列表添加值。每次我都失败了。

我的问题如下： - 在哪里可以添加for循环以向数据列表添加跟踪？ - 如何构建for循环？

我只是一个初学者，所以欢迎任何建议： - ）

提前致谢。

如果我对这个问题不够清楚，请告诉我。

我的代码如下：

import dash
import dash_core_components as dcc
import dash_html_components as html
from pandas_datareader.data import DataReader
import time
from collections import deque
import plotly.graph_objs as go
import random

app = dash.Dash('vehicle-data')

max_length = 50
#times = deque(maxlen=max_length)
times = [1,2,3,4,5,6,7,8,9,10,11,12]
oil_temps = [11,12,13,14,15,16,17,18,19]
intake_temps = [11,12,13,14,15,16,17,18,19]
coolant_temps = [11,12,13,14,15,16,17,18,19]
#rpms = deque(maxlen=max_length)
#speeds = deque(maxlen=max_length)
#throttle_pos = deque(maxlen=max_length)

data_dict = {"NH Utrecht":oil_temps,
"NH Amsterdam": intake_temps,
"NH Schiller": coolant_temps
#"NH Sparrenhorst":rpms,
#"Amsterdam":speeds,
#"Overig":throttle_pos
}

app.layout = html.Div([
    html.Div([
        html.H2('Hotel',
                style={'float': 'left',
                       }),

        ]),
    dcc.Dropdown(id='vehicle-data-name',
                 options=[{'label': s, 'value': s}
                          for s in data_dict.keys()],
                 value=['NH Utrecht'],
                 multi=True
                 ),
    html.Div(children=html.Div(id='graphs'), className='row'),
    dcc.Interval(
        id='graph-update',
        interval=100),
    ], className="container",style={'width':'98%','margin-left':10,'margin-right':10,'max-width':50000})



@app.callback(
    dash.dependencies.Output('graphs','children'),
    [dash.dependencies.Input('vehicle-data-name', 'value')],
    events=[dash.dependencies.Event('graph-update', 'interval')]
    )

def update_graph(data_names):
    graphs = []

    #update_obd_values(times, oil_temps, intake_temps, coolant_temps, rpms, speeds, throttle_pos)
    if len(data_names)>2:
        class_choice = 'col s12 m6 l4'
    elif len(data_names) == 2:
        class_choice = 'col s12 m6 l6'
    else:
        class_choice = 'col s12'

    html.Div(children=
    graphs.append(dcc.Graph(
        figure=go.Figure(
        data = [

        go.Scatter(
                x=times,
                y=[16, 13, 10, 11, 28, 37, 43, 55, 56, 88, 105, 156],
                name='Hotel Okura',
                marker=go.Marker(
                    color='rgb(55, 83, 109)'
                ),
                type='scatter',
                connectgaps=True
            ),



        ],

        layout=go.Layout(
            title='Hotel comparison data',
            showlegend=True,
            legend=go.Legend(
                x=1.0,
                y=1.0
            ),
            margin=go.Margin(l=40, r=0, t=40, b=30)
        ),


    ),


    style={'height': 300},
    id='my-graph'
 )
        ))

    return graphs




external_css = ["https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css"]
for css in external_css:
    app.css.append_css({"external_url": css})

external_js = ['https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js']
for js in external_css:
    app.scripts.append_script({'external_url': js})


if __name__ == '__main__':
    app.run_server(debug=True)

我使用的for循环如下（显然不起作用，因为我尝试添加图形而不是数据时间。但data.append不起作用）：

for data_name in data_names:
            graph.append(go.Scatter(
                x=[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
               name='Voorbeeld',
                marker=go.Marker(
                    color='rgb(255, 153, 0)'

                                ),
                type='scatter'

            ))

使用下拉输入动态地将跟踪添加到图形

0 个答案: