def layout(self):
mathjax_script = dji.Import(
src=
"https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-AMS-MML_SVG"
)
refresh_plots = dji.Import(
src="https://www.spectrochempy.fr/gui/redraw.js")
layout = html.Div([
html.P(""),
dbc.Container(
children=[
dbc.Row(
[self.tabs_zone(), self.graph_zone()], ),
],
fluid=True,
style={
"font-size": '10pt',
'height': '80vh'
},
),
refresh_plots,
mathjax_script,
], )
return layout
def gen_page(run_id, gcvb_id):
computation_dir = "./results/{}".format(str(gcvb_id))
run_id, gcvb_id = db.get_last_run()
data = data_preparation(run_id)
layout = dbc.Container([
dji.Import(src="/assets/sortable.js"),
html.H1("Run"),
Table(data, run_id, data.keys()),
])
return layout
def get_layout():
nav_items = current_user.get_page_nav_items()
return [
html.Div(
[
# create navigation layout
navigation.get_layout(nav_items),
dbc.Container(children=[
header.get_layout(),
control.get_layout(),
dbc.Row(children=[
dcc.Location(id='dashboard_url', refresh=False),
content.get_layout(),
dbc.Col(className='col-3 d-none d-xl-block')
])
],
fluid=True,
className='content')
],
className='wrapper'),
html.Div(id='overlay'),
dji.Import(src='/assets/js/scripts.js')
]
href='/portfolio',
), ),
dbc.NavItem(
dbc.NavLink(
'Individual Security Dashboard',
href='/single',
), ),
],
brand='Risk Dash',
brand_href='/',
color='light',
id='nav'),
dbc.Container(id='page_content', fluid=True),
html.Div(dt.DataTable(data=[{}]), style={'display': 'none'}),
dji.Import(
src=
"https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-AMS-MML_SVG"
)
],
fluid=True)
@app.callback(Output('page_content', 'children'), [Input('url', 'pathname')])
def get_layout(url):
if url != None:
if url == '/portfolio':
return (portfolio_metrics.layout)
elif url == '/single':
return (single_ticker.layout)
elif url == '/docs':
return (dcc.Markdown(docs))
else:
# notice and full license details.
#
import threading
import base64
import io
import os
import csv
import pandas as pd
import dash_defer_js_import as dji # For mathjax
import dash_bootstrap_components as dbc
import dash_html_components as html
# Import the mathjax
mathjax_script = dji.Import(
src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js'
'?config=TeX-AMS-MML_SVG')
# Write the mathjax index html
# https://chrisvoncsefalvay.com/2020/07/25/dash-latex/
index_str_math = """<!DOCTYPE html>
<html>
<head>
{%metas%}
<title>{%title%}</title>
{%favicon%}
{%css%}
</head>
<body>
{%app_entry%}
<footer>
'flex': '20%',
'border': 'solid 1px gray'
})
],
style={
'display': 'flex',
'width': '90%'
})
])
structure.extend(info_section)
#print(structure)
app.layout = html.Div(structure +
[html.Article(dji.Import(src="/static/script.js"))])
slider_inputs = [
Input({
'type': 'dynslider',
'index': f + '--slider'
}, 'value') for f in features
]
inputs = [Input('xaxis-column', 'value')]
inputs.extend(slider_inputs)
@app.callback(Output('indicator-graphic', 'figure'), inputs)
def update_graph(x_col, *values):
values = list(values)
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [ ['$','$'],],
processEscapes: true
}
});
</script>
{%renderer%}
</footer>
</body>
</html>
'''
###### important for latex ######
axis_latex_script = dji.Import(
src="https://codepen.io/yueyericardo/pen/pojyvgZ.js")
mathjax_script = dji.Import(
src=
"https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-AMS-MML_SVG"
)
""" Data sources, Wrangling
"""
### Fetching Data ###
kaggle_snap_worldwide = pd.read_csv('utils/Data/kaggle_train.csv')
kaggle_snap_worldwide.rename(columns={
'Country_Region': 'Country/Region',
'Province_State': 'Province/State'
},
inplace=True)
# showgrid=False, zeroline=False
)
fig.update_layout(height=600, legend={'traceorder': 'normal'}, paper_bgcolor='rgba(0,0,0,0)',
# plot_bgcolor='rgba(0,0,0,0)'
)
return fig
#####################################################################
# Layout
def empty_space(h=50):
return html.Div([html.Br()], style={'min-height': '{}px'.format(h)})
my_script = dji.Import(src="http://simuc.chem.ufl.edu/static/dash/redraw.js")
mathjax_script = dji.Import(src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-AMS-MML_SVG")
# fig1
fig1 = dcc.Graph(figure=getfig1(), id="fig1")
sliders1_1 = html.Div([
html.Label('$P_1$ (atm): Initial Pressure'),
dcc.Slider(id='p1_slider', min=2.5, max=5.0, value=3, marks={str(x): str(x) for x in np.arange(2.5, 5.5, 0.5)}, step=0.5),
html.Label('$V_1$ (L): Initial Volume'),
dcc.Slider(id='v1_slider', min=10, max=15, value=12, marks={str(x): str(x) for x in np.arange(10, 16, 1)}, step=1),
html.Label('$\gamma$: Heat capacity ratio'),
dcc.Slider(id='gamma_slider', min=1.1, max=1.6, value=1.6, marks={x: '{:.1f}'.format(x) for x in np.arange(1.1, 1.7, 0.1)}, step=None),
], style={'columnCount': 3, 'padding': '0'})
sliders1_2 = html.Div([
html.Label('$P_2$ (atm): Pressure after Stage1'),
dcc.Slider(id='p2_slider', min=1.2, max=2.2, value=1.6, marks={x: '{:.1f}'.format(x) for x in np.arange(1.0, 2.3, 0.2)}, step=None),
external_scripts = [
'https://code.jquery.com/jquery-3.4.1.min.js',
'https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js'
]
app = dash.Dash(
__name__,
external_stylesheets = external_stylesheets,
external_scripts = external_scripts,
assets_ignore = '.*ignored.*')
app.layout = html.Div([
html.Div(id = 'carousel', className = 'carousel', children = faceImages),
html.Div(id = 'my-div', style = {'textAlign': 'center'}),
dji.Import(src = "assets/ignored.js")
])
@app.callback(Output('my-div', 'children'), faceImagesCallbacks)
def ShowBestFaces (*args):
ctx = dash.callback_context
if all(i == None for i in list(args)):
return(html.Div('Click a face to begin...', style = {'fontWeight': 'bold'}))
else:
selectedFace = ctx.triggered[0]['prop_id'].split('.')[0]
lastSpace = selectedFace.rfind(' ')
selectedFace = selectedFace[:lastSpace] + '.' + selectedFace[lastSpace+1:]
selectedFaceProps = selectedFace[:2]
def get_layout(pathname):
dr, oid, is_short = parse_pathname(pathname)
try:
find_ztf_oid.find(oid, dr)
except NotFound:
return html.H1('404')
other_drs = [other_dr for other_dr in available_drs if other_dr != dr]
ra, dec = find_ztf_oid.get_coord(oid, dr)
coord = find_ztf_oid.get_coord_string(oid, dr)
short_min_mjd, short_max_mjd = min_max_mjd_short(dr)
min_mjd, max_mjd = (short_min_mjd, short_max_mjd) if is_short else (-INF,
INF)
try:
features = light_curve_features(oid,
dr,
min_mjd=min_mjd,
max_mjd=max_mjd)
except NotFound:
features = None
layout = html.Div([
html.Div('', id='placeholder', style={'display': 'none'}),
html.Div(f'{oid}', id='oid', style={'display': 'none'}),
html.Div(f'{dr}', id='dr', style={'display': 'none'}),
html.Div(min_mjd, id='min-mjd', style={'display': 'none'}),
html.Div(max_mjd, id='max-mjd', style={'display': 'none'}),
html.H2(id='title'),
html.Div(id='akb-neighbours'),
html.Div(set_akb_info(0, oid), id='akb-info'),
html.Div(
[
dcc.Checklist(
id='light-curve-time-interval',
options=[
{
'label':
f'"Short" light curve: {short_min_mjd} ≤ MJD ≤ {short_max_mjd}',
'value': 'short'
},
],
value=['short'] if is_short else [],
style={
'display':
'none' if short_min_mjd == -INF
and short_max_mjd == INF else 'block'
},
),
dcc.RadioItems(
options=[
{
'label': 'Full light curve',
'value': 'full'
},
{
'label': 'Folded light curve',
'value': 'folded'
},
],
value='full',
labelStyle={
'display': 'inline-block',
'margin-right': '2em'
},
id='light-curve-type',
),
html.Div([
html.Div(
[
dcc.Input(
value=features['period_0']
if features is not None else None,
id='fold-period',
placeholder='Period, days',
type='number',
),
' period, days',
],
style={
'width': '40%',
'display': 'inline-block',
},
),
html.Div(
[
dcc.Slider(
value=0.0,
id='fold-zero-phase',
min=0.0,
max=1.0,
step=1e-3,
marks={
x: f'{x:.1f}'
for x in np.linspace(0, 1, 11)
},
),
],
style={
'width': '60%',
'display': 'inline-block',
'vertical-align': 'bottom'
},
),
],
id='fold-period-layout',
style={
'display': 'none',
}),
dcc.Graph(
id='graph',
config={
'toImageButtonOptions': {
'filename': str(oid)
},
'displaylogo': False,
},
),
html.Div([
'Download ',
html.A('PNG',
href=f'/{dr}/figure/{oid}?format=png',
id='figure-png-link'),
', ',
html.A('PDF',
href=f'/{dr}/figure/{oid}?format=pdf',
id='figure-pdf-link'),
])
],
id='graph-layout',
style={
'width': '70%',
'display': 'inline-block'
},
),
html.Div(
[
html.Div(className='JS9', id='JS9'),
dji.Import(src="/static/js/js9_helper.js"),
html.Div(id='fits-to-show'),
],
style={
'width': '20%',
'display': 'inline-block',
'vertical-align': 'top'
},
),
html.Div(
[
html.Div(
[
html.Div(
[
html.H2('Summary'),
html.Div(id='summary'),
],
id='summary-layout',
),
html.Div(
[
html.H2('Neighbours'),
html.Div(
[
html.H4(
'Different passband, same field'),
dcc.Input(
value='1',
id='different_filter_radius',
placeholder='Search radius, arcsec',
type='number',
step='0.1',
min='0',
max='60',
),
' search radius, arcsec',
html.Div(
id='different_filter_neighbours'),
],
style={
'width': '45%',
'display': 'inline-block'
},
),
html.Div(
[
html.H4('Different field'),
dcc.Input(
value='1',
id='different_field_radius',
placeholder='Search radius, arcsec',
type='number',
step='0.1',
min='0',
max='60',
),
' search radius, arcsec',
html.Div(
id='different_field_neighbours'),
],
style={
'width': '45%',
'display': 'inline-block'
},
),
],
id='neighbours-layout',
),
html.Div(
[
html.H2('Metadata'),
html.Div(id='metadata'),
],
id='metadata-layout',
),
],
id='neighbours-metadata-layout',
style={
'width': '70%',
'display': 'inline-block'
},
),
html.Div(
[
html.H2(
html.
A('Aladin',
href=
f'//aladin.u-strasbg.fr/AladinLite/?target={coord}'
)),
set_div_for_aladin(oid, dr),
html.Div(
id='aladin-lite-div',
style={
'width': '450px',
'height': '450px'
},
),
dji.Import(src="/static/js/aladin_helper.js"),
],
style={
'width': '20%',
'display': 'inline-block',
'vertical-align': 'top'
},
id='aladin-layout',
),
],
id='neighbours-metadata-aladin-layout',
),
html.H3([
'Same object in ',
] + list(
joiner(', ', (html.A(dr.upper(), href=f'/{dr}/view/{oid}')
for dr in other_drs)))),
html.Div(
[
html.H2('GCVS'),
dcc.Input(
value='10',
id=dict(type='search-radius', index='gcvs'),
placeholder='Search radius, arcsec',
type='number',
),
' search radius, arcsec',
html.Div(id='gcvs-table'),
],
id='gcvs',
),
html.Div(
[
html.H2('VSX'),
dcc.Input(
value='10',
id=dict(type='search-radius', index='vsx'),
placeholder='Search radius, arcsec',
type='number',
),
' search radius, arcsec',
html.Div(id='vsx-table'),
],
id='vsx',
),
html.Div(
[
html.H2('ATLAS'),
dcc.Input(
value='10',
id=dict(type='search-radius', index='atlas'),
placeholder='Search radius, arcsec',
type='number',
),
' search radius, arcsec',
html.Div(id='atlas-table'),
],
id='atlas',
),
html.Div(
[
html.H2('ZTF Catalog of Periodic Variable Stars'),
dcc.Input(
value='1',
id=dict(type='search-radius', index='ztf-periodic'),
placeholder='Search radius, arcsec',
type='number',
min='0.1',
max='3600',
step='0.1',
),
' search radius, arcsec',
html.Div(id='ztf-periodic-table'),
],
id='ztf-periodic',
),
html.Div(
[
html.H2('Transient Name Server'),
dcc.Input(
value='5',
id=dict(type='search-radius',
index='transient-name-server'),
placeholder='Search radius, arcsec',
type='number',
step='1',
),
' search radius, arcsec',
html.Div(id='transient-name-server-table'),
],
id='transient-name-server',
),
html.Div(
[
html.H2('Astrocats'),
dcc.Input(
value='5',
id=dict(type='search-radius', index='astrocats'),
placeholder='Search radius, arcsec',
type='number',
step='1',
),
' search radius, arcsec',
html.Div(id='astrocats-table'),
],
id='astrocats',
),
html.Div(
[
html.H2('OGLE-III'),
dcc.Input(value='10',
id=dict(type='search-radius', index='ogle'),
placeholder='Search radius, arcsec',
type='number',
min='0.1',
max='323999'),
' search radius, arcsec',
html.Div(id='ogle-table'),
],
id='ogle',
),
html.Div(
[
html.H2('Simbad'),
dcc.Input(
value='50',
id=dict(type='search-radius', index='simbad'),
placeholder='Search radius, arcsec',
type='number',
),
' search radius, arcsec',
html.Div(id='simbad-table'),
],
id='simbad',
),
html.Div(
[
html.H2('Gaia EDR3 Distances'),
dcc.Input(
value='1',
id=dict(type='search-radius', index='gaia-edr3-distances'),
placeholder='Search radius, arcsec',
type='number',
),
' search radius, arcsec',
html.Div(id='gaia-edr3-distances-table'),
],
id='gaia-edr3-distances',
),
html.Div(
[
html.H2('ALeRCE'),
dcc.Input(
value='1',
id=dict(type='search-radius', index='alerce'),
placeholder='Search radius, arcsec',
type='number',
),
' search radius, arcsec',
html.Div(id='alerce-table'),
],
id='alerce',
),
html.Div(
[
html.H2('Vizier'),
html.A('Search on Vizier website within',
id='search-on-vizier',
href=find_vizier.get_search_url(ra, dec, 0)),
' ',
dcc.Input(
value='1',
id='vizier-radius',
placeholder='Search radius, arcsec',
type='number',
step='0.1',
size='3',
),
' arcsec',
html.Button(
'Show',
id='vizier-button',
n_clicks=0,
style={'display': 'none'},
),
html.Div(id='vizier-list'),
],
id='vizier',
),
html.Div(
[
html.H2('Features'),
html.Div(id='features-list'),
],
id='features',
),
html.H2(
[
'Download light curve: ',
html.A('CSV', href=f'/{dr}/csv/{oid}'),
', ',
html.A('JSON', href=find_ztf_oid.json_url(oid, dr)),
],
id='download-lc',
),
html.Div(
[
html.H2('Light curve'),
DataTable(
id='light-curve-table',
columns=[{
'name': column,
'id': column
} for column in LIGHT_CURVE_TABLE_COLUMNS],
),
],
id='light-curve',
style={'width': '75%'},
),
])
return layout
import dash_defer_js_import
import dash
from dash.dependencies import Input, Output
import dash_html_components as html
app = dash.Dash(__name__)
app.scripts.config.serve_locally = True
app.css.config.serve_locally = True
app.layout = html.Div([
dash_defer_js_import.Import(
id='jsimport', src='https://codepen.io/akronix/pen/pVqzLZ.js'),
html.Div(id='output')
])
@app.callback(Output('output', 'children'), [Input('jsimport', 'src')])
def display_output(src):
return '''
Nothing to see here as this component doesn't render anything.
But checkout your console, it should show output of {src} being imported
'''.format(src=src)
if __name__ == '__main__':
app.run_server(debug=True)