コード例 #1
0
def content():
    return html.Div([
        html.Div([
            daq.NumericInput(
                id='my-numeric-input',
                label='Battery max. voltage',
                value=0,
                style={'padding': '20px 0px 20px 0px'}
            ),
            html.Div(id='numeric-input-output'),
            html.Div([
                daq.BooleanSwitch(
                    id='my-daq-booleanswitch',
                    label='DCDC enabled',
                    on=True
                )],
                style={'padding': '20px 0px 20px 0px'}
            ),
            html.Div(id='output-boolean', style={'align':'center'}),
        ], className="six columns"),
        html.Div([
            daq.NumericInput(
                id='my-numeric-input',
                label='Battery max. current',
                value=0,
                style={'padding': '20px 0px 20px 0px'}
            ),
            html.Div(id='numeric-input-output'),
        ], className="six columns"),
    ], className="row")
コード例 #2
0
 def matrix_element(idx, value=0):
     # TODO: maybe move element out of the name
     mid = self.id(kwarg_label, is_kwarg=True, idx=idx)
     if not is_int:
         return dcc.Input(
             id=mid,
             inputMode="numeric",
             className="input",
             style={
                 "textAlign":
                 "center",
                 # shorter default width if matrix or vector
                 "width":
                 "2.5rem" if
                 (shape == (3, 3)) or (shape == (3, )) else "5rem",
                 "marginRight":
                 "0.2rem",
                 "marginBottom":
                 "0.2rem",
                 "height":
                 "1.5rem",
             },
             value=value,
             persistence=True,
             **kwargs,
         )
     else:
         return daq.NumericInput(id=mid, value=value, **kwargs)
コード例 #3
0
ファイル: dashboard.py プロジェクト: xaptum/acme-occupancy
    def __init__(self, monitor, room):
        super().__init__(className=['text-center', 'm-2'])

        self.monitor = monitor
        self.room = room

        self.title = html.H5(room.name, className='card-title')
        self.tank = daq.Tank(id='tank-%s' % (room.id, ),
                             style=RoomView.TANK_STYLE,
                             scale={'interval': 1},
                             min=0,
                             value=room.occupancy_cur,
                             max=self.room.occupancy_max)
        self.label = html.P(id='label-%s' % (room.id, ), children="0/0 people")
        self.input = daq.NumericInput(id='input-%s' % (room.id, ),
                                      min=1,
                                      value=room.occupancy_max,
                                      label='Max',
                                      labelPosition='top')

        self.update_color()
        self.update_label()

        self.children = [
            dbc.CardBody([self.title, self.tank, self.label, self.input])
        ]
コード例 #4
0
def create_settings(match_ids):
    team_dict = {}
    for match_id in match_ids:
        team_list = get_team_list(match_id)
        for team in team_list:
            if team[0] in team_dict:
                team_dict[team[0]] += ';' + team[1]
            else:
                team_dict[team[0]] = team[1]
    return html.Div(children=[
        html.Br(),
        html.H6("Select Team"),
        dcc.Dropdown(id="follow-team-select",
                     options=[{
                         "label": i,
                         "value": team_dict[i]
                     } for i in team_dict],
                     style=dict(width='20em')),
        html.Br(),
        html.H6(id='ex_secs',
                children=['Exclude Seconds After Possession Change']),
        daq.NumericInput(id='ex_secs-input-clustering', min=0, value=1,
                         max=10),
        html.Br(),
        html.H6(id='no_cluster', children=['Number of Cluster']),
        daq.NumericInput(id='no_cluster-input', min=0, value=10, max=30),
        html.Br(),
        html.H6("Ball Possession Phase"),
        dcc.RadioItems(id='possession-radio-clustering',
                       options=[{
                           'label': 'Ball possession',
                           'value': 'bp'
                       }, {
                           'label': 'No ball possession',
                           'value': 'nbp'
                       }, {
                           'label': 'Both',
                           'value': 'bo'
                       }],
                       value='bo'),
        html.Br(),
        html.Div(children=html.Button(id="start-btn-clustering",
                                      children="Go"), )
    ])
コード例 #5
0
def build_instructions():
    return html.Div(
        id="left-col",
        children=[
            html.P(className="instructions", children="Select candidates"),
            html.Div(
                id="choose-nclusters",
                children=[
                    html.Label("Number of clusters:", className="eight columns", style={'color': 'orange'}),
                    html.Div(
                        daq.NumericInput(id="nclusters", className="setting-input", size=100, max=10000, value=50),
                        className="three columns", style={'color': 'green'}
                    ),
                ],
                className="row",
            ),
            html.Div(
                id="choose-ndcs",
                children=[
                    html.Label("Number of DCs to open:", className="eight columns", style={'color': 'orange'}),
                    html.Div(
                        daq.NumericInput(id="ndcs", className="setting-input", size=100, max=10000, value=5),
                        className="three columns", style={'color': 'green'}
                    ),
                ],
                className="row",
            ),
            # dcc.Dropdown(
            #     id="operator-select",
            #     options=[
            #         {"label": i, "value": i}
            #         for i in [1,2,3]
            #     ],
            #     multi=True,
            #     value=[1,2],
            # ),
            html.Div(
                html.Button("Cluster and optimize", id="update-DCs", style={'color': 'white'}),
            ),
            html.Label(id="products-summary-2"),
        ],
    )
コード例 #6
0
def turn_on_example_data(on):
    if on:
        return html.Div(children=[
            html.Br(),
            daq.NumericInput(id='timesteps',
                             min=1,
                             max=350,
                             value=10,
                             label='Choose number of timesteps',
                             size=120),
        ])
コード例 #7
0
def gen_tab2(results_df):
    return html.Div(
        id='main_cols',
        children=[
            html.Div(
                id='race',
                children=[
                    daq.NumericInput(id='my-daq-numericinput',
                                     max=60,
                                     value=1,
                                     label='Race Number',
                                     labelPosition='top',
                                     min=1),
                    html.Div(
                        id='lanes',
                        children=[
                            html.H3('Lanes'),
                            #html.H3(results_df.loc['race']),
                            html.Div(id='lane1', className="two columns"),
                            html.Div(id='lane2', className="two columns"),
                            html.Div(id='lane3', className="two columns"),
                            html.Div(id='lane4', className="two columns"),
                        ],
                        className="twelve columns",
                        style={
                            'border': 'solid',
                            'text-align': 'center'
                        }),
                    html.Div(id='race-controls',
                             children=[
                                 html.Button('Get more Results',
                                             id='button-results'),
                                 html.Button('Force Race End',
                                             id='button-end'),
                                 html.Button('Next Race', id='button-next'),
                             ],
                             style={
                                 'margin': '80px',
                                 'text-align': 'center'
                             },
                             className="ten columns"),
                ],
                className="nine columns"),
            html.Div(
                id='leader-board',
                children=[
                    html.H3('Fastest Average Time'),
                    #html.Table([html.Tr(['Name ','Den ', 'Time '])]),
                    generate_table(results_df),
                ],
                className="three columns",
                style={'border': 'solid'}),
        ],
    )
コード例 #8
0
def get_numeric_input(id_name, value, title):
    return html.Div(
        id=f"{id_name}-menu",
        # className='five columns',
        children=[
            html.Label(id=f"{id_name}-title", children=title),
            daq.NumericInput(id=f"{id_name}-input",
                             className="setting-input",
                             value=value,
                             size=200,
                             max=9999999)
        ])
コード例 #9
0
def Clustering_Options(options):
    """
    Generate the layout of the dashboard.

    Args:
        options (list(dict)): Available datasets as options for `dcc.Dropdown`.

    Returns:
        A Dash element or list of elements.
    """

    return html.Div(children=[
        # Choose a dataset
        html.Div(create_dropdown("Available datasets",
                                 options,
                                 multi=False,
                                 id="dataset_choice_clustering"),
                 className="horizontal_dropdowns"),

        # Choose an algorithm
        html.Div(create_dropdown("Choose algorithm type",
                                 options=[
                                     {
                                         'label': 'DBSCAN',
                                         'value': 'dbscan'
                                     },
                                     {
                                         'label': 'K-Means Clustering',
                                         'value': 'kmc'
                                     },
                                 ],
                                 multi=False,
                                 id="algo_choice_clustering"),
                 className="horizontal_dropdowns"),

        ## Two empty divs to be filled by callbacks
        # Available choices for fitting
        html.Div(id="variable_choices_clustering"),

        #Available number of clusters
        html.P("Number of clusters:"),
        daq.NumericInput(id='clusters_input', min=0, value=3, max=10),
        # The results
        html.Div(id="training_results_clustering"),

        # The graph
        dcc.Graph(id="clustering_results"),
    ])
コード例 #10
0
def html_numeric_input(name: str, value: float, min: float, max: float, id: str):
    """
    :param name: The name of the input. Should be lowercase with spaces between words.
    :param value: The default value of the input.
    :param min: The minimum input value allowed.
    :param max: The maximum input value allowed.
    :param id: The id of the input field.
    """
    return html.Div(
        daq.NumericInput(
            id=id,
            size=100,
            min=min,
            max=max,
            value=round(value, 3)),
        style={'display': 'inline-block',
               'margin-right': '1rem'})
