Блог

Я изо всех сил пытаюсь получить сплошной / согласованный цвет фона для фона моего приложения Dash с помощью Bootstrap.

Вот как я закодировал один из графиков:

 fig = go.Figure(go.Bar(
            x=[playerEAinfo['Crossing'].iloc[0], playerEAinfo['Finishing'].iloc[0],
                    playerEAinfo['LongPassing'].iloc[0],playerEAinfo['LongShots'].iloc[0],playerEAinfo['BallControl'].iloc[0],
                    playerEAinfo['Dribbling'].iloc[0], playerEAinfo['Positioning'].iloc[0],playerEAinfo['Vision'].iloc[0]],
            y=['Crossing', 'Finishing', 'Long Passes', 'Long Shots','Ball Control', 'Dribbling', 'Positioning','Vision'],text=[playerEAinfo['Crossing'].iloc[0], playerEAinfo['Finishing'].iloc[0],
                    playerEAinfo['LongPassing'].iloc[0],playerEAinfo['LongShots'].iloc[0],playerEAinfo['BallControl'].iloc[0],
                    playerEAinfo['Dribbling'].iloc[0], playerEAinfo['Positioning'].iloc[0],playerEAinfo['Vision'].iloc[0]],
                    textposition='auto',orientation='h',marker_color='green'))
        config = {'displayModeBar':False}
        fig.update_layout(template='plotly_dark',margin=dict(l=10,r=10,b=10,t=10), width=260,height=280,
                        xaxis=dict(autorange=True,
                        showgrid=False,
                        ticks='',
                        showticklabels=False))
        fig.update_traces(opacity=.7)
  

И вот как кодируется раздел начальной загрузки:

 app = dash.Dash(__name__, external_stylesheets=[dbc.themes.CYBORG])
app.layout = html.Div([
    dbc.Card(
        dbc.CardBody([
            dbc.Row([
                dbc.Col([
                    drawPic(playerEAinfo)
                ], width=1.25, style={'height':'100%', 'border':'1px black solid', 'border-color':'grey','height':'281px'}),
                dbc.Col([
                    drawText(playerEAinfo)
                ], width=2.50,style={'height':'100%','border':'1px black solid', 'border-color':'grey','width':'197px', 'height':'281px'}),
                dbc.Col([
                    drawIndicator(playerEAinfo)
                ], width=2.25,style={'height':'100%','border':'1px black solid', 'border-color':'grey', 'width':'250px', 'height':'281px'}),
                dbc.Col([
                    drawBars(playerEAinfo, 1)
                ], width=3,style={'height':'100%','border':'1px black solid', 'border-color':'grey', 'height':'281px'}),
                dbc.Col([
                    drawBars(playerEAinfo, 2)
                ], width=3,style={'height':'100%', 'border':'1px black solid', 'border-color':'grey', 'height':'281px'})
            ],no_gutters=True), # Removes spacing between cards
            dbc.Row([
                dbc.Col([
                    drawRadar(fbref_playername)
                ], width=6, style={'height':'100%', 'border':'1px black solid', 'border-color':'grey'}),
                dbc.Col([
                    drawBars(playerEAinfo, 1)
                ], width=6, style={'height':'100%', 'border':'1px black solid', 'border-color': 'grey'})
            ],no_gutters=True),
            dbc.Row([
                dbc.Col([
                    drawBars(playerEAinfo, 1)
                ], width=6, style={'height': '100%', 'border': '1px black solid', 'border-color': 'grey'}),
                dbc.Col([
                    drawBars(playerEAinfo, 1)
                ], width=6, style={'height': '100%', 'border': '1px black solid', 'border-color': 'grey'})
            ], no_gutters=True),
        ])
    )
])
  

Как это выглядит в настоящее время:

Чего мне не хватает? Разве тема CYBORG не должна включаться и окрашивать все серые пятна в черный цвет?

Вы должны использовать что-то подобное, чтобы сделать график прозрачным:

 fig.update_layout(plot_bgcolor='rgba(0, 0, 0, 0)',paper_bgcolor='rgba(0, 0, 0, 0)')```