Black Lives Matter. Please consider donating to Black Girls Code today.
Dash Enterprise delivers an incredible 21x cost savings 💸Download the e-book!

Changing the font size in an Indicator

Hi all,

Currently I am working on some plots that involve Indicators (https://plotly.com/python/indicator/).

My goal is to decrease the size of both the ‘value’ and ‘delta’, and to increase the size of the title.

However, I am unable to change the font size of either the ‘value’ or the ‘delta’. I tried everything that seemed even slightly sensible, but nothing seems to work.
I was able to change the size of the title by including some CSS/HTML in the text itself. It works, but is not the most charming solution, so in this case I would like to know whether there is a better way to achieve this.

To give you an idea of the figure, here is part of my code:

size = "<span style='font-size:1.5em'>"

fig = go.Figure()

# DTD
fig.add_trace(go.Indicator(
    title={'text': size + "DTD"},
    mode="delta",
    value=close,
    delta={'reference': dtd_p, 'relative': True, 'valueformat': '.2%'},
    domain={'row': 0, 'column': 0}))

# Close
fig.add_trace(go.Indicator(
    title={'text': "Close"},
    mode="number",
    value=close,
    delta={'reference': open, 'relative': True},
    domain={'row': 1, 'column': 0}))

# Layout
fig.update_layout(
    grid={
        'rows': 3,
        'columns': 3,
        'pattern': "independent"
    },
)

Hopefully any of you can provide me the solution.
Thanks in advance!

1 Like

I am looking for the same solution as well

Never mind I figured it out
add number={"font":{"size":20}},

so
fig.add_trace(go.Indicator(
title={‘text’: size + “DTD”},
mode=“delta”,
value=close,
delta={‘reference’: dtd_p, ‘relative’: True, ‘valueformat’: ‘.2%’},
**number={"font":{"size":20}},**
domain={‘row’: 0, ‘column’: 0}))

Delta also has the same attribute font
Reference:https://plotly.com/python/reference/indicator/