def second_layer(self):
left_col = html.Div([
create_paragraph(METRIC_TEXTS['third_layer']['heading'],
METRIC_TEXTS['third_layer']['detail']),
html.Div([
dcc.Graph(
figure=line_plot(self.data_object.lol_dict, \
ylabel='Loss of Life - DTs (%)')
)
])
],className="col")
right_col = html.Div([
create_paragraph(METRIC_TEXTS['fourth_layer']['heading'],
METRIC_TEXTS['fourth_layer']['detail']),
html.Div([
dcc.Graph(
figure=line_plot(self.data_object.og_dict, \
ylabel='Ovegeneration (kWh)')
)
])
],className="col")
return html.Div([left_col,right_col],className="row margin-top-20")
def first_layer(self):
left_col = html.Div([
create_paragraph(METRIC_TEXTS['first_layer']['heading'],
METRIC_TEXTS['first_layer']['detail']),
html.Div([
dcc.Graph(
figure=line_plot(self.data_object.violation_dict, \
ylabel='Risk Metric (%)')
)
])
],className="col")
right_col = html.Div([
create_paragraph(METRIC_TEXTS['second_layer']['heading'],
METRIC_TEXTS['second_layer']['detail']),
html.Div([
dcc.Graph(
figure=line_plot(self.data_object.eff_dict, \
ylabel='Efficiency (%)')
)
])
],className="col")
return html.Div([left_col,right_col],className="row margin-top-20")
def first_row(self):
col = html.Div([html.Div([create_paragraph(PROFILE_TEXTS['first_layer']['heading'],
PROFILE_TEXTS['first_layer']['detail'])]),
html.Div([
html.Div([
html.H6('Select PV penetration (in %)'),
dcc.Slider(id='pv',
min=0,
max=100,
value=0,
marks={i: '{}%'.format(i) for i in range(0, 100, 10)},className='h2'),\
dcc.Graph(id="load-duration-curve", className='mt-5')], className="DropDown"),
html.Div([
html.H6('Select a day to show load profile:'),
dcc.DatePickerSingle(
id='date-picker-single',
date=str(dt(self.settings['year'], 1, 1)), className='h2'),
dcc.Graph(id="load-curve",className='mt-3')],
className="DropDown"),
]),
html.Div([
html.Div([html.H6("Important statistics related to load profiles"),
dash_table.DataTable(
id='table',
style_cell={'textAlign': 'left', 'backgroundColor': '#1e2130','color': 'white'},
style_as_list_view=True)], className='DropDown')])
])
return col
def third_layer(self):
return html.Div([
create_paragraph(METRIC_TEXTS['fifth_layer']['heading'],
METRIC_TEXTS['fifth_layer']['detail']),
html.Div([
html.Div([
html.H6("Select System Level Metric"),
dcc.Dropdown(
id="Metric",
options=[{'label': key, 'value': key} for key in
self.data_object.system_metrics],
value=['SARDI_aggregated'],
multi=True,
style={'color': '#000000'})
],className="col DropDown"),
html.Div([
html.H6("Select PV Penetration Scenario"),
dcc.Dropdown(
id="PVScenario",
options=[{'label': key, 'value': key} for key in
self.data_object.pv_scenarios],
value='Base',
style={'color': '#000000'})
], className="col H6 DropDown"),
], className="row"),
html.Div([
dcc.Graph(id="TimeSeriesSystemLevelMetric"+self.unique_tag)
])
])
def third_layer(self):
left_col = html.Div([create_paragraph(PVCONNECTION_TEXTS['third_layer']['first_col']['heading'], \
PVCONNECTION_TEXTS['third_layer']['first_col']['detail']),
html.Div([dcc.Graph(id="voltageBase")]), ], className='col')
middle_col = html.Div([create_paragraph(PVCONNECTION_TEXTS['third_layer']['second_col']['heading'], \
PVCONNECTION_TEXTS['third_layer']['second_col']['detail']),
html.Div([dcc.Graph(id="lineBase")]), ], className='col')
right_col = html.Div([create_paragraph(PVCONNECTION_TEXTS['third_layer']['third_col']['heading'], \
PVCONNECTION_TEXTS['third_layer']['third_col']['detail']),
html.Div([dcc.Graph(id="transformerBase")]), ],
className='col')
return html.Div([left_col, middle_col, right_col], className='row')
def fourth_layer(self):
timestamps = list(self.data_object.system_timeseries_dict['Base']['TimeStamps'])
return html.Div([
create_paragraph(METRIC_TEXTS['sixth_layer']['heading'],
METRIC_TEXTS['sixth_layer']['heading']),
html.Div([
html.Div([
html.H6("Select Asset Level Metric"),
dcc.Dropdown(
id="AssetMetric",
options=[{'label': key, 'value': key} \
for key in self.data_object.asset_metrics],
value='NVRI',
style={'color': '#000000'})
], className="col DropDown"),
html.Div([
html.H6("Select PV Penetration Scenario"), \
dcc.Dropdown(
id="PVScenario2",
options=[{'label': key, 'value': key} \
for key in self.data_object.pv_scenarios],
value='Base',
style={'color': '#000000'})
], className="col H6 DropDown"),
], className="row"),
html.Div([
html.H6("Slide for observing temporal change"), \
daq.Slider(
id="TimeIndex",
min=0,
max=len(timestamps),
value=3,
step=1,
marks={str(val): {'label': timestamps[val].strftime('%m-%d')} \
for val in range(0, len(timestamps), 6)},
size=1100,),
], style={"margin-left": "50px", "margin-right": "10px"}),
html.Div([
dcc.Graph(id="AssetLevelMetricHeatMap"+self.unique_tag)
], style={"margin-top": "30px"}),
])
def second_layer(self):
return html.Div([create_paragraph(PVCONNECTION_TEXTS['second_layer']['heading'], \
PVCONNECTION_TEXTS['second_layer']['detail']),
html.Div([
html.Div([daq.Gauge(id='nvri',
color="#9B51E0",
value=0,
label='Increase in NVRI',
max=100,
min=-100,
showCurrentValue=True)
],className="col"),
html.Div([daq.Gauge(id='cri',
color="#9B51E0",
value=0,
label='Increase in CRI',
max=100, min=-100,
showCurrentValue=True )
], className="col"),
],className="row textwhite")
])
def fifth_layer(self):
return html.Div([
create_paragraph(METRIC_TEXTS['seventh_layer']['heading'],
METRIC_TEXTS['seventh_layer']['heading']),
html.Div([
html.Div([
dash_table.DataTable(
id="interactiveTable"+self.unique_tag,
columns=[],
data=[],
sort_action="native",
column_selectable="single",
sort_mode="multi",
page_action="native",
page_current=0,
page_size=10,
style_header={'backgroundColor': 'rgb(30, 30, 30)', 'fontWeight': 'bold'},
style_cell={'backgroundColor': 'rgb(30, 30, 30)', 'color': 'white'},)
], className="col DropDown"),
html.Div([
dcc.Graph(id="AssetLocation"+self.unique_tag)
], className="col")
], className="row")
])
def first_layer(self):
left_col = html.Div([
create_paragraph(PVCONNECTION_TEXTS['first_layer']['first_col']['heading'], \
PVCONNECTION_TEXTS['first_layer']['first_col']['detail']),
html.Div([html.H5("Enter PV capacity in kW")],className='Paragraph'),
html.Div([dcc.Input(id='PVcap',
placeholder='Enter a value...',
type='number',
value='',
style={"margin-left":"30px"})
],),
html.Div([html.H5("Enter node name for connecting PV")],className='Paragraph'),
html.Div([dcc.Input(id='loadname',
placeholder='Enter a value...',
type='text',
value='',
style={"margin-left":"30px"})
]),
html.Div([html.H5("Enter Phase for new PV (RYB or R or Y or B)")],className='Paragraph'),
html.Div([dcc.Input(id='phase',
placeholder='Enter a value...',
type='text',
value='',
style={"margin-left":"30px"})
]),
html.Div([daq.BooleanSwitch(id="Request",
on=False,
color="#9B51E0",
label="Switch to process request",
style={"font-family": "Times New Roman","margin-top":"20px"})
])
],className="col-4")
middle_col = html.Div([create_paragraph(PVCONNECTION_TEXTS['first_layer']['second_col']['heading'], \
PVCONNECTION_TEXTS['first_layer']['second_col']['detail']),
html.Div([
html.H5("Enter time to begin simulation (HH:MM:SS format)")
], className='Paragraph'),
html.Div([
dcc.Input( id='time',
placeholder='Enter a value...',
type='text',
value='',
style={"margin-left": "30px"})
]),
html.Div([html.H5("Pick a day to start simulation")], className='Paragraph'),
html.Div([
dcc.DatePickerSingle(id="Date",
min_date_allowed=dt(2018, 1, 1),
max_date_allowed=dt(2018, 12, 31),
style={"margin-left": "30px", "height":"20px"})
]),
html.Div([
daq.BooleanSwitch( id="Accept",
on=False,
color="#9B51E0",
label="Switch to accept request",
style={"font-family": "Times New Roman",
"margin-top": "20px"})
]),
html.Div([
daq.BooleanSwitch( id="Delete",
on=False,
color="#9B51E0",
label="Switch to delete PV",
style={"font-family": "Times New Roman",
"margin-top": "20px"})
])
], className="col-4")
self.x_coordinate = [values['x'] for keys, values \
in self.coord_object.cust_xy_dict.items()]
self.y_coordinate = [values['y'] for keys, values \
in self.coord_object.cust_xy_dict.items()]
self.texts = [
keys for keys, values in self.coord_object.cust_xy_dict.items()
]
right_col = html.Div([create_paragraph(PVCONNECTION_TEXTS['first_layer']['third_col']['heading'], \
PVCONNECTION_TEXTS['first_layer']['third_col']['detail']),
html.Div([
dcc.Graph(figure=geo_scatter_map( self.coord_object.x_lines,
self.coord_object.y_lines,
self.x_coordinate,
self.y_coordinate,
self.coord_object.initial_x,
self.coord_object.initial_y,
height=350,
hovertext=self.texts,
hoverinfo='text'))
])
],className="col-4")
return html.Div([left_col, middle_col, right_col], className="row")