Giter Site home page Giter Site logo

coding-with-adam / dash-by-plotly Goto Github PK

View Code? Open in Web Editor NEW
1.4K 1.4K 1.7K 77.41 MB

Interactive data analytics

Home Page: dash-by-plotly.coding-with-adam.vercel.app

Python 63.96% CSS 10.35% JavaScript 0.46% Jupyter Notebook 25.21% HTML 0.02% Procfile 0.01%

dash-by-plotly's People

Contributors

charmingdata avatar coding-with-adam avatar dependabot[bot] avatar heieisch avatar joseguzman avatar mukulsinghal001 avatar mutumagitonga avatar schwabts avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

dash-by-plotly's Issues

AttributeError: FormGroup was deprecated

What should I do about this?

Dash-by-Plotly-Coding-with-Adam/Bootstrap/bootstrap_modal.py:4: UserWarning:
The dash_core_components package is deprecated. Please replace
import dash_core_components as dcc with from dash import dcc
import dash_core_components as dcc
Traceback (most recent call last):
File "Dash-by-Plotly-Coding-with-Adam/Bootstrap/bootstrap_modal.py", line 22, in
dbc.FormGroup(
File "Dash-by-Plotly-Coding-with-Adam\Bootstrap.venv\lib\site-packages\dash_bootstrap_components_init_.py", line 51, in getattr
raise AttributeError(
AttributeError: FormGroup was deprecated in dash-bootstrap-components version 1.0.0. You are using 1.2.1.

Code error

Hi all, if you tried to run the code and you failed (like me for example) (Syntax error), I optimized the creator code in places where I was getting the error, here: (Read the information at the end)

import os
import openai # pip install openai
from dash import Dash, dcc, html, Input, Output, State # pip install dash
import dash_bootstrap_components as dbc # pip install dash-bootstrap-components

openai.api_key = "YOUR_OPENAI_API_KEY"

model_options = [
'text-davinci-003',
'text-curie-001',
'text-babbage-001',
'text-ada-001',
'text-davinci-002',
'text-davinci-001'
]

app = Dash(name, external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = dbc.Container([
html.H1("Dash-ChatGPT Example"),
dbc.Row([
dbc.Col([
html.Label("Model:"),
dcc.Dropdown(model_options, value="text-davinci-003", id='models'),
], width=6),
dbc.Col([
html.Label("Temperature:"),
dcc.Slider(min=0, max=2, step=0.1, value=0.7, id='temperatures'),
], width=6)
], className='mb-5'),
dbc.Row([
dbc.Col([
dcc.Input(id='input-text', type='text', placeholder='Type your message here', style={'width': 500}),
html.Button('Submit', id='submit-button', n_clicks=0),
], width=6)
], justify="center"),
dcc.Loading(
children=[html.Div(id='output-text')],
type="circle",
)
])

@app.callback(
Output('output-text', 'children'),
Input('submit-button', 'n_clicks'),
State('input-text', 'value'),
State('models', 'value'),
State('temperatures', 'value')
)
def update_output(n_clicks, text_input, model_input, temp_input):
if n_clicks > 0:
# Get the response from ChatGPT
response = openai.Completion.create(
model=model_input,
prompt=text_input + "\n",
max_tokens=400,
temperature=temp_input
)
generated_text = response.choices[0].text
# Return the generated text as the output
return generated_text
return ""

if name == 'main':
app.run_server(debug=True)

Info: you MUST install the openai pip:
pip install openai dash dash-bootstrap-components

Bye.

Dash & XLwings. Attempting to pre-load Excel before Dash callback to save load time.

Windows 10 Enterprise for local. Windows Server 2022 Standard for the server

3.10 Python, Microsoft 365 Apps for enterprise, 0.28.7 xlwings

I have a web interface project that is using a connection between XLwings and Dash. The Excel file is large and takes about 15 seconds to load, while the calc only takes 5 seconds. Since it is setup to run over the web, each client will have their own instance of Excel. XLwings has a way to handle this.
Currently the setup is that once the user enters their setup and clicks submit, only then does the connection start.
If this was normal python, I could just start the connection earlier. However, with Dash the only connection between the layout, and the function definition is the Dash callback.
The goal is to load the Excel file as soon as the page is loaded, while that is happening the user would enter their parameters, the time that takes to load would be saved and the result return time would be shortened by that time.
*
I would like to use a chained callback. The first callback would load on page load with the xlWings connection. 'prevent_initial_call' would be false.
The final callback I have setup the 'prevent_initial_call' to True because I don't want this to run until they hit submit.
*
If I setup the connection as a variable or function, it doesn't look like you can pass these through the callback in anyway.
Project requirements are that the Excel and its VBA not be converted to Python/Dash.
Possible to launch one, or a few, Excels' on launch, and have XLwings grab the PID somehow? Would another Excel extension handle this? I know we're not supposed to use 'Global' variables, but that might fit this particular need.

Above this code part is the layout setup for Dash

@callback(
     #many Output and Inputs. Removed most for clarity.
     Output(component_id='table', component_property='data'),
     Input(component_id='yearSlider', component_property='value'),
)
def finalFxn(
#many parameters. Removed most for clarity.
parameter1,
parameter2
):
   with xw.App(visible=True) as app:
        wb = app.books.open(r"C:\Users\mike\Downloads\modified3-31.xlsm")
#logic
# excel cells = parameters from web
#logic
# parameters to web = excel 
return results, graph, etc.

Runing interactive graph in Kaggle Notebook

I see your code in : https://github.com/Coding-with-Adam/Dash-by-Plotly/blob/master/Deploy_App_to_Web/Kaggle-GGL-Collab/Dash-on-Kaggle.ipynb
It is really helpfull as only one of the solution that work on kaggle. However I have a hard time making a simpler thing. That is to make it work directly in kaggle or locally in a notebook (i.e. not building an app but having the interactive graph directly in the notebook). Any idea on how to do that ? use plotly only ?

connection request rejected

Dear Charming Data,I am a newbee of plotly-dash , when i build a sever by "app.run_server(debug=True)",and then open the link,my request was denied . and if i turn the 'debug' option as False , comes the following error:
Traceback (most recent call last):
File "D:\BaiduNetdiskDownload\BeforeAfter\before-after.py", line 45, in
app.run_server()
File "D:\Program Files\Python36\lib\site-packages\dash\dash.py", line 2033, in run_server
self.server.run(host=host, port=port, debug=debug, **flask_run_options)
File "D:\Program Files\Python36\lib\site-packages\flask\app.py", line 922, in run
run_simple(t.cast(str, host), port, self, **options)
File "D:\Program Files\Python36\lib\site-packages\werkzeug\serving.py", line 1008, in run_simple
inner()
File "D:\Program Files\Python36\lib\site-packages\werkzeug\serving.py", line 957, in inner
fd=fd,
File "D:\Program Files\Python36\lib\site-packages\werkzeug\serving.py", line 781, in make_server
host, port, app, request_handler, passthrough_errors, ssl_context, fd=fd
File "D:\Program Files\Python36\lib\site-packages\werkzeug\serving.py", line 686, in init
super().init(server_address, handler) # type: ignore
File "D:\Program Files\Python36\lib\socketserver.py", line 456, in init
self.server_bind()
File "D:\Program Files\Python36\lib\http\server.py", line 138, in server_bind
self.server_name = socket.getfqdn(host)
File "D:\Program Files\Python36\lib\socket.py", line 673, in getfqdn
hostname, aliases, ipaddrs = gethostbyaddr(name)
UnicodeDecodeError: 'utf-8' codec can't decode byte 0xba in position 0: invalid start byte

Question about the 'Side Navigation Bar'

Hey Adam!
I looked at the video of "Side Navigation Bar" on your youtube channel,and I got a question, I want to design a complicated app by just using side bar. In order to do this , I have to create another app, but I don't known how to deal with these two callbacks.
the code as following:

import dash
import dash_bootstrap_components as dbc
from dash import html,dcc
import plotly.express as px
from dash.dependencies import Input,Output
import pandas as pd

df = pd.read_csv('https://raw.githubusercontent.com/Coding-with-Adam/Dash-by-Plotly/master/Bootstrap/Side-Bar/iranian_students.csv')

app2=dash.Dash(name,external_stylesheets=[dbc.themes.BOOTSTRAP],suppress_callback_exceptions=True)
server = app2.server
df2 = px.data.tips()
days = df2.day.unique()
app2.layout = html.Div([
dcc.Dropdown(
id="dropdown",
options=[{"label": x, "value": x} for x in days],
value=days[0],
clearable=False,
),
dcc.Graph(id="bar-chart"),
])

@app2.callback(
Output("bar-chart", "figure"),
[Input("dropdown", "value")])
def update_bar_chart(day):
mask = df2["day"] == day
fig = px.bar(df2[mask], x="sex", y="total_bill",
color="smoker", barmode="group")
return fig

app=dash.Dash(name,external_stylesheets=[dbc.themes.BOOTSTRAP])

SIDEBAR_STYLE={
'position':'fixed',
'top':0,
'left':0,
'bottom':0,
'width':'16rem',
'padding':'2rem 1rem',
'background-color':'#f8f9fa',
}

CONTENT_STYLE={
'margin-left':'18rem',
'margin-right':'2rem',
'padding':'2rem 1rem',
}

sidebar=html.Div(
[
html.H2('Sidebar',className='display-4'),
html.Hr(),
html.P(
'Number of students per education level',className='lead'
),
dbc.Nav(
[
dbc.NavLink('Home',href='/',active='exact'),
dbc.NavLink('Page 1',href='/page-1',active='exact'),
dbc.NavLink('Page 2',href='/page-2',active='exact'),
],
vertical=True,
pills=True,#
),
],
style=SIDEBAR_STYLE,
)

content=html.Div(id='page-content',children=[],style=CONTENT_STYLE)

app.layout=html.Div([
dcc.Location(id='url'),
sidebar,
content
])
@app.callback(
Output('page-content','children'),
[Input('url','pathname')]
)
def render_page_content(pathname):
if pathname=='/':
return [app2.layout]
elif pathname =='/page-1':
return [
html.H1('Grad School in Iran',
style={'textAlign':'center'}),
dcc.Graph(id='bargraph',
figure=px.bar(df,barmode='group',x='Years',
y=['Girls Grade School','Boys Grade School']))
]
elif pathname =='/page-2':
return [
html.H1('High School in Iran',
style={'textAlign':'center'}),
dcc.Graph(id='bargraph',
figure=px.bar(df,barmode='group',x='Years',
y=['Girls High School','Boys High School']))
]
return dbc.Jumbotron(
[
html.H1('404 : Not found' ,className='text-danger'),
html.Hr(),
html.P(f'The pathname {pathname} was not recognised...')
]
)
if name=='main':
app.run_server(debug=True,port=3001)

I have also looked at the video of Deploy_App_to_Web\Multipage_App on your channel , but i think that using side bar is much more easier than building a multipage app. Looking for you support.

Dash Callback function not responding; Error: Duplicate Callback Output

I am trying to create a dashboard consisting of 8 buttons, each of which corresponds to a filtered df and 4 dropdowns. The attempt was to take the filtered df according to the triggered button and use 4 columns of the df for 'options' of 4 different dcc.dropdown. But dash shows this error message:

In the callback for output(s):
MBD.options
Urbanity.options
Outlet.options
Chain.options
Output 1 (Urbanity.options) is already in use.
Any given output can only have one callback that sets it.
To resolve this situation, try combining these into
one callback function, distinguishing the trigger
by using dash.callback_context if necessary.

My callback is:

@app.callback([Output('MBD', 'options'), Output('Urbanity', 'options'), Output('Outlet', 'options'),
           Output('Chain', 'options')],
           [Input('all','id'), Input('fmcg','id'), Input('bev','id'), Input('tob','id'),
           Input('food','id'), Input('drug','id'), Input('liquor','id'), 
           Input('unilever','id')])
def update_dd(all_b, fmcg_b, bev_b, tob_b, food_b, drug_b, liq_b, unil_b):
    ctx = dash.callback_context
    dff = pd.DataFrame()

if not ctx.triggered:
    button_id  = 'all.id'
else:
    button_id = ctx.triggered[0]['prop_id']
if button_id == 'all.id' :
    dff = alloutlet_df.copy()
elif button_id == 'fmcg.id':
    dff = fmcg_df.copy()
elif button_id == 'bev.id':
    dff = bev_df.copy()
elif button_id == 'tob.id':
    dff = tob_df.copy()
elif button_id == 'food.id':
    dff = food_df.copy()
elif button_id == 'drug.id':
    dff = drug_df.copy()
elif button_id == 'liquor.id':
    dff = liquor_df.copy()
elif button_id == 'unilever.id':
    dff = unilever_df.copy()
else:
    dff = df.copy()


mbd_opt = {'label':dff['Region'].unique(), 'value':dff['Region'].unique()} 
urb_opt = {'label':dff['Urbanity'].unique(), 'value': dff['Urbanity'].unique()} 
out_opt = {'label':dff['Outype_panel'].unique(), 'value':dff['Outype_panel'].unique()} 
chain_opt = {'label':dff['CHAIN'].unique(), 'value':dff['CHAIN'].unique()} 
return [mbd_opt, urb_opt, out_opt, chain_opt]

Sharing_Data_Multipage_app breaks on dash-labs==1.1.0

pip install dash-labs==1.1.0

remove suppress_callback_exceptions=True

run app with python app.py

image

pip install dash-labs==1.0.0

run app with python app.py

Interestingly enough, this still produces one error, but this might be a known one (however example works just fine):

image

help with a project

hey adam, hope are you doing well !
I've been given an assignment to create a some charts using Dash by plotly, and I'm having some trouble to execute it. I was given an excel file to work upon, and I watched your video on YT and found my way to your GitHub. I was wondering if you could help me execute it the way you've in your YT video.

import issue

from app import app
ImportError: cannot import name 'app' from 'app'

Hi,
I just watched your video to get started working with Dash. On attempting to build the files locally I ran into this issue.
I was wondering how you got around it in your project as i have pulled directly from the github here and am still having the issue.

Thanks,
Max

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.