CODEWITHSUNDEEP
pythonplotly-dash
tansawit
tansawit

Reputation: 35

Changing Dash chart series colors

I'm just starting to learn to use Dash and currently have a chart up displaying user engagement on my website. However, I can't seem to figure out how to style Dash components when it comes to colors and the Dash documentation doesn't seem to have anything on the topic. How do I change a series' colors from the default blue/orange/green? The code for the graph in question is below`

dcc.Graph(
        id='average_engagement_graph',
        figure={
            'data': [
                {'x': list(avg_df['day']), 'y': list(avg_df['countMessageIn']),
                 'type': 'bar', 'name': 'Incoming Messages from Users'},
                {'x': list(avg_df['day']), 'y': list(avg_df['countMessageOut']),
                    'type': 'bar', 'name': 'Outgoing Message by Bot'},
            ],
            'layout': {
                'title': 'Average User-Bot Engagement by Day of Week',
                'xaxis': {
                    'title': 'Day of the Week'
                },
                'yaxis': {
                    'title': 'Average Number of Messages'
                },
            }

        }
    ),

Upvotes: 1

Views: 6867

Answers (1)

IMCoins
IMCoins

Reputation: 3306

For bar, you've got to add it to a key named marker.

dcc.Graph(
        id='average_engagement_graph',
        figure={
            'data': [
                {'x': list(avg_df['day']), 'y': list(avg_df['countMessageIn']),
                 'type': 'bar', 'name': 'Incoming Messages from Users'},
                  'marker' : { "color" : your_color_array}
                {'x': list(avg_df['day']), 'y': list(avg_df['countMessageOut']),
                    'type': 'bar', 'name': 'Outgoing Message by Bot'},
                  'marker' : { "color" : your_color_array}
            ],
            'layout': {
                'title': 'Average User-Bot Engagement by Day of Week',
                'xaxis': {
                    'title': 'Day of the Week',
                },
                'yaxis': {
                    'title': 'Average Number of Messages'
                },
            }

        }
    ),

EDIT

It seems they have done a lot of edit and you can also do this...

colors = ['lightslategray',] * 5
colors[1] = 'crimson'

fig = go.Figure(data=[go.Bar(
    x=['Feature A', 'Feature B', 'Feature C',
       'Feature D', 'Feature E'],
    y=[20, 14, 23, 25, 22],
    marker_color=colors # marker color can be a single color value or an iterable
)])

Upvotes: 3

Related Questions