def set_chartDiv(df): """ Returns lineChart layout Inputs - dataframe=df """ countries = df.country.unique() return dbc.Col(width=12, children= [ html.Article(className='card', children= [ html.Div(className='card-header',#html.H2('Life Expectancy,'), children=[ html.Div([ dcc.Dropdown( id='countries-dropdown', options=[{'label': c, 'value': c} for c in countries], multi=True, value=['United States','France','Japan'], placeholder="Add a Country" ) ]) ]), html.Div(className='card-body text-secondary', children= dcc.Graph( id='line-chart', figure=create_lineChart(df,['United States','France','Japan'])) )] )] )
def get_news(): """ :return: 네이버뉴스 검색 리스트 """ result = gbr.get_naver_news() items = result["items"] link_list = [] from datetime import datetime, timezone, timedelta now = datetime.now(timezone.utc) + timedelta(hours=9) now = datetime.strftime(now, "%Y-%m-%d %H:%M:%S") link_list.append( html.Div(children="뉴스 검색시간:{}".format(now), style={"text-align": "right"})) for i in items: exc_word = [""", "<b>", "</b>"] title = i["title"] description = i["description"] for e in exc_word: title = title.replace(e, "") description = description.replace(e, "") #제목 링크 넣기 link = html.A(title, href=i["originallink"], style={"font-size": "14pt"}) link = html.Li(link) link_list.append(link) # 설명 추가 description = html.Article(description) link_list.append(description) # 공백추가 link_list.append(html.Br()) return link_list
def get_keyindex(color, unit, list_elt): list_elt_display = [] for i, elt in enumerate(list_elt): if i == 0: elt_li = html.Li(children=[elt[0]]) elt_li2 = html.Li(className="big-num", children=[html.H4("{} {}".format(elt[2], unit))]) elt_ul = html.Ul(children=[elt_li, elt_li2]) elt_header = html.Header(children=[elt_ul]) elt_li = html.Li( children=[html.I(className="fa fa-fw fa-calendar-o"), elt[1]]) elt_ul = html.Ul(children=[elt_li]) elt_list = html.Li(className="list", children=[elt_ul]) elt_sections = html.Ul(className="sections", children=[elt_list]) elt_article = html.Article(children=[elt_sections]) list_elt_display += [elt_header, elt_article] else: elt_i2 = html.I(className="fa fa-fw fa-clock-o") elt_li3 = html.Li(children=[elt_i2, elt[0]]) elt_i3 = html.I(className=elt[1]) elt_li4 = html.Li(className="big-num", children=[elt_i3, "{} {}".format(elt[2], unit)]) elt_group = html.Ul(className="sections", children=[elt_li3, elt_li4]) elt_footer = html.Footer(children=elt_group) list_elt_display += [elt_footer] elt_section = html.Section(className="bubble", style={"background-color": color}, children=list_elt_display) return elt_section
html.Article( className='upperKPI', children=[ html.Div( className='upperKPIFake', children=[ # dcc.Loading( html.Div( className='KPIs', children=[ html.Div(children=[ dcc.Graph(id='kpi-1'), html.Span('Trains prévus') ], className='rond_cercle'), html.Div(children=[ dcc.Graph(id='kpi-2'), html.Span('Trains retardés') ], className='rond_cercle'), html.Div(children=[ dcc.Graph(id='kpi-3'), html.Span('Trains annulés') ], className='rond_cercle'), html.Div(children=[ dcc.Graph(id='kpi-4'), html.Span('Retard moyen (min)') ], className='rond_cercle'), html.Div(children=[ dcc.Graph(id='kpi-5'), html.Span('Retard cumulé (h)') ], className='rond_cercle'), ], # color='crimson', # type="circle", # ), ), html.Div( className='TimeSelector', style={'color': 'crimson'}, children=[ dcc.RangeSlider( id='time-filter', min=min_date, max=max_date, step=1, marks=marks_data, value=min_max_date_value, # color='crimson', ), ], ), ]) ]),
style={'backgroundColor': "#1a2d46"}, children=[ #left column html.Div( [ html.Div( [ html.H1(children='Company Statistics', style={ 'textAlign': 'center', 'color': 'white', 'fontSize': 24 }), html.Article(id='a1', children='Company Name: ', style={ 'color': 'white', 'fontSize': 16 }), html.Article(id='a2', children='Sector: ', style={ 'color': 'white', 'fontSize': 16 }), html.Article(id='a3', children='Market Cap: ', style={ 'color': 'white', 'fontSize': 16 }), html.Article(id='a6',
'color': '#DCDCDC', 'margin-top': '2vh', 'margin-bottom': '3vh' }, children=["Dashboard"]), html.Section(style={ 'height': '70vh', 'display': 'flex', 'justify-content': 'space-around' }, children=[ html.Article(style={ 'backgroundColor': '#181B1E', 'height': '70vh', 'width': '66vw', 'padding-top': '1.2vh', 'border-radius': '15px' }, children=[ dcc.Graph(figure=fig), ]), html.Article(style={ 'backgroundColor': '#212529', 'height': '70vh', 'width': '30vw' }, children=[ html.Div(style={ 'backgroundColor': '#181B1E', 'height': '33vh', 'width': '30vw', 'border-radius': '15px'
def genResult(src, user, iframe, **kwargs): tabs = html.Div([ html.Div('', className='tile is-3'), html.Div([ html.Div([ html.Ul([ html.Li( [ html.A('视频词云'), ], className='is-active', id='tabsCloud', ), html.Li([ html.A('短文本主题建模'), ], id='tabsLDA'), html.Li([ html.A('文章统计', ), ], id='tabsOther'), ]) ], className='tabs is-centered is-medium', style={'width': '100%'}), ], className='tile is-6') ], className='tile is-ancestor', style={'marginBottom': '1rem'}) # tabs = html.Div([ # html.Ul([ # html.Li([ # html.A('视频词云'), # ], className='is-active', id='tabsCloud', ), # html.Li([ # html.A('LDA主题分析'), # ], id='tabsLDA'), # html.Li([ # html.A('文章统计', ), # ],id='tabsOther'), # ]) # ], className='tabs is-centered is-medium', style={'margin': '0 25% 2rem 25%'}), tabsColud = html.Div([ html.Img(src=src, className='', style={ 'max-width': '600px', 'min-width': '300px' }), ], className='wcImg', id='userWC'), tabsLDA = html.Div([ html.Iframe(src=iframe, style={ 'height': '130vh', 'width': '100%', 'overflow': 'hidden' }), ], className='wcImg', id='userLDA', style={'display': 'none'}), tabsOther = html.Div([ html.Div(genTongji(**kwargs), style={'width': '100%'}), ], className='', id='userOther', style={ 'display': 'none', 'width': '100%' }), userInfo = html.Div([ html.Div('', className='tile is-3'), html.Div([ html.Div([ html.Article([ html.Figure([ html.P([html.Img(src=user.avatar)], className='image is-64x64') ], className='media-left'), html.Div([ html.Div([ html.P([ html.Strong(user.nickname, id='recordNickName'), html.Small(' | ' + user.user_id, style={'whiteSpace': 'pre'}), html.P(user.user_id, style={'display': 'none'}, id='recordUserId'), html.Br(), html.Div(user.signature) ]) ], className='content'), html.Div([ html.Div([ html.Div([ html.Span('作品: ', style={'whiteSpace': 'pre'}), html.Span( format(user.aweme_count, ',') if user. aweme_count else '未知'), ], className='level-item'), html.Div([ html.Span('获赞: ', style={'whiteSpace': 'pre'}), html.Span( format(user.total_favorited, ',') if user.total_favorited else '未知'), ], className='level-item'), html.Div([ html.Span('粉丝: ', style={'whiteSpace': 'pre'}), html.Span( format(user.aweme_fans, ',') if user. aweme_fans else '未知'), ], className='level-item'), ], className='level-left') ], className='level is-mobile') ], className='media-content'), html.Div([ html.Button( '相似用户', className='button is-primary is-outlined is-small', id='searchSimalar') ], className='media-right') ], className='media'), ], className='box', style={'width': '100%'}), ], className='tile is-6 search_input') ], className='tile is-ancestor', style={'marginBottom': '1rem'}), fig = [userInfo, tabs, tabsColud, tabsLDA, tabsOther] return fig
html.Div(className = "text-center p-3 mb-2",children = [ html.Blockquote(className = "blockquote text-center",children = [ html.P(className = "mb-0", children = """A mutual fund can do for you what you would do for yourself if you had sufficient time, training and money to diversify, plus the temperament to stand back from your money and make rational decisions. """), html.Br(), html.Footer(className = "blockquote-footer", children="Venita VanCaspel") ]) ]), html.Div(className = "text-center d-inline", children = [ html.Article(children = [ html.H3(className = "p-3",children = "INTERESTED MUTUAL FUNDS"), html.Article(className = "p-3 d-inline",children =[ html.P(className = "p-3 mb-0 d-inline",children =" Edelweiss Balanced Advantage Fund "), html.P(className = "m-3 mb-1 d-inline",children =" ICICI Pru Balanced Advantage Fund "), html.P(className = "m-3 d-inline",children =" ICICI Savings Fund "), html.P(className = "m-3 d-inline",children =" Kotak Low Duration Fund "), html.P(className = "m-3 d-inline",children =" Tata Balanced Adv Fund "), ] ) ]), html.Div(className = "p-2 text-center",children = [ html.H3(className = "display-4 p-4", children = "Equal Allocation Portfolio Curve"), html.Label(htmlFor = "portfolio-daterange",className = "col-sm-2 col", children = ["Please select the ",html.Mark("Date Range :")]), dcc.DatePickerRange( id='portfolio-daterange', min_date_allowed=date(2003,1,1), max_date_allowed=date(2021, 1, 1), start_date=date(2015,1,1), end_date=date(2021, 1, 1)
html.Li(children=[ html.A(children="Semantische Analysen", href="http://127.0.0.1:8050/") ]), html.Li( children=[html.A(children="Themen-Recherche", href="#")]), html.Li(children=[ html.A(children="Vorgeschlagene Themen", href="#") ]) ]) ]) ]), html.Article(children=[ html.H1(children="Semantische Analysen"), html.Label("Suchbegriff - Term"), dcc.Input(id="term", type="text", value=""), html.Div(children=[], id="some", style={"display": "none"}), html.Button(value="Suchen", id="submit") ]) ]) @app.callback(Output("some", "children"), [Input("submit", "n_clicks")], state=[State("term", "value")]) def run_analysis(n_clicks, term): save_term(term) twitterapi = TwitterAPI(config["customer_key"], config["customer_secret"], config["access_token"], config["access_token_secret"]) tweets = twitterapi.get_tweets("Trump", 2, lang="de") print(tweets)
html.Div([ html.Article( [ 'Welcome to our Dashboard!' + '\n' + 'Use the indicator choice to select one of the' + '\n' + 'variables that you want to analyse. This drop-down' + '\n' + 'will change all of the graphs bellow, expect for the' + '\n' + 'choropleth.With the slider, you can change the year for' + '\n' + 'the choropleth. Also, you can choose the projection' + '\n' + 'that best fits your needs. In order to check' + '\n' + 'the top 5 and the bottom 5 countries for the indicator' + '\n' + 'chosen per continent, choose the continent desired' + '\n' + 'in the ‘Continent Choice’. For the line plot, in the' + '\n' + 'bottom of the dash, choose the countries which' + '\n' + 'you want to observe the evolution for the choosen' + '\n' + 'indicator.' + '\n' ], style={ 'font-family': "Verdana,verdana,sans-serif", 'color': '#f6f6f6', 'font-size': 20 }), html.Br(),
# Data display UI html.Div( className='tile', children=[ html.Div( className='tile is-parent', children=[ html.Article( className= 'tile is-child notification is-dark', children=[ html. P(className='title', children=[ "Region Selection" ]), "NREL Region", dcc.Dropdown( id="lbnl-dropdown", options=[{ "label": i, "value": i } for i in Regions ], value='CONUS') ]) ]) ]), # Filters UI html.Div( className='tile', children=[ html.Div(
options=dict(height='{}px'.format(MAP_HEIGHT), width='{}px'.format(MAP_WIDTH), physics={'enabled': False})) ], style={ 'width': '80%', 'float': 'right', 'border-style': 'solid', 'border-width': "0.2px" }) ]), html.Div([ html.H4(' ', style={'clear': 'both'}), html.Article('Undeliverable', style={ 'margin-top': 50, 'font-size': '16pt', 'font-weight': 'bold' }), dte.DataTable(rows=[{ 'ID': ' ', 'old_route': ' ' }], row_selectable=False, editable=False, filterable=True, sortable=True, id='undeliverable-data'), html.Article('Delivered', style={ 'margin-top': 50, 'font-size': '16pt',
# ########################################################## layout = html.Div([ nav_2, html.H2(id='test', children=["L'analyse et au traitement des données."]), html.Section( id='contenu_1', children=[ html.Section( id="block_1", children=[ html.Article(id="article_1_block_1", children=[ html.Div(id='WordCloud', children=[ dcc.Graph(figure=fig_histo, id='table') ]) ]), html.Article( id="article_2_block_1", children=[ dash_table.DataTable( id='table', columns=[{ 'id': c, 'name': c } for c in dft_2.columns], data=dft_2.to_dict('records'), #Style table as list view #style_as_list_view=True,
html.Article( id='left_selector', children=[ ## Data Selector html.H3('Select a DataSet'), dcc.Dropdown( id='DataSet_dropdown', options=[ { 'label': 'First one : Kaggle', 'value': 'Emotion_final.csv' }, { 'label': 'Second one : Data.word', 'value': 'text_emotion.csv' }, ], optionHeight=60, value='Emotion_final.csv', clearable=False, ), ## Model Selector html.H3('Select a model'), dcc.RadioItems( id='solver_radio', options=[ { 'label': 'Stochastic Gradiant Decent', 'value': 0 }, { 'label': 'Linear SVM', 'value': 1 }, { 'label': 'Logistic Regression', 'value': 2 }, { 'label': 'Decision Tree', 'value': 3 }, { 'label': 'Complément NB', 'value': 4 }, ], value=0, ), ]),
id="main", children=[ # AirBnB in New York city's map html.Article( id="airbnb-map", children=[ html.Div( className="heading-name", children=[ html. H4(className="section-title", children="I. Map of AirBnB in New York City" ), ]), html.Div(className="map-container", children=[ html.P(id="airbnb-num"), dcc.Slider(id='year-slider', min=int(years[0]), max=int(years[-1]), value=int(years[-1]), marks=years_dict, included=False), dcc.Graph(id="map-graph", ) ]) ]), # First plot visualization html.Article( id="price-distribution",
children=[ html.Article(children=[ html.Br(), html.H3('Selection du jeu de données'), html.Br(), dcc.Dropdown( id='DataSet_dropdown', options=[ { 'label': '1er jeu de données : Kaggle', 'value': 'Emotion_final.csv' }, { 'label': '2em jeu de données: Data.word', 'value': 'text_emotion.csv' }, ], optionHeight=60, value='Emotion_final.csv', clearable=False, ), html.Br(), html.H3('Selection des émotions'), html.Br(), dcc.RadioItems(id='Emotion_radio'), html.Br(), html.H3('Histogramme des Emotions'), ## Fig 1 : Hist des Emotions dcc.Graph(id='Hist_emotions'), ]), ]),
import dash import dash_html_components as html import dash_core_components as dcc import pandas as pd import dash_table df = pd.read_csv("clean_diabetes.csv") app = dash.Dash(__name__) app.layout = html.Div(children=[ html.Header("Hello and welcome to my CSS Bootstrap Dash Test"), html.H1("My Name is Marina"), html.Div( html.Article( "lorem ipsumd blakshd alkjwehaiwuehasjbc aasdhfiauhwejbgdhc"), html.Article(df.head())) ]) if __name__ == "__main__": app.run_server(debug=True)
dcc.Graph( id='example-graph-1-1', figure=scat_matrix_lay1 ), html.Br(), dcc.Graph( id='example-graph-1-1', figure=scat_matrix2_lay1 ), ]), html.Article(style={'padding-left':'5vw','display':'flex','width':'20vw'}, children=[ html.Div([ dbc.Button("Back to head", color="primary",href="/apps/page1" ,id="loading-button"), dbc.Spinner(html.Div(id="loading-output"))] ), html.Div(style={'margin-left':'0.5vw'}, children=[ dbc.Button("Back to home", color="primary",href="/" ,id="loading-button"), dbc.Spinner(html.Div(id="loading-output")) ]) ]) ]) #-----------------------------------------------------------------------------------------------------------------------------------------# # LAYOUT TWO # #-----------------------------------------------------------------------------------------------------------------------------------------# df1 = pd.read_csv('../data/emotion_final.csv') df1 layout2 = html.Div( style={'height': '320vh','color':'white','backgroundImage': 'url(../assets/pexels-jessica-lewis-583846.jpg)','background-attachment':'fixed'}, children=[
html.Article( style={ 'display': 'flex', 'justify-content': 'space-around', 'margin-top': '9vh', 'margin-bottom': '8vh' }, children=[ html.Div( style={ 'height': '40vh', 'width': '23vw' }, children=[ html.P(style={ 'text-align': 'center', 'color': '#DCDCDC', }, children=[ 'Cercle des corrélations F1 et F2' ]), html.Img( src=app.get_asset_url('../assets/F1.png'), style={ 'height': '40vh', 'width': '23vw' }) ]), html.Div(style={ 'height': '40vh', 'width': '23vw' }, children=[ html.P( style={ 'text-align': 'center', 'color': '#DCDCDC', }, children=[ 'Cercle des corrélations F3 et F4' ]), html.Img(src=app.get_asset_url( '../assets/F3-F4.png'), style={ 'height': '40vh', 'width': '23vw' }) ]), html.Div(style={ 'height': '40vh', 'width': '23vw' }, children=[ html.P( style={ 'text-align': 'center', 'color': '#DCDCDC', }, children=[ 'Cercle des corrélations F5 et F6' ]), html.Img(src=app.get_asset_url( '../assets/F5-F6.png'), style={ 'height': '40vh', 'width': '23vw' }) ]), html.Div(style={ 'height': '40vh', 'width': '23vw', }, children=[ html.P( style={ 'text-align': 'center', 'color': '#DCDCDC', }, children=[ 'Cercle des corrélations F7 et F8' ]), html.Img(src=app.get_asset_url( '../assets/F7-F8.png'), style={ 'height': '40vh', 'width': '23vw' }) ]), ]),
className='row'), html.Div([ html.Div([dcc.Graph(figure=figura_pie)], className='five columns'), html.Div([dcc.Graph(figure=figura_lineas)], className='seven columns') ], className='row'), html.Div([ html.Div(html.Article([ html.H2('A Word on the Recent Catnip Doping Scandal'), html.P("The influence that catnip has on feline behavior " "is well-documented, and its use as an herbal " "supplement in competitive ninja circles remains " "controversial. Once again, the debate to ban the " "substance is brought to the public's attention " "after the high-profile win of Kittytron, a " "long-time proponent and user of the green stuff, " "at the Claw of Fury tournament."), html.P("As I've stated in the past, I firmly believe a " "true ninja's skills must come from within, with " "no external influences. My own catnip use shall " "continue as purely recreational.") ]), className='six columns'), html.Div([dcc.Graph(figure=fig_mapa_densidad)], className='six columns') ], className='row') ], className='grid', id='grid')
'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)
slides.append(slide6) slides.append(slide7) slides.append(slide8) slides.append(slide9) slides.append(slide10) slides.append(slide11) #################################################### ### DASH LAYOUT ### #################################################### # Set the Dash layout using the slides designed above app.layout = html.Div([ html.Main( role='main', children=[html.Article(slides, id="webslides", className='vertical')]), gdc.Import(src="/static/renderWebSlides.js") ]) #################################################### ### VISUALIZATION CALLBACKS ### #################################################### ################################ ## Descentralized Callbacks ## ################################ @app.callback(dash.dependencies.Output('vpm_treemap', 'figure'), [dash.dependencies.Input('date_slider', 'value')]) def update_vpm_treemap(date):
html.P("TEAM 79 FOUNDATION", className="header__team"), "ANALYZING CRIME TRENDS IN COLOMBIA" ]), html.Section( className="context", children=[ html.Div(className="title_co", children=["GENERAL CONTEXT"]), html.Article( className="context__row", children=[ html.Div(className="context__col", children=[ html.Img( src="./assets/images/datafolio/img1t.png") ]), html.Div( className="context__col", children=[ html.P(children=[ html.Span(className="blue", children=["Crime and violence "]), "are the main concerns of all citizens around the world and generates impacts on our society and exception." ]) ]) ]), html.Article( className="context__row", children=[ html.Div( className="context__col", children=[ html.P(children=[
html.Tbody(id='main_block',children=[ html.Div(id='Block_left', children=[ html.Article(id='left_selector',children=[ ## Data Selector html.H3('Select a DataSet'), dcc.Dropdown( id='DataSet_dropdown', options=[ {'label': 'First one : Kaggle', 'value': 'Emotion_final.csv'}, {'label': 'Second one : Data.word', 'value': 'text_emotion.csv'}, ], optionHeight= 60, value='Emotion_final.csv', clearable=False, ), ## Emotion selector html.H3('Select an emotion'), dcc.RadioItems( id='Emotion_radio' ), html.H3('Emotions histogram'), ## Fig 1 : Histigramme Emotions dcc.Graph( id='Hist_emotions' ), ]), ]), html.Div(id='Block_right', children=[