コード例 #11
0
    def success_layout(self):
        """
        Create a Dash layout after a successful login, and a menu \
        to fetch data.
        """

        return [
            html.H4("Write the name of a subreddit:"),
            dcc.Input(
                id="reddit_subreddit",
                type="text",
                value="",
            ),
            html.H4("How many topics to fetch?"),
            daq.NumericInput(id="reddit_ntopics", value=5),
            html.Button("Gimme dem reddits", id="get_reddit", n_clicks=0),
            html.Br(),
            html.Div(id="reddit_results"),
        ]
コード例 #12
0
    def _sub_layouts(self):

        enable = daq.BooleanSwitch(
            id=self.id("enable_transformation"),
            style={
                "display": "inline-block",
                "vertical-align": "middle"
            },
        )

        message = html.Div(id=self.id("message"))

        description = dcc.Markdown(self.description)

        options = html.Div(self.options_layouts(), id=self.id("options"))

        preview = dcc.Loading(id=self.id("preview"))

        if self.is_one_to_many:
            ranked_list = daq.NumericInput(value=1,
                                           min=1,
                                           max=10,
                                           id=self.id("ranked_list"))
        else:
            # if not 1-to-many, we don't need the control, we keep
            # an empty container here to make the callbacks simpler
            # since "ranked_list" will then always be present in layout
            ranked_list = html.Div(id=self.id("ranked_list"))

        return {
            "options": options,
            "description": description,
            "enable": enable,
            "message": message,
            "preview": preview,
            "ranked_list": ranked_list,
        }
コード例 #13
0
     labelPosition="top",
     on=True,
     className="one columns",
     style={
         "width": "8%",
         "paddingBottom": "1%"
     },
     color="",
 ),
 daq.NumericInput(
     id="led-select",
     label="Led Select",
     className="one columns",
     style={
         "width": "5%",
         "textAlign": "center",
         "marginLeft": "3%",
         "paddingBottom": "1%",
     },
     value=0,
     max=8,
     disabled=False,
 ),
 daq.BooleanSwitch(
     id="all-switch",
     on=False,
     label="All",
     vertical=True,
     labelPosition="top",
     className="one columns",
     style={"width": "3%"},
     disabled=False,
コード例 #14
0
                              className='gauge')

on_button = daq.PowerButton(id='on_button',
                            size=60,
                            on=True,
                            label=' ',
                            labelPosition='top',
                            color='#55f4e2')

real_input = [
    html.Div([
        html.Div('Forecast Steps: ',
                 className='inputGroup__label d-inline-block'),
        daq.NumericInput(id='real_step',
                         min=1,
                         value=6,
                         max=12,
                         className='inputGroup__input d-inline-block')
    ],
             className='inputGroup inline d-inline-block'),
    dbc.Button(id='show_button',
               children='Forecast',
               n_clicks=0,
               className='button--primary d-inline-block'),
]

