Как удалить выпадающий список и сделать его stati c вместо этого, используя da sh plot - PullRequest
2 голосов
/ 15 января 2020

Я только что создал простую панель инструментов для простой базы данных в SQL на основе двух раскрывающихся списков и средства выбора даты.

Так что этот связанный график x-axis основан на дате, и это было константа, и y-axis основано на значении DropDownlist, так что это также не было константой, поскольку диаграмма основана также на другом drop-down с другим значением столбцов, поскольку это уникальное значение, на котором я хочу построить график это ....

Теперь мне нужно немного изменить последовательность в этом коде, так как я хочу показать график на основе Date-time-picker и только уникальное значение и удалить другой выпадающий список

Итак, это мой полный код

import dash
import dash_core_components as dcc
import dash_html_components as html
import pandas as pd
from sqlalchemy import create_engine
import datetime
from datetime import datetime as dt
from dash.dependencies import Input, Output
import plotly.graph_objs as go
import plotly.express as px
import hypothesis
import pytest

# 'LRRCConnReqAtt',

SHOW_COLUMNS1 = [
    'lrrc_re_est_succ',
    'cell_dl_max_throughput'
]


external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']

# connect db
engine = create_engine('mssql+pyodbc://xxxx\xxxx/myDB?driver=SQL+Server+Native+Client+11.0')
cursor = engine.raw_connection().cursor()



app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

lte_kpis = pd.read_sql('SELECT * FROM [myDB].[dbo].[lte_details]', engine)
pd.set_option('display.max_columns', 10000)
print(lte_kpis)
lte_kpis.set_index('date', inplace=True)

availble_cell = lte_kpis['cell_name'].unique()

app.layout = html.Div([
    html.H5(
        'Dashbord'),

    html.Label('Choose the "Cell-Name"'),
    dcc.Dropdown(
        id='cell-name-xaxis-column',
        options=[{'label': i, 'value': i} for i in availble_cell],
        value=availble_cell[0]
    ),
    html.Label('Choose Date Destination'),
    dcc.DatePickerRange(
        id='date-picker-range',
        min_date_allowed=dt(1995, 8, 5),
        max_date_allowed=dt(2030, 9, 19),
        initial_visible_month=dt(2019, 10, 5),
        start_date=dt(2019, 10, 1),
        end_date=dt(2020, 1, 1)
    ),
    html.Div(id='output-container-date-picker-range-%s'),
    dcc.Dropdown(
        id='yaxis-columns',
        options=[{'label': col, 'value': col} for col in SHOW_COLUMNS1],
        multi=True,
        disabled=True,
        value=[SHOW_COLUMNS1[0], SHOW_COLUMNS1[1]]
    ),
    dcc.Graph(
        style={'height': 300},
        id='my-graph'
    ),

])


@app.callback(
    Output(component_id='my-graph', component_property='figure'),
    [Input(component_id='cell-name-xaxis-column', component_property='value'),
     Input(component_id='yaxis-columns', component_property='value'),
     Input(component_id='date-picker-range', component_property='start_date'),
     Input(component_id='date-picker-range', component_property='end_date')])
def update_graph(cell_name, yaxis_cols, start_date, end_date):
    if not isinstance(yaxis_cols, list):
        yaxis_cols = [yaxis_cols]
    print(yaxis_cols)
    print((start_date, end_date))

    sql_statement = "SELECT date, %s, %s FROM [myDB].[dbo].[lte_details] WHERE ([cell_name]='%s' AND [date]>='%s' AND [date]<='%s')" \
                    % (SHOW_COLUMNS1[0], SHOW_COLUMNS1[1], cell_name, start_date, end_date)
    df = pd.read_sql(sql_statement, engine)

    scatters = []

    for col in yaxis_cols:
        if col == 'lrrc_conn_req_att':
            scatters.append(go.Bar(
                x=df['date'],
                y=df[col],
                mode='lines',
                name=col
            ))
        else:
            scatters.append(go.Scatter(
                x=df['date'],
                y=df[col],
                name=col
            ))

    figure = {
        'data': scatters,
    }

Итак, теперь я хочу удалить приведенный ниже core-component

    dcc.Dropdown(
        id='yaxis-columns',
        options=[{'label': col, 'value': col} for col in SHOW_COLUMNS1],
        multi=True,
        disabled=True,
        value=[SHOW_COLUMNS1[0], SHOW_COLUMNS1[1]]
    ),

и сделать график stati c на этих значения, относящиеся только к SQL query

SHOW_COLUMNS1 = [
    'lrrc_re_est_succ',
    'cell_dl_max_throughput'
]

Или я хочу скрыть это, я просто не использую и показываю этот переключатель ... Я пытался изменить его, но нашел ошибку

это GUI выглядит как

With Dropw Down

Я хочу б Это так, как показано на рисунке ниже

enter image description here

, так как это SQL Запрос должен быть

    sql_statement = "SELECT date, lrrc_re_est_succ, cell_dl_max_throughput FROM [myDB].[dbo].[lte_details] WHERE ([cell_name]='%s' AND [date]>='%s' AND [date]<='%s')" \
                    % (cell_name, start_date, end_date)

1 Ответ

0 голосов
/ 31 января 2020
  1. Как вы сказали, вам нужно удалить код, который создает компонент с идентификатором yaxis-columns.
  2. Исключить значение этого компонента из входов и внутренних элементов вашей функции обратного вызова. Я считаю, что это будет работать:

    @app.callback(
        Output(component_id='my-graph', component_property='figure'),
        [Input(component_id='cell-name-xaxis-column', component_property='value'),
         Input(component_id='date-picker-range', component_property='start_date'),
         Input(component_id='date-picker-range', component_property='end_date')])
    def update_graph(cell_name, start_date, end_date):
        sql_statement = "SELECT date, lrrc_re_est_succ, cell_dl_max_throughput FROM [myDB].[dbo].[lte_details] WHERE ([cell_name]='%s' AND [date]>='%s' AND [date]<='%s')" \
                    % (cell_name, start_date, end_date)  
        df = pd.read_sql(sql_statement, engine)
        scatters = []
        for item in ['lrrc_re_est_succ', 'cell_dl_max_throughput']:
            scatters.append(go.Bar(
                x=df['date'],
                y=df[item],
                mode='lines',
                name=item
            ))
    
        figure = {'data': scatters}
        return figure
    
...