Is it possible to adjust spacing on plotly indicator between number and delta

📊 Plotly Python
1

Is there a way to adjust the spacing between the number and delta text? For a large main number font size the delta text becomes weirdly close to the bottom of the number.

fig = go.Figure(go.Indicator(
    mode="number+delta",
    number={"suffix": "%", "font": {'size': 40}},
    value=20,
    title={"text": "Capacity Factor today","font": {'size': 18}},
    delta={'reference': 0, "valueformat": ".2f", 'suffix':"% from Yesterday",
    "font":{'size':15}}))

image

There are no variables in the docs I can see that would change this, and it doesn’t seem to affect the title which is well spaced. I think the issue is the spacing is done using the delta text rather than the main number. I don’t think this is currently a feature but would be neat if you could adjust the margins between the different components, or the spacing round the text.

Any suggestions? :slight_smile:

2

Hi @Miles ,

Welcome to the community!

I think by default there is no such margin-things to solve this issue.
But I have tried few trick to solve this, and hope the code below is the closest.

You can add <br> tag before the delta symbol, by using code below.

fig.update_traces(delta_increasing_symbol="<br><br>▲", selector=dict(type='indicator'))

If it apply in your code.

import plotly.graph_objects as go

fig = go.Figure(go.Indicator(
    mode="number+delta",
    number={"suffix": "%", "font": {'size': 40}},
    value=20,
    title={"text": "Capacity Factor today","font": {'size': 18}},
    delta={'reference': 0, "valueformat": ".2f", 'suffix':"% from Yesterday",
    "font":{'size':15}}))

fig.update_traces(delta_increasing_symbol="<br><br>▲", selector=dict(type='indicator'))
fig.show()

image

2 Likes
3

Thanks @farispriadi this works perfectly! I tried the <br> as a number suffix, but it never crossed my mind to do it on the delta icon thanks :smiley:

1 Like