##################
# live plot
##################
live_plot = [
    dcc.Graph(id='live_plot', style=dict(height='240px')),
コード例 #15
0
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
import dash_bootstrap_components as dbc
import dash_daq as daq

from app import app

# define layout for the input menu (left hand side)
parameter_input = [
    dbc.Row(children=[
        dbc.Col(
            className='md-6',
            children=[
                'offset',
                daq.NumericInput(
                    id='offset', value=0, min=-1000, max=1000, disabled=True)
            ])
    ]),
    dbc.Row(children=[
        dbc.Col(
            className='md-6',
            children=[
                'a',
                html.Sub(children=['1']),
                daq.NumericInput(
                    id='param1',
                    value=0, min=-1000, max=1000, disabled=True)
            ]),
        dbc.Col(
            className='md-6',
            children=[
コード例 #16
0
             width={
                 "size": 6,
                 "offset": 1
             })),
 dbc.Row(
     dbc.Col(html.H5(children='House hunter toolkit to fit their budget.'),
             width={
                 "size": 6,
                 "offset": 1
             })),
 html.Br(),
 dbc.Row([
     dbc.Col([
         dbc.Label("Budget"),
         daq.NumericInput(
             id='budget',
             value=100000, min=12789, max=755000, size=200),
         html.Br(),
         dbc.Label("Gross Living Area (ft^2)"),
         daq.NumericInput(
             id='GrLivArea', value=1000, min=334, max=4676, size=200),
         html.Br(),
         dbc.Label("Number of cars in garage"),
         daq.NumericInput(id='Garage_Cars', value=1, min=0, max=5,
                          size=200),
         html.Br(),
         dbc.Label("Overall condition"),
         daq.NumericInput(
             id='overall_cond', value=5, min=0, max=10, size=200),
         html.Br(),
         dbc.Label("Overall quality"),
コード例 #17
0
ファイル: Tab2.py プロジェクト: meh132/derbydash
def gen_tab2(results_df):
    return html.Div(
        id='main_cols',
        children=[
            html.Div(
                id='race',
                children=[
                    daq.NumericInput(id='my-daq-numericinput',
                                     max=60,
                                     value=1,
                                     label='Race Number',
                                     labelPosition='top',
                                     min=1),
                    html.Div(
                        id='lanes',
                        children=[
                            html.H3('Lanes'),
                            #html.H3(results_df.loc['race']),
                            html.Div(
                                id='lane1',
                                children=[
                                    html.H4('Lane 0'),
                                    html.Div(id='lane1-name'),
                                    html.H5('Master'),
                                    daq.LEDDisplay(id='lane1-leddisplay',
                                                   value=2.140,
                                                   label='Time',
                                                   labelPosition='bottom',
                                                   size='20',
                                                   color="#FF5E5E",
                                                   backgroundColor="#000000"),
                                ],
                                className="three columns",
                                style={
                                    'background-color': '#ffd700',
                                    'border': 'solid',
                                    'border-color': '#ffd700',
                                    'text-align': 'center'
                                },
                            ),
                            html.Div(id='lane2',
                                     children=[
                                         html.H4('Lane 2'),
                                         html.Div(id='lane2-name'),
                                         html.H5('Joey Chestnut'),
                                         daq.LEDDisplay(
                                             id='lane1-leddisplay',
                                             value='3.141',
                                             label='Time',
                                             labelPosition='bottom',
                                             size='20',
                                             color="#FF5E5E",
                                             backgroundColor="#000000"),
                                     ],
                                     className="three columns",
                                     style={
                                         'background-color': '#cd7f32',
                                         'border': 'solid',
                                         'text-align': 'center'
                                     }),
                            html.Div(id='lane3', className="three columns"),
                            html.Div(id='lane4',
                                     children=[
                                         html.H4('Lane 4'),
                                         html.H5('Joey Chestnut'),
                                         daq.LEDDisplay(
                                             id='lane1-leddisplay',
                                             value='3.141',
                                             label='Time',
                                             labelPosition='bottom',
                                             size='20',
                                             color="#FF5E5E",
                                             backgroundColor="#000000"),
                                     ],
                                     className="two columns",
                                     style={
                                         'border': 'solid',
                                         'text-align': 'center'
                                     }),
                            html.Div(id='race-controls',
                                     children=[
                                         html.Button('Get Results',
                                                     id='button-results'),
                                         html.Button('Force Race End',
                                                     id='button-end'),
                                         html.Button('Next Race',
                                                     id='button-next'),
                                     ],
                                     style={
                                         'margin': '80px',
                                         'text-align': 'center'
                                     },
                                     className="ten columns"),
                        ]),
                ],
                className="nine columns"),
            html.Div(
                id='leader-board',
                children=[
                    html.H3('Fastest Average Time'),
                    #html.Table([html.Tr(['Name ','Den ', 'Time '])]),
                    generate_table(results_df),
                ],
                className="three columns",
                style={'border': 'solid'}),
        ],
        style={'display': 'inline'})
コード例 #18
0
        html.Div(
            className='five columns',
            children=[
                html.Div(
                    id='value-setter-panel'),
                html.Br(),
                html.Button('Update', id='value-setter-set-btn'),
                html.Button('View current setup', id='value-setter-view-btn', n_clicks=0),
                html.Div(id='value-setter-view-output', className='output-datatable')
            ]
        )
    ]


ud_usl_input = daq.NumericInput(id='ud_usl_input', size=200, max=9999999, style={'width': '100%', 'height': '100%'})
ud_lsl_input = daq.NumericInput(id='ud_lsl_input', size=200, max=9999999, style={'width': '100%', 'height': '100%'})
ud_ucl_input = daq.NumericInput(id='ud_ucl_input', size=200, max=9999999, style={'width': '100%', 'height': '100%'})
ud_lcl_input = daq.NumericInput(id='ud_lcl_input', size=200, max=9999999, style={'width': '100%', 'height': '100%'})


def build_value_setter_line(line_num, label, value, col3):
    return html.Div(
        id=line_num,
        children=[
            html.Label(label, className='four columns'),
            html.Label(value, className='four columns'),
            html.Div(col3, className='four columns')],
        className='row'
    )
コード例 #19
0
def generate_layout(graphs, configs):
    if configs is None:
        configs = {}

    # Read-out graph view configs
    elements = configs["elements"] if "elements" in configs else None
    current_graph = configs[
        "current_graph"] if "current_graph" in configs else ""
    nodes_to_keep = configs["nodestokeep"] if "nodestokeep" in configs else []
    top_n_slider_value = configs["top_n"] if "top_n" in configs else None
    node_freq_type = configs[
        "node_weight"] if "node_weight" in configs else "degree_frequency"
    edge_freq_type = configs[
        "edge_weight"] if "edge_weight" in configs else "npmi"
    nodefreqslider = configs[
        "nodefreqslider"] if "nodefreqslider" in configs else [0, 100000]
    edgefreqslider = configs[
        "edgefreqslider"] if "edgefreqslider" in configs else [0, 100000]
    cluster_type = configs[
        "cluster_type"] if "cluster_type" in configs else "entity_type"
    clustersearch = configs[
        "clustersearch"] if "clustersearch" in configs else []
    current_layout = configs[
        "current_layout"] if "current_layout" in configs else DEFAULT_LAYOUT

    # Read-out old path search configs
    searchpathfrom = configs[
        "searchpathfrom"] if "searchpathfrom" in configs else None
    searchpathto = configs[
        "searchpathto"] if "searchpathto" in configs else None
    searchnodetotraverse = configs[
        "searchnodetotraverse"] if "searchnodetotraverse" in configs else None
    searchpathlimit = configs[
        "searchpathlimit"] if "searchpathlimit" in configs else 10
    searchpathoverlap = configs[
        "searchpathoverlap"] if "searchpathoverlap" in configs else [1]
    nestedpaths = configs["nestedpaths"] if "nestedpaths" in configs else []
    pathdepth = configs["pathdepth"] if "pathdepth" in configs else 2

    global_button_group = dbc.FormGroup([
        dbc.Col([
            dbc.Button(html.Span(
                [html.I(className="fas fa-redo"), " Reset view"]),
                       color="secondary",
                       className="mr-1",
                       id='bt-reset',
                       style={"margin": "2pt"}),
            dbc.Tooltip(
                "Reset the display to default values",
                target="bt-reset",
                placement="bottom",
            )
        ],
                width=6,
                style={"padding-left": "0pt"}),
        dbc.Col([
            dbc.Label(html.Span("Recompute spanning tree", id="recomp-label"),
                      html_for="recompute-spanning-tree"),
            dbc.Checklist(options=[{
                "value": 1
            }],
                          value=[1],
                          id="recompute-spanning-tree",
                          switch=True,
                          style={"margin-left": "5pt"}),
            dbc.Tooltip(
                "If enabled, the minimum spanning tree will be "
                "recomputed on the nodes selected in the current "
                "graph view (does not apply to filtering)",
                target="recomp-label",
                placement="bottom",
            )
        ],
                width=6)
    ],
                                        row=True,
                                        style={"margin-left": "5pt"})

    editing_mode_radio = dbc.FormGroup([
        dbc.Label("Choose the editing mode"),
        dbc.RadioItems(
            options=[
                {
                    "label": "Editing (edit the graph object)",
                    "value": 1
                },
                {
                    "label": "Masking (edit the current view)",
                    "value": 2
                },
            ],
            value=1,
            id="edit-mode",
        ),
    ])

    edit_button_group = dbc.InputGroup([
        dbc.Button(html.Span([html.I(className="fas fa-minus"), " Remove"]),
                   color="primary",
                   className="mr-1",
                   id='remove-button',
                   disabled=True,
                   style={"margin": "2pt"}),
        dbc.Button(html.Span(
            [html.I(className="fas fa-compress-alt"), " Merge"]),
                   color="primary",
                   className="mr-1",
                   id='merge-button',
                   style={"margin": "2pt"},
                   disabled=True),
        dbc.Button(html.Span([html.I(className="fas fa-edit"), " Rename"]),
                   color="primary",
                   className="mr-1",
                   id='rename-button',
                   style={"margin": "2pt"},
                   disabled=True),
        dbc.Button(html.Span([html.I(className="fas fa-redo"), " Reset"]),
                   color="secondary",
                   className="mr-1",
                   id='reset-elements-button',
                   style={
                       "float": "right",
                       "margin": "2pt"
                   },
                   disabled=False),
        dbc.Modal(
            [
                dbc.ModalHeader("Merged label"),
                dbc.ModalBody([
                    dbc.FormGroup([
                        dbc.Label("Would you like to"),
                        dbc.RadioItems(
                            options=[{
                                "label": "merge into one of the entities",
                                "value": 1
                            }, {
                                "label": "merge as a new entity",
                                "value": 2
                            }],
                            value=1,
                            id="merge-options",
                        ),
                    ]),
                    dbc.FormGroup([dbc.Input(id="merge-label-input")],
                                  id="merge-input")
                ]),
                dbc.ModalFooter([
                    dbc.Button("Apply",
                               id="merge-apply",
                               color="primary",
                               className="ml-auto"),
                    dbc.Button("Close",
                               id="merge-close",
                               color="default",
                               className="ml-auto")
                ]),
            ],
            id="merge-modal",
        ),
        dbc.Modal(
            [
                dbc.ModalHeader("Rename the selected node"),
                dbc.ModalBody([
                    html.P(id="rename-error-message", style={"color": "red"}),
                    dbc.FormGroup([
                        dbc.Col(dbc.Label("New label"), width=3),
                        dbc.Col(dbc.Input(id="rename-input"), width=9)
                    ],
                                  row=True),
                ]),
                dbc.ModalFooter([
                    dbc.Button("Apply",
                               id="rename-apply",
                               color="primary",
                               className="ml-auto"),
                    dbc.Button("Close",
                               id="rename-close",
                               color="default",
                               className="ml-auto")
                ]),
            ],
            id="rename-modal",
        ),
    ])

    dropdown_items = dcc.Dropdown(id="showgraph",
                                  value=current_graph,
                                  options=[{
                                      'label': val.capitalize(),
                                      'value': val
                                  } for val in graphs],
                                  style={"width": "100%"})

    graph_type_dropdown = dbc.FormGroup([
        dbc.Label(html.Span("Graph to display", id="showgraph-label"),
                  html_for="showgraph"),
        dbc.Tooltip(
            "Switch between different loaded graphs to display.",
            target="showgraph-label",
            placement="top",
        ), dropdown_items
    ])

    search = dbc.FormGroup([
        dbc.Label("Search node",
                  html_for="searchdropdown",
                  width=3,
                  style={
                      "text-align": "right",
                      "padding-right": "0pt"
                  }),
        dbc.Col(dcc.Dropdown(id="searchdropdown", multi=False), width=6),
        dbc.Col([
            dbc.DropdownMenu([
                dbc.DropdownMenuItem("png", id="png-menu"),
                dbc.DropdownMenuItem(divider=True),
                dbc.DropdownMenuItem("jpg", id="jpg-menu"),
                dbc.DropdownMenuItem(divider=True),
                dbc.DropdownMenuItem("svg", id="svg-menu"),
                dbc.DropdownMenuItem(divider=True),
                dbc.DropdownMenuItem(
                    "gml", id="gml-menu", href="/download/graph.gml")
            ] + [Download(id="download-gml")],
                             label="Download",
                             id='dropdown-download',
                             color="primary",
                             group=True,
                             className="mr-1",
                             in_navbar=True),
        ],
                width=3)
    ],
                           row=True,
                           style={"margin": "3pt"})

    freq_input_group = dbc.InputGroup([
        dbc.Label(html.Span("Node Weight", id="node_freq_type-label"),
                  html_for="node_freq_type"),
        dbc.Tooltip(
            "Select a metric to use as the node weight "
            "(node sizes are proportional to the selected weight)",
            target="node_freq_type-label",
            placement="top",
        ),
        dcc.Dropdown(id="node_freq_type",
                     value=node_freq_type,
                     options=[{
                         'label': val[0],
                         'value': val[1]
                     } for val in node_frequency_type],
                     style={"width": "100%"}),
    ],
                                      className="mb-1")

    node_range_group = dbc.FormGroup([
        dbc.Label(html.Span("Display Range", id="nodefreqslider-label"),
                  html_for="nodefreqslider"),
        html.Div([
            dcc.RangeSlider(id="nodefreqslider_content",
                            min=0,
                            max=100000,
                            value=nodefreqslider)
        ],
                 id="nodefreqslider"),
        dbc.Tooltip(
            "Adjust the node weight range (only the nodes having "
            "the weight in the selected range will be displayed)",
            target="nodefreqslider-label",
            placement="bottom",
        ),
    ])

    edge_input_group = dbc.InputGroup([
        dbc.Label(html.Span("Edge Weight", id="edge_freq_type-label"),
                  html_for="edge_freq_type"),
        dbc.Tooltip(
            "Select a metric to use as the edge weight (edge thickness "
            "is proportional to the selected weight)",
            target="edge_freq_type-label",
            placement="top",
        ),
        dcc.Dropdown(id="edge_freq_type",
                     value=edge_freq_type,
                     options=[{
                         'label': val[0],
                         'value': val[1]
                     } for val in edge_frequency_type],
                     style={"width": "100%"})
    ],
                                      className="mb-1")

    edge_range_group = dbc.FormGroup([
        dbc.Label(html.Span("Display Range", id="edgefreqslider-label"),
                  html_for="edgefreqslider"),
        html.Div([
            dcc.RangeSlider(id="edgefreqslider_content",
                            min=0,
                            max=100000,
                            value=edgefreqslider)
        ],
                 id="edgefreqslider"),
        dbc.Tooltip(
            "Adjust the edge weight range (only the edge having the "
            "weight in the selected range will be displayed)",
            target="edgefreqslider-label",
            placement="bottom",
        ),
    ])

    frequencies_form = dbc.FormGroup([
        dbc.Col([freq_input_group, node_range_group], width=6),
        dbc.Col([edge_input_group, edge_range_group], width=6)
    ],
                                     style={"margin-bottom": "0pt"},
                                     row=True)

    display_message = html.P("Displaying top 100 most frequent entities",
                             id="display-message")

    top_n_button = dbc.Button("Show N most frequent",
                              color="primary",
                              className="mr-1",
                              id='top-n-button',
                              style={"margin": "5pt"})

    top_n_slider = daq.NumericInput(
        id="top-n-slider",
        min=1,
        max=1000,
        value=top_n_slider_value if top_n_slider_value else 100,
        className="mr-1",
        disabled=False,
        style={"margin": "5pt"})
    show_all_button = dbc.Button("Show all entities",
                                 id="show-all-button",
                                 color="primary",
                                 className="mr-1",
                                 style={
                                     "float": "right",
                                     "margin": "5pt"
                                 })

    top_n_groups = dbc.InputGroup([
        top_n_button,
        dbc.Tooltip(
            "Display N nodes with the highest paper occurrence frequency, "
            "where N is defined by the slider on the right.",
            target="top-n-button",
            placement="top",
        ), top_n_slider, show_all_button,
        dbc.Tooltip(
            "Display all the nodes of the current graph.",
            target="show-all-button",
            placement="top",
        )
    ],
                                  style={"margin-bottom": "10pt"})

    item_details_card = dbc.Card(
        dbc.CardBody([
            html.H5("", className="card-title"),
            html.H6("", className="card-subtitle"),
            html.P("", className="card-text"),
            dbc.Button("", color="primary", id="see-more-card")
        ],
                     id="item-card-body"))

    view_selection_card = dbc.Card(dbc.CardBody([
        html.H6("View selection", className="card-title"), graph_type_dropdown,
        display_message, top_n_groups, frequencies_form
    ]),
                                   id="view-selection-card",
                                   style={"margin-bottom": "10pt"})

    cluster_group = dbc.InputGroup([
        dbc.Label(html.Span("Group by", id="group-by-label"),
                  html_for="cluster_type"),
        dbc.Tooltip(
            "Select a grouping factor for the nodes.",
            target="group-by-label",
            placement="top",
        ),
        dcc.Dropdown(id="cluster_type",
                     value=cluster_type,
                     options=[{
                         'label': val[0],
                         'value': val[1]
                     } for val in cluster_types],
                     style={"width": "100%"})
    ],
                                   className="mb-1")

    cluster_filter = dcc.Dropdown(id="clustersearch",
                                  multi=True,
                                  options=[{
                                      "label": el,
                                      "value": el
                                  } for el in clustersearch],
                                  value=clustersearch)

    filter_by_cluster = dbc.FormGroup([
        dbc.Label(html.Span("Groups to display", id="clustersearch-label"),
                  html_for="clustersearch"),
        dbc.Tooltip(
            "Only the nodes beloning to the groups selected in the field "
            "below will be displayed. You click or start typing to add new "
            "groups to display, or click on the cross icon to remove a group.",
            target="clustersearch-label",
            placement="top",
        ), cluster_filter,
        dbc.Button("Add all groups",
                   color="primary",
                   className="mr-1",
                   id='addAllClusters',
                   style={"margin-top": "10pt"}),
        dbc.Tooltip(
            "Add all available node groups to display.",
            target="addAllClusters",
            placement="bottom",
        )
    ],
                                      style={"margin-top": "10pt"})

    cluster_layout_button = dbc.InputGroup([
        dbc.Checklist(
            options=[{
                "value": 1,
                "disabled": False
            }],
            value=[],
            id="groupedLayout",
            switch=True,
        ),
        dbc.Label("Grouped Layout", html_for="groupedLayout"),
    ])

    cluster_selection_card = dbc.Card(dbc.CardBody([
        html.H6("Grouping", className="card-title"), cluster_group,
        filter_by_cluster, cluster_layout_button
    ]),
                                      style={"margin-bottom": "10pt"})

    nodes_to_keep = dbc.FormGroup([
        dbc.Label(html.Span("Nodes to keep", id="nodestokeep-label"),
                  html_for="nodestokeep"),
        dcc.Dropdown(id="nodestokeep",
                     multi=True,
                     options=[{
                         "label": n,
                         "value": n
                     } for n in nodes_to_keep],
                     value=nodes_to_keep,
                     placeholder="Nodes to fix in the view..."),
        dbc.Tooltip(
            "The selected nodes will be fixed in the graph view "
            "and will not be filtered by 'top N' or group filters "
            "(start typing to obtain the nodes to select from).",
            target="nodestokeep-label",
            placement="top",
        )
    ], )

    form = dbc.Form([
        global_button_group,
        nodes_to_keep,
        view_selection_card,
        cluster_selection_card,
    ])

    legend = dbc.FormGroup([html.Div(id="cluster_board", children=[])])

    # ------ Path search form --------

    path_from = dbc.FormGroup([
        dbc.Label(html.Span("From", id="searchpathfrom-label"),
                  html_for="searchpathfrom",
                  width=3),
        dbc.Tooltip(
            "Select a node to use as the source in the path search",
            target="searchpathfrom-label",
            placement="top",
        ),
        dbc.Col(dcc.Dropdown(id="searchpathfrom",
                             value=searchpathfrom,
                             options=([{
                                 "label": searchpathfrom,
                                 "value": searchpathfrom
                             }] if searchpathfrom else [])),
                width=9)
    ],
                              row=True)

    path_to = dbc.FormGroup([
        dbc.Label(html.Span("To", id="searchpathto-label"),
                  html_for="searchpathto",
                  width=3),
        dbc.Tooltip(
            "Select a node to use as the target in the path search",
            target="searchpathto-label",
            placement="top",
        ),
        dbc.Col(dcc.Dropdown(id="searchpathto",
                             options=([{
                                 "label": searchpathto,
                                 "value": searchpathto
                             }] if searchpathto else []),
                             value=searchpathto),
                width=9)
    ],
                            row=True)

    neighbor_control_group = html.Div([
        dbc.FormGroup([
            dbc.Col(dbc.Button("Find top N neighbors",
                               color="primary",
                               className="mr-1",
                               id='bt-neighbors',
                               style={"float": "right"}),
                    width=10),
            dbc.Tooltip(
                "Search for the neighbors with the highest mutual information "
                "score.",
                target="bt-neighbors",
                placement="top",
            ),
            dbc.Col(daq.NumericInput(
                id="neighborlimit", min=1, max=100, value=10,
                className="mr-1"),
                    width=2),
        ],
                      row=True)
    ])

    neighbor_view_card = dbc.Card(dbc.CardBody([], id="neighbors-card-body"),
                                  style={
                                      "overflow-y": "scroll",
                                      "height": "150pt"
                                  })

    top_n_paths = dbc.FormGroup([
        dbc.Label(html.Span("Top N", id="searchpathlimit-label"),
                  html_for="searchpathlimit",
                  width=3),
        dbc.Tooltip(
            "Set a number of best paths to search for (the best paths are the "
            "ones that maximize the mutual information)",
            target="searchpathlimit-label",
            placement="top",
        ),
        dbc.Col(daq.NumericInput(id="searchpathlimit",
                                 min=1,
                                 max=50,
                                 value=searchpathlimit,
                                 className="mr-1"),
                width=9)
    ],
                                row=True)

    path_condition = dbc.FormGroup([
        dbc.Label("Traversal conditions"),
        dbc.FormGroup([
            dbc.Col([
                dbc.Label(html.Span("Entity to traverse",
                                    id="searchnodetotraverse-label"),
                          html_for="searchnodetotraverse"),
                dbc.Tooltip(
                    "Select an entity to traverse in the path search (if "
                    "selected, the search is performed in two steps: "
                    "from the source to the selected entity, and from "
                    "the selected entity to the target)",
                    target="searchnodetotraverse-label",
                    placement="top",
                ),
                dcc.Dropdown(id="searchnodetotraverse",
                             value=searchnodetotraverse,
                             options=([{
                                 "label": searchnodetotraverse,
                                 "value": searchnodetotraverse
                             }] if searchnodetotraverse else []))
            ],
                    width=6),
            dbc.Col([
                dbc.Label(html.Span("Allow Overlap",
                                    id="searchpathoverlap-label"),
                          html_for="searchpathoverlap"),
                dbc.Tooltip(
                    "If the overlap is allowed, then the the paths "
                    "from the source to the intermediate entity can go "
                    "through the same entities as the paths from the "
                    "intermediary to the target. Otherwise the paths "
                    "should go through distinct entities",
                    target="searchpathoverlap-label",
                    placement="top",
                ),
                dbc.Checklist(
                    options=[{
                        "value": 1
                    }],
                    value=searchpathoverlap,
                    id="searchpathoverlap",
                    switch=True,
                )
            ],
                    width=6)
        ],
                      row=True)
    ])

    nested_path = dbc.FormGroup([
        dbc.Label("Nested path search"),
        dbc.FormGroup([
            dbc.Col(children=[
                dbc.Label(html.Span("Nested", id="nestedpaths-label"),
                          html_for="nestedpaths"),
                dbc.Tooltip(
                    "If enabled, the nested paths are found, i.e. for "
                    "every edge found in a path we search for other N "
                    "best paths from the source to the target of this "
                    "edge for <depth> times",
                    target="nestedpaths-label",
                    placement="top",
                ),
                dbc.Checklist(
                    options=[{
                        "value": 1
                    }],
                    value=nestedpaths,
                    id="nestedpaths",
                    switch=True,
                )
            ],
                    width=6),
            dbc.Col([
                dbc.Label(html.Span("Depth", id="pathdepth-label"),
                          html_for="pathdepth"),
                dbc.Tooltip(
                    "Select the depth of nesting indicating for how many "
                    "iterations we expand the encountered edges into the "
                    "best paths.",
                    target="pathdepth-label",
                    placement="top",
                ),
                daq.NumericInput(id="pathdepth",
                                 min=1,
                                 max=4,
                                 value=pathdepth,
                                 disabled=True,
                                 className="mr-1")
            ],
                    width=6)
        ],
                      row=True)
    ])

    search_path = dbc.InputGroup([
        html.P("",
               id="noPathMessage",
               style={
                   "color": "red",
                   "margin-right": "10pt"
               }),
        dbc.Button(html.Span([html.I(className="fas fa-route"), " Find Paths"
                              ]),
                   color="primary",
                   className="mr-1",
                   id='bt-path',
                   style={"float": "right"}),
        dbc.Tooltip(
            "Find paths between selected entities",
            target="bt-path",
            placement="bottom",
        )
    ],
                                 style={"float": "right"})

    expand_edge = dbc.FormGroup([
        dbc.Label("Edge expansion"),
        dbc.FormGroup([
            dbc.Col(dbc.Button("Expand edge",
                               color="primary",
                               className="mr-1",
                               id='bt-expand-edge',
                               disabled=True),
                    width=6),
            dbc.Col(dbc.Label("N best paths",
                              html_for="expand-edge-n",
                              style={"margin-top": "5pt"}),
                    width=3),
            dbc.Col(daq.NumericInput(
                id="expand-edge-n", min=1, max=20, value=5, className="mr-1"),
                    width=3),
        ],
                      row=True)
    ])

    form_path_finder = dbc.Form([
        path_from, path_to, top_n_paths,
        html.Hr(), path_condition,
        html.Hr(), nested_path,
        html.Hr(), expand_edge,
        html.Hr(), search_path
    ])

    graph_layout = dbc.FormGroup([
        dbc.Label("Layout", html_for="searchdropdown", width=3),
        dbc.Col(dcc.Dropdown(id='dropdown-layout',
                             options=[{
                                 'label':
                                 "{}{}".format(
                                     val.capitalize(),
                                     " ({})".format(graph_layout_options[val])
                                     if graph_layout_options[val] else ""),
                                 'value':
                                 val
                             } for val in graph_layout_options.keys()],
                             value=current_layout,
                             clearable=False),
                width=9)
    ],
                                 row=True)

    node_shape = dbc.FormGroup([
        dbc.Label("Node Shape", html_for="dropdown-node-shape", width=3),
        dbc.Col(dcc.Dropdown(id='dropdown-node-shape',
                             value='ellipse',
                             clearable=False,
                             options=([{
                                 'label': val.capitalize(),
                                 'value': val
                             } for val in node_shape_option_list])),
                width=9)
    ],
                               row=True)

    link_color_picker = dbc.FormGroup([
        dbc.Col(
            daq.ColorPicker(id='input-follower-color',
                            value=dict(rgb=dict(r=190, g=36, b=37, a=0)),
                            label="Highlight Color"))
    ],
                                      row=True)

    conf_form = dbc.Form([graph_layout, node_shape, link_color_picker])

    # ---- Create a layout from components ----------------

    cyto = cyto_module.Cytoscape(
        id='cytoscape',
        elements=elements,
        stylesheet=CYTOSCAPE_STYLE_STYLESHEET,
        style={
            "width": "100%",
            "height": "100%"
        },
    )

    layout = html.Div([
        dcc.Store(id='memory',
                  data={
                      "removed_nodes": [],
                      "removed_edges": [],
                      "added_nodes": [],
                      "added_edges": [],
                      "filtered_elements": [],
                      "removed_elements": {},
                      "renamed_elements": {},
                      "merging_backup": {
                          "added_elements": [],
                          "removed_elements": {}
                      },
                      "paper_backup": {}
                  }),
        dbc.Row([]),
        dbc.Row([
            dbc.Col([
                html.Div(style=VISUALIZATION_CONTENT_STYLE,
                         children=[cyto],
                         id="cyto-container"),
                html.Div([
                    dcc.Loading(id="loading",
                                children=[html.Div(id="loading-output")],
                                type="default"),
                ],
                         id="loader-container",
                         className="fixed-top",
                         style={
                             "width": "60pt",
                             "height": "60pt",
                             "margin": "20pt"
                         }),
                html.Div([
                    search,
                ],
                         id="search-container",
                         className="fixed-top",
                         style={
                             "width": "30%",
                             "margin-left": "80pt"
                         }),
                html.Div([
                    dbc.Button(html.Span(
                        [html.I(className="fas fa-binoculars"), " Legend"]),
                               id="toggle-legend",
                               color="primary",
                               className="mr-1"),
                    dbc.Button(html.Span(
                        [html.I(className="fas fa-search-plus"), " Details"]),
                               id="toggle-details",
                               color="primary",
                               className="mr-1"),
                    dbc.Button(html.Span(
                        [html.I(className="fas fa-pen"), " Editing"]),
                               id="toggle-edit",
                               color="primary",
                               className="mr-1"),
                    dbc.Button(html.Span([
                        html.I(className="fas fa-star-of-life"), " Neighbors"
                    ]),
                               id="toggle-neighbors",
                               color="primary",
                               className="mr-1"),
                    dbc.Button(html.Span(
                        [html.I(className="fas fa-angle-down"), ""]),
                               id="toggle-hide",
                               color="light",
                               className="mr-1"),
                    dbc.Collapse(dbc.Card([
                        dbc.CardHeader([
                            html.H6("Legend (colored by Entity Type)",
                                    className="card-title",
                                    style={"margin-bottom": "0pt"},
                                    id="legend-title")
                        ],
                                       style={"margin-botton": "0pt"}),
                        dbc.CardBody([legend]),
                    ],
                                          style={"height": "100%"}),
                                 style={"height": "150pt"},
                                 id="collapse-legend"),
                    dbc.Collapse(dbc.Card([
                        dbc.CardHeader([
                            html.H6("Details",
                                    className="card-title",
                                    style={"margin-bottom": "0pt"})
                        ],
                                       style={"margin-botton": "0pt"}),
                        dbc.CardBody([item_details_card],
                                     style={"overflow-y": "scroll"})
                    ],
                                          style={"height": "100%"}),
                                 style={"height": "250pt"},
                                 id="collapse-details"),
                    dbc.Collapse(dbc.Card([
                        dbc.CardHeader([
                            html.H6("Edit graph",
                                    className="card-title",
                                    style={"margin-bottom": "0pt"})
                        ],
                                       style={"margin-botton": "0pt"}),
                        dbc.CardBody([
                            dbc.Row([
                                dbc.Col([editing_mode_radio], width=5),
                                dbc.Col([edit_button_group], width=7)
                            ])
                        ])
                    ],
                                          style={"height": "100%"}),
                                 style={"height": "150pt"},
                                 id="collapse-edit"),
                    dbc.Collapse(dbc.Card([
                        dbc.CardHeader([
                            html.H6("Neighbors view",
                                    className="card-title",
                                    style={"margin-bottom": "0pt"})
                        ],
                                       style={"margin-botton": "0pt"}),
                        dbc.CardBody(
                            [neighbor_control_group, neighbor_view_card])
                    ],
                                          style={"height": "100%"}),
                                 style={"height": "250pt"},
                                 id="collapse-neighbors"),
                ],
                         className="fixed-bottom",
                         style={
                             "width": "55%",
                         })
            ],
                    width=8),
            dbc.Col(html.Div(children=[
                dbc.Button(html.Span(
                    [html.I(className="fas fa-cog"), " Controls"]),
                           id="collapse-button",
                           color="primary",
                           style={
                               "margin": "10pt",
                               "margin-left": "60%"
                           }),
                dbc.Collapse(dbc.Tabs(
                    id='tabs',
                    children=[
                        dbc.Tab(id="graph-view-tab",
                                label='Graph view',
                                label_style={
                                    "color": "#00AEF9",
                                    "border-radius": "4px",
                                    "background-color": "white"
                                },
                                children=[dbc.Card(dbc.CardBody([form]))]),
                        dbc.Tab(id="layout-tab",
                                label='Layout',
                                label_style={
                                    "color": "#00AEF9",
                                    "border-radius": "4px",
                                    "background-color": "white"
                                },
                                children=[dbc.Card(dbc.CardBody([conf_form]))
                                          ]),
                        dbc.Tab(id="path-finder-tab",
                                label='Path finder',
                                label_style={
                                    "color": "#00AEF9",
                                    "border-radius": "4px",
                                    "background-color": "white"
                                },
                                children=[
                                    dbc.Card(dbc.CardBody([form_path_finder]))
                                ])
                    ]),
                             id="collapse"),
            ]),
                    width=4)
        ])
    ],
                      style={"overflow-x": "hidden"})
    return cyto, layout, dropdown_items, cluster_filter
コード例 #20
0
ファイル: app.py プロジェクト: valentinissot/corona
                    }],
                    value='Infected',
                    labelStyle={'display': 'inline-block'}),
     dcc.RadioItems(id='variable6',
                    options=[{
                        'label': 'Optimisation',
                        'value': 'Optimisation'
                    }, {
                        'label': 'No optimisation',
                        'value': 'No optimisation'
                    }],
                    value='No optimisation',
                    labelStyle={'display': 'inline-block'}),
     daq.NumericInput(id='variable3',
                      label='Population',
                      size=250,
                      max=3000000000,
                      value=1000),
     daq.NumericInput(id='variable4',
                      label='Beta',
                      size=75,
                      max=1,
                      min=0.0001,
                      value=0.01),
     daq.NumericInput(id='variable5',
                      label='Gamma',
                      size=75,
                      max=100,
                      min=0.001,
                      value=0.1)
 ]),
コード例 #21
0
                        html.Div(
                            id="value-setter-view-output", className="output-datatable"
                        ),
                        html.Div(
                            id="indicator-operation-output", className="operation-datatable"
                        ),

                    ],
                ),
            ],
        ),
    ]


