@@florianboudon4624 try debug=False at the very end. Also, it could be that you have a string firewall on your computer, blogging the execution of these kind of programs
Hey Adam, Thanks for your tutorial, however when i m trying the dcc.checklist the options are loading in vertical fashion how can i make them in horizontal manner?
dcc.Checklist(id='my-checklist', value=['FB', 'GOOGL', 'AMZN'], options = [{'label':x, 'value':x} for x in sorted(df['Symbols'].unique())], inline=True, labelStyle={"margin-right": "20px"}) This worked for me
tfw when you fail at copying a phrase so small you could have just typed it out 5 times by the time you actually get it pasted correctly from your clipboard! XD Thanks a lot for the video, learned a lot. I kind of hate dealing with all these whistles and bells on the frontend, but at least bootstrap makes it somewhat tolerable.
Thank you for this video guide! It showed me how to control layout of components, something I was facing difficulties with. Btw, I also read your book The Book of Dash, it's a great book! 🙂
can you do streamlit, I had issues managing state/cache in it so reverted back to plotly- now looking at your “advanced shit” section to get a hang of dash callbacks
Hi @shilpi. Can you please share your code/question on community.plotly.com Forum? That will allow us to see your code and try to help you out. Thank you,
at 45:40 inside checlkist you used 'mr-3' in labelClassName attribute I tried using it but it didnt work do you have any suggestions how I can put space between checklist items properly. And thank you for this video. I'm new to these kind of things and it helps a lot!!
i get this error how would you assist me? TypeError: The `dash_bootstrap_components.Row` component (version 1.0.3) received an unexpected keyword argument: `width` Allowed arguments: align, children, className, class_name, id, justify, key, loading_state, style
Hi, I'm using Spyder to run the script, but the bootstrap design like the text color is not working in the webpage. May I know is it additional package needed to download?
dbc.col() and dbc.row() what is the difference between them? given their similarity seems like interchangeable!.. what is the unique differences between them. more specifically when to use either of them while coding?
hi Mahadi, first you declare the dbc.Row() and then, inside the Row, you have to declare the dbc.Col(). Then inside the Col is where you put your Dash components. I hope that helps.
Hello, great tutorial Séverine, thanks! I have one question: I have a header row with nav bar and a footer row and I want the graph (or any other component) to be centered vertically (even when changing window size) in my content row, how should I do this? Really struggling to find the information… thanks!
Hey, just two questions. 1. For popover body, how to connect the hover one with button? 2. Is there any circular 'i' icon available to pop information in dbc/dcc/html components instead of a hefty button?
thx a lot,but i got a question about layout. i do exactly the same as you, but in first row and first colomn, the graph and the dropdown are stick together, there is no blank between them. plz help!!!
This awesome! I have a question about a specific feature of multiplots. In case I wanna create a figure with 2 subplots (row=1, col=2) and want have the share x axis option so that when I zoom in one of the graphs the second one is also zoomed, how can it be done? I know that if the subplots are of (row=2, col=1) it works fine. But I cannot find a way to have it working for (row=1, col=2). Thank you very much!
Hi Rodrigo, Probably the best solution is to use Plotly Express high level interface parameters: facet_col and/or facet_row. Here's the documentation for the line graph.
hi @justpjn you need to put the button n_clicks as an INput in the callback, and put the dropdown value as an Output in the callback. In the callback function write the code so the value returned is the original default state.
When I run your code, I get the following error: IncorrectTypeException: The input argument `my-dpdn.value` must be a list or tuple of `dash.dependencies.Input`s. Please help.
@@CharmingData It is: 1.14.0 Looks like I have to put brackets around the Input: @app.callback( Output('line-fig2', 'figure'), [Input('my-dpdn2', 'value')] )
@@Me-ur2zt yes, for the early versions of Dash, multiple Inputs and Outputs needed to be inside lists, but for the later version you don't need a list.
Hey Adam, not related to dbc but I've a question. Do you know if it's possible configure "number digits to display" globally for the dashboard? We shouldn't have to be round every float via python.
Create a separate .py file. Use it to define global variables. import that file in each .py file. Define a variable that it the numeber of decimal points and use that variable each time you make a table in a dashboard. If you need to change the digits just change that variables value
Hi Philip, I can't remember if I have a video on that in patreon, but I basically talk about this: dash.plotly.com/annotations They have good examples of how to draw on graphs in that link. Let me know if you have any questions
Hi Adam, How can we fit the whole contents into a single webpage, and secondly how can give different background colors to different parts of the layout. let's say I have two rows and two columns and I want to give background colors for row one col1, row1 col2, and so on. so it will look like green tiles with spaces between them on a blue ground (web page background). Thank you
one easy way to do put your content and graphs on dbc.cards and manage the background colors of each card. You can also mange the color of your figures like this: fig.update_layout( plot_bgcolor='black', paper_bgcolor='black', )
@@CharmingData Hi Adam, I used Cards as you suggested. in Cards, is it possible two use two different components next to each other, horizontally? For example, a text at left and a "dropdown" list just next to this text, and maybe another component next to those. So, I have three different components on the same card, so same background color, without any border between them. Whenever I tried, components comes one under the other one.
@@huseyinyilmaz1155 I've never tried this. But try to put dbc.Row and dbc.Col inside the body of dbc.Card, like in the example below: stackoverflow.com/questions/63592900/plotly-dash-how-to-design-the-layout-using-dash-bootstrap-components
Hi Adam, thank you for this comprehensive tutorial! Regarding this bootstrap layout using rows and columns, how one can control the space between two rows? Is there any class or parameter we can use to control it? Thank you very much!
Look at the bootstrap class i use for the title of the page. I think it's mp-3 or something similar. That creates a padding under the elements inside the rows.