ud_ul_input = daq.NumericInput(
    id="ud_ul_input", className="setting-input", size=200, max=9999999, value=0
)
ud_ll_input = daq.NumericInput(
    id="ud_ll_input", className="setting-input", size=200, max=9999999, value=0
)
ud_ml_input = daq.NumericInput(
    id="ud_ml_input", className="setting-input", size=200, max=9999999, value=0
)


def build_value_setter_line(line_num, label, value, col3):
    return html.Div(
        [html.Label(label, className="four columns"),
         html.Label(value, className="four columns"),
         html.Div(col3, className="four columns"),
         ]
コード例 #22
0
                       },
                       {
                           'label': 'KNER (Gudnason)',
                           'value': 'kner'
                       },
                       {
                           'label': 'KNDX (Nakka)',
                           'value': 'kndx'
                       },
                   ],
                   value='knsb-nakka')
    ]),
            width=4),
    dbc.Col(dbc.FormGroup([
        dbc.Label('Grain segment count'),
        daq.NumericInput(id='N', value='4', min=1, max=8)
    ]),
            width=4),
    dbc.Col(dbc.FormGroup([
        daq.BooleanSwitch(id='neutral_burn_profile',
                          label='Neutral burn profile',
                          on=True)
    ]),
            width=4)
])

input_row_3 = dbc.Row([
    dbc.Col(dbc.FormGroup([
        dbc.Label('Grain diameter (mm)'),
        dbc.Input(placeholder='Insert grain diameter...',
                  id='D_grain',
コード例 #23
0
    def __init__(self):
        
        
        self.mcu = MCU_STM32F7()
        self.start_button_clicks = 0
        self.upload_button_clicks = 0
        # self.app = dash.Dash(__name__, external_stylesheets=['https://codepen.io/chriddyp/pen/bWLwgP.css'], title = 'Data Collector')
        self.app = dash.Dash(__name__, title = 'WaveForm Analyzer')
        self.app.css.append_css({"external_url": 'mycss.css'})
        
        
        self.controll_limit_dict = SPECIFICATION.CONTROLL_LIMIT
        self.data_table_fmt = SPECIFICATION.TABLE_FORMAT
        self.fig_color_fmt = SPECIFICATION.FIGURE_FORMAT
        self.LCL, self.UCL = self.controll_limit_dict['3'] #default 3.0 V
        
        self.web_port = self.mcu.parameters.web_port
        self.web_host = '127.0.0.1'
        
        self.app.layout = html.Div([ 
            
            html.H1(id = 'Program-Name',children='WaveForm Analyzer', style={'font-wmaxDataPts': 'bold'}), #style = {'text-align':'center', 'font-size':16, 'transform':"rotate(0deg)"} 
            html.Hr(),
            
            html.Div(className = 'row',
                    style = {"margin-left": "10px", "margin-top": "10px"},
                    children = [
                        html.Div(className = 'three columns',
                                children = [dcc.RadioItems(id = 'mode-items', 
                                                            options = [{'label':'Real Mode', 'value':'rm'},
                                                                       {'label':'File Mode', 'value':'fm'}
                                                                       ],
                                                                       value = 'rm',
                                                                       labelStyle={'display': 'inline-block'}
                                                            )
                                ], style={'float': 'left', "margin-left": "20px"}),
                                
                        
                        html.Div(className = 'three columns',
                                children = [
                                        html.Div(className = 'five columns', children = "Voltage Selection: ",id='dropdown-label', style={'font-size':16}),
                        
                                        html.Div(className = 'four columns',
                                                children = [
                                                            dcc.Dropdown(id='dropdown-voltage',
                                                                        options=[
                                                                            {'label': '3.0V', 'value': 3},
                                                                            {'label': '5.0V', 'value': 5},
                                                                            {'label': '12.0V', 'value': 12}
                                                                        ],
                                                                        value=3,
                                                                        clearable=False
                                                                        )
                                                        ],
                                                style = {'width':'30%', 'height':'30px', 'display':'inline-block', 'float': 'left', "margin-left": "5px"},
                                        )
                                
                                ]),
                        
                        
                        html.Div(className = 'three columns',
                                children = [
                                        html.Div(className = 'four columns', children = "Time Scale: ",id='timescale-label', style={'font-size':16}),
                                        html.Div(className = 'three columns',
                                                children = [
                                                        daq.NumericInput(id='numeric-input',
                                                                 value=1,
                                                                 size = 60,
                                                                 label = '(s)',
                                                                 labelPosition  = 'right',
                                                                 min = 1,
                                                                 max = 5)
                                            ], style = {'width':'30%', 'height':'30px', 'display':'inline-block', 'float': 'left', "margin-left": "5px"})
                                ]),
                                
                    ]),
            
            
            
            html.Div(className='row',
                    style = {"margin-top": "50px"},
                    children = [
                        
                        html.Div(children = [
                            dbc.Button('Start', id = 'start-button', n_clicks = 0,style = {'float': 'left', "margin-left": "60px"}),
                            dbc.Spinner(html.Div(id="loading-output", children = ""),fullscreen=True),
                            # html.Button('Start', id = 'start-button', n_clicks = 0,style = {'float': 'left', "margin-left": "60px"}),
                            dcc.Upload(id = 'data-upload', children = [html.Button('Upload File', id = 'upload-button', n_clicks = 0, style = {'float': 'left', "margin-left": "20px"})]),
                            dcc.Input(id = "filename-input", type = "text", placeholder="Upload a file; Select File Mode at first", style = {'width':'20%', 'float': 'left', "margin-left": "20px"}, disabled = False)
                        ])
                        
                    ]),

            
            html.Div(className='row',
                     style = {"margin-top": "20px"},
                     children = [
                        dcc.Graph(id='live-graph', figure = {
                                                            'data' : [
                                                                go.Scatter(
                                                                x = [],
                                                                y = [],
                                                                mode = "lines",
                                                                name = "Data"
                                                                )
                                                            ],
                                                            
                                                            'layout' : go.Layout(
                                                                title = self.fig_color_fmt['title'],
                                                                xaxis = {'title': 'Time(ms)', 'gridcolor': 'rgb(255,255,255)'},
                                                                yaxis = {'title': 'Voltage (V)', 'gridcolor': 'rgb(255,255,255)'},
                                                                plot_bgcolor = 'rgb(200,200,200)'
                                                                )
                                                            }
                                                        ),
                                                        
                ]),
            html.Div(className='row',
                     children = [
                        dash_table.DataTable(
                                                id='data-table',
                                                columns=[{"name": n, "id": n} for n in self.data_table_fmt['columns']],
                                                data=self.data_table_fmt['data'],
                                                style_cell = {'font_family': 'Arial','font_size': '14px', 'text_align': 'center'},
                                                style_header={'backgroundColor': 'white','fontWeight': 'bold'}
                                            )
                    ], style={"margin-top": "50px", 'margin': 'auto', 'textAlign': 'center','width':'85%'}),
            
        ])
        
        
        
        
        @self.app.callback(
              [Output('live-graph', 'figure'),
              Output('data-table', 'data'),
              Output('loading-output', 'children')],
              [Input('start-button', 'n_clicks'),
              Input('dropdown-voltage','value'),
              Input('mode-items','value'),
              Input('numeric-input','value')])
        def plot_diagram(n_clicks, dropdown_value, mode_value, numeric_value):
            
            self.mcu.amplify_ratio = dropdown_value/3.0
            self.LCL, self.UCL = self.controll_limit_dict[str(dropdown_value)]
            self.mcu.change_itrs(target_time = numeric_value)
            
            
            layout = go.Layout(
                                title = self.fig_color_fmt['title'],
                                xaxis = {'title': 'Time(ms)', 'gridcolor': 'rgb(255,255,255)'},
                                yaxis = {'title': 'Voltage (V)', 'gridcolor': 'rgb(255,255,255)'},
                                plot_bgcolor = 'rgb(200,200,200)'
                                )
            
            fig_data_list = []
            output_table_data = []
            
            
            if self.start_button_clicks < n_clicks:
                
                self.start_button_clicks = n_clicks
                
                if mode_value == 'rm':
                    self.mcu.collect_long_data() ###
                    self.mcu.save_data()
                
                
                x = self.mcu.time_list
                for c_num, y_arr in enumerate([self.mcu.data_list_c1, self.mcu.data_list_c2, self.mcu.data_list_c3], 1):
                    
                    approx_num = 4
                    
                    if not np.isnan(y_arr[0]):
                        max_val = np.around(y_arr.max(), decimals = approx_num)
                        min_val = np.around(y_arr.min(), decimals = approx_num)
                        FD_val = np.around(y_arr.max()-y_arr.min(), decimals = approx_num)
                        ave_val = np.around(y_arr.mean(), decimals = approx_num)
                        rms_val = np.around(np.sqrt((y_arr**2).sum()/len(y_arr)), decimals = approx_num)
                        std_val = np.around(np.sqrt(((y_arr-ave_val)**2).sum()/len(y_arr)), decimals = approx_num)
                        cv_percentage = np.around(std_val/ave_val*100, decimals = approx_num)
                        outPercentage = np.around(np.sum((y_arr > self.UCL)|(y_arr < self.LCL))/len(y_arr)*100, decimals = approx_num)
                    else:
                        max_val = 'N.A.'
                        min_val = 'N.A.'
                        FD_val = 'N.A.'
                        ave_val = 'N.A.'
                        rms_val = 'N.A.'
                        std_val = 'N.A.'
                        cv_percentage = 'N.A.'
                        outPercentage = 'N.A.'
                    
                    data = go.Scatter(
                            x=x,
                            y=y_arr,
                            name='Channel-%d'%c_num,
                            mode= 'lines',
                            marker = dict(color = self.fig_color_fmt['linecolor'][c_num-1])
                            )
                    
                    
                    fig_data_list += [data]
                    
                    output_table_data += [{'Item': 'Channel-%d'%c_num, 
                                            'Maximum Voltage(V)': max_val, 
                                            'Minimum Voltage(V)':min_val, 
                                            'Full Deviation(V)':FD_val, 
                                            'Average Voltage(V)':ave_val, 
                                            'RMS':rms_val,
                                            'STDEV(V)':std_val,
                                            'CV(%)':cv_percentage,
                                            'OutPercentage%(+ or - 5%)':outPercentage
                                            }]
                    
                    
                
                data_UCL = go.Scatter(
                    x = [0,np.max(x)],
                    y = [self.UCL, self.UCL],
                    mode = "lines",
                    name = "UCL({:.2f}V)".format(self.UCL),
                    marker = dict(color = 'rgb(255,0,0)'),
                    line = dict(dash = 'dash')
                    )
                    
                data_LCL = go.Scatter(
                        x = [0,np.max(x)],
                        y = [self.LCL, self.LCL],
                        mode = "lines",
                        name = "LCL({:.2f}V)".format(self.LCL),
                        marker = dict(color = 'rgb(0,255,0)'),
                        line = dict(dash = 'dash')
                        )
                
                fig_data_list += [data_UCL , data_LCL]
                        
                output_fig = {'data': fig_data_list,'layout' : layout}
                
            else:
                       
                data = go.Scatter(
                    x = [],
                    y = [],
                    mode = "lines",
                    name = "Data"
                    )
            
            
                output_fig = {'data': [data],'layout' : layout}
                output_table_data = self.data_table_fmt['data']
            
            
            return output_fig, output_table_data, ""
        
        
        @self.app.callback(
              Output('filename-input', 'value'),
              [Input('data-upload', 'filename'),
              Input('data-upload', 'contents'),
              Input('mode-items','value')])
        def plot_diagram_by_upload(filename, contents, mode_value):
            
            # columns = ['time(sec.)','C1_voltage(V)','C1_voltage(V)','C1_voltage(V)']
            if contents != None and mode_value == 'fm':
                try:
                    content_type, content_string = contents.split(',')
                    decoded = base64.b64decode(content_string)
                    
                    if 'csv' in filename:
                        # Assume that the user uploaded a CSV or TXT 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))
                    elif 'txt' or 'tsv' in filename:
                        # Assume that the user upl, delimiter = r'\s+'oaded an excel file
                        df = pd.read_csv(io.StringIO(decoded.decode('utf-8')), delimiter=r'\s+')
                    
                    
                    # self.mcu.reset_data()
                    self.mcu.time_list = df.iloc[:,0].values
                    self.mcu.data_list_c1 = df.iloc[:,1].values
                    self.mcu.data_list_c2 = df.iloc[:,2].values
                    self.mcu.data_list_c3 = df.iloc[:,3].values

                    return filename
                    
                except Exception as e:
                    print(e)
                    return 'There was an error processing this file.'
            else:
                return ""
コード例 #24
0
                            id="select_independent",
                            options=[{'label':x, 'value':x} for x in obj_Data.df_train_dummies.columns],
                            value= list(obj_Data.df_train_dummies.columns),
                            multi=True,
                            className="dcc_control",
                        ),
                        html.Div(
                            [
                                html.Div(
                                    [
                                        html.P("Select Number of KFOLD Splits", className="control_label"),

                                        daq.NumericInput(
                                            id='id-daq-splits',
                                            min=0,
                                            max=10,
                                            size = 75,
                                            value=2
                                        ),  
  
                                    ],className="row flex-display",
                                ),
     
                             ]
                        ),
                        html.P("Models", className="control_label"),
                        dcc.Dropdown(
                            id="select_models",
                            options = [{'label':x, 'value':x} for x in models],
                            value = models,
                            multi=True,
     min=0,
     max=10,
     value=6,
     id='darktheme-daq-knob',
     className='dark-theme-control'
 ), html.Br(),
 daq.LEDDisplay(
     value="3.14159",
     color=theme['primary'],
     id='darktheme-daq-leddisplay',
     className='dark-theme-control'
 ), html.Br(),
 daq.NumericInput(
     min=0,
     max=10,
     value=4,
     id='darktheme-daq-numericinput',
     className='dark-theme-control'
 ), html.Br(),
 daq.PowerButton(
     on=True,
     color=theme['primary'],
     id='darktheme-daq-powerbutton',
     className='dark-theme-control'
 ), html.Br(),
 daq.PrecisionInput(
     precision=4,
     value=299792458,
     id='darktheme-daq-precisioninput',
     className='dark-theme-control'
 ), html.Br(),
コード例 #26
0
ファイル: layout_base.py プロジェクト: kromerh/dash_NG
     children=[
         html.H5(
             "Setpoint Mass Flow",
             style={
                 "textAlign": "Center",
                 # "paddingTop": "2.5%",
                 "marginBottom": "5%",
             },
         )
     ], ),
 html.Div(
     [
         daq.NumericInput(
             id='flow-meter-setpoint-numeric-input',
             value=0.0,
             min=0,
             max=5000,
             size=100,
             label='Setpoint (0 - 5000 mV)',
             labelPosition='bottom'),
         html.Button("Send",
                     id='flow-meter-setpoint-button',
                     style={
                         "marginLeft": "5%",
                         "marginRight": "5%",
                         "marginBottom": "5%",
                     }),
     ],
     className="row",
     style={
         "display": "flex",
         "justify-content": "center",
コード例 #27
0
ファイル: app.py プロジェクト: plotly/dash-sample-apps
                                    id="value-setter-view-btn",
                                    n_clicks=0,
                                ),
                            ],
                        ),
                        html.Div(id="value-setter-view-output",
                                 className="output-datatable"),
                    ],
                ),
            ],
        ),
    ]


ud_usl_input = daq.NumericInput(id="ud_usl_input",
                                className="setting-input",
                                size=200,
                                max=9999999)
ud_lsl_input = daq.NumericInput(id="ud_lsl_input",
                                className="setting-input",
                                size=200,
                                max=9999999)
ud_ucl_input = daq.NumericInput(id="ud_ucl_input",
                                className="setting-input",
                                size=200,
                                max=9999999)
ud_lcl_input = daq.NumericInput(id="ud_lcl_input",
                                className="setting-input",
                                size=200,
                                max=9999999)

コード例 #28
0
    def _getdropdowns(self):
        ''' dashboard dropdowns
        '''

        # PCA DROPDOWNS HERE
        if self.method == 'PCA':
            pca_dropdowns = []
            if 'scatter' in self.plot_options:
                pca_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='rem_vari',
                            disabled=True,
                            min=0,
                            max=100,
                            size=120,
                            label='Remained Variance %',
                            labelPosition='bottom',
                            value=self.stats.remained_variance)
                    ],  className='two columns'))


                pca_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='red_dim_input_pca',
                            min=1,
                            max=min([self.stats.d, 3]),
                            size=120,
                            label='subspace dimension',
                            labelPosition='bottom',
                            value=2
                            ),
                    ], className='two columns'))

            if 'box' in self.plot_options:
                pca_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='box_red_dim_pca',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='Boxplot dimension',
                            labelPosition='bottom',
                            value=2)
                    ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=pca_dropdowns, className="row")

        # TSNE OPTIONS HERE
        if self.method == 'TSNE':
            tsne_dropdowns = []

            if 'scatter' in self.plot_options:
                tsne_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='red_dim_input_tsne',
                            min=1,
                            max=min([self.stats.d, 3]),
                            size=120,
                            label='subspace dimension',
                            labelPosition='bottom',
                            value=2),
                    ], className='two columns'))


                tsne_dropdowns.append(                    html.Div([
                        daq.NumericInput(
                            id='perplexity_tsne',
                            min=1,
                            max=100,
                            size=120,
                            label='Perplexity',
                            labelPosition='bottom',
                            value=30),
                    ], className='two columns'))

            if 'box' in self.plot_options:
                tsne_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='box_red_dim_tsne',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='Boxplot dimension',
                            labelPosition='bottom',
                            value=2)
                    ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=tsne_dropdowns, className="row")

        # LLE DROPDOWNS HERE
        if self.method == 'LLE':
            lle_dropdowns = []

            if 'scatter' in self.plot_options:
                lle_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='red_dim_input_lle',
                            min=1,
                            max=min([self.stats.d, 3]),
                            size=120,
                            label='subspace dimension',
                            labelPosition='bottom',
                            value=2),
                    ],className='two columns'))


                lle_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='neighbours_lle',
                            min=1,
                            max=self.stats.n-1,
                            size=120,
                            label='K-Neighbours',
                            labelPosition='bottom',
                            value=5),
                    ], className='two columns'))

            if 'box' in self.plot_options:
                lle_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='box_red_dim_lle',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='Boxplot dimension',
                            labelPosition='bottom',
                            value=2)
                    ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=lle_dropdowns, className="row")


        # UMAP OPTIONS HERE
        if self.method == 'UMAP':
            umap_dropdowns = []

            if 'scatter' in self.plot_options:
                umap_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='red_dim_input_umap',
                            min=1,
                            max=min([self.stats.d, 3]),
                            size=120,
                            label='subspace dimension',
                            labelPosition='bottom',
                            value=2),
                    ], className='two columns'))


                umap_dropdowns.append(                    html.Div([
                        daq.NumericInput(
                            id='kneighbours_umap',
                            min=1,
                            max=100,
                            size=120,
                            label='k-Neighbours',
                            labelPosition='bottom',
                            value=5),
                    ], className='two columns'))

            if 'box' in self.plot_options:
                umap_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='box_red_dim_umap',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='Boxplot dimension',
                            labelPosition='bottom',
                            value=2)
                    ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=umap_dropdowns, className="row")

        # KMAP OPTIONS HERE
        if self.method == 'KMAP':
            kmap_dropdowns = []

            if 'scatter' in self.plot_options:
                kmap_dropdowns.append(html.Div([
                    daq.NumericInput(
                        id='red_dim_input_kmap',
                        min=1,
                        max=self.stats.d_red,
                        size=120,
                        label='subspace dimension',
                        labelPosition='bottom',
                        value=2),
                ], className='two columns'))



                kmap_dropdowns.append(html.Div([
                    daq.NumericInput(
                        id='kneighbours_kmap',
                        min=1,
                        max=100,
                        size=120,
                        label='k-Neighbours',
                        labelPosition='bottom',
                        value=30),
                ], className='two columns'))

                kmap_dropdowns.append(html.Div([
                    dcc.Dropdown(
                        id='algs_kmap',
                        options=[
                            {'label': 'PCA', 'value': 'PCA'},
                            {'label': 'UMAP', 'value': 'UMAP'},
                            {'label': 'LLE', 'value': 'LLE'},
                            {'label': 'TSNE', 'value': 'TSNE'},
                            {'label': 'ISOMAP', 'value': 'ISOMAP'},
                            {'label': 'MDS', 'value': 'MDS'}
                        ],
                        value='PCA'),
                ], className='two columns'))

            if 'box' in self.plot_options:
                kmap_dropdowns.append(html.Div([
                    daq.NumericInput(
                        id='box_red_dim_kmap',
                        min=1,
                        max=self.stats.d_red,
                        size=120,
                        label='Boxplot dimension',
                        labelPosition='bottom',
                        value=2)
                ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=kmap_dropdowns, className="row")

        # ISOMAP DROPDOWNS HERE
        if self.method == 'ISOMAP':
            isomap_dropdowns = []

            if 'scatter' in self.plot_options:
                isomap_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='red_dim_input_isomap',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='subspace dimension',
                            labelPosition='bottom',
                            value=2),
                    ], className='two columns'))


                isomap_dropdowns.append(                    html.Div([
                        daq.NumericInput(
                            id='kneighbours_isomap',
                            min=1,
                            max=100,
                            size=120,
                            label='k-Neighbours',
                            labelPosition='bottom',
                            value=30),
                    ], className='two columns'))

            if 'box' in self.plot_options:
                isomap_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='box_red_dim_isomap',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='Boxplot dimension',
                            labelPosition='bottom',
                            value=2)
                    ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=isomap_dropdowns, className="row")

        # MDS DROPDOWNS HERE
        if self.method == 'MDS':
            mds_dropdowns = []
            if 'scatter' in self.plot_options:

                mds_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='red_dim_input_mds',
                            min=1,
                            max=min([self.stats.d, 3]),
                            size=120,
                            label='subspace dimension',
                            labelPosition='bottom',
                            value=2
                            ),
                    ], className='two columns'))

            if 'box' in self.plot_options:
                mds_dropdowns.append(html.Div([
                        daq.NumericInput(
                            id='box_red_dim_mds',
                            min=1,
                            max=self.stats.d_red,
                            size=120,
                            label='Boxplot dimension',
                            labelPosition='bottom',
                            value=2)
                    ], className='two columns'))

            if 'graph' in self.plot_options:
                pass

            dashboard = html.Div(children=mds_dropdowns, className="row")

        return dashboard
コード例 #29
0
#result = session.query(allweapons).filter(allweapons.name == "Face Smasher")
#for row in result:
#     print(row.bid)
#----The following section plots historical trends for a given input item.----
external_stylesheets = ["https://codepen.io/chriddyp/pen/bWLwgP.css"]

app = dash.Dash(__name__, external_stylesheets=external_stylesheets)
colors = {'background': '#111111', 'text': '#c7465d'}
app.layout = html.Div(children=[
    html.H1(children='WoW Auction Intelligence',
            style={
                'textAlign': 'center',
                'color': colors['text']
            }),
    html.Label('Select character level'),
    daq.NumericInput(id='levelselection', min=0, max=110, value=20),
    html.Label('Select Item Class'),
    dcc.Dropdown(id='demodropdown', options=options_class, value=2),
    html.Label('Select Your Realm'),
    dcc.Dropdown(id='serverdropdown', options=options, value='Hellfire'),
    html.Label('Select Your Class'),
    dcc.Dropdown(id='classselection',
                 options=[{
                     'label': 'Mage',
                     'value': 'Mage'
                 }, {
                     'label': 'Priest',
                     'value': 'Priest'
                 }, {
                     'label': 'Warlock',
                     'value': 'Warlock'
コード例 #30
0
            min = 55,
            max = 230,
            step = 1,
            value = 130,
            marks = {'55': '55','75':'75','100': '100', '125': '125', '150': '150', '175': '175', '200':'200',
                        '230':'230'}),
         html.Br(),
         html.P('130', id='weight-selected-slider'),

         html.Br(),

        #year
        html.P('Year of Olympics: ',style={'display':'inline-block'}),
        daq.NumericInput(id='Year',
        value = 2000,
        min = 1896,
        max = 2016,
        style={'display':'inline-block'}),
        
        #season
         dcc.Markdown('Season'),
         dcc.Dropdown(
            id = 'Season',
            options = [
                {'label': 'Winter', 'value': 'Winter'},
                {'label': 'Summer', 'value': 'Summer'},
            ],
            className = 'mb-5',
            value = 'Summer',
            placeholder='Select a season'