bar chart: textposition='auto' not working for 0 values

From the textposition argument documentation for bar traces:

"auto" tries to position text inside the bar, but if the bar is too small and no bar is stacked on this one the text is moved outside.

For small values this is working nicely: Instead of inside, the text gets positioned outside.

But: For 0 values, the text disappears completely instead of being moved outside.

import pandas as pd
import plotly.express as px

df = pd.DataFrame({
    "Country": [f"Country {n}" for n in range(6)],
    "Some Metric": [8,5,5,.5,0.0001,0]
})

fig = px.bar(
    df, 
    x='Some Metric',
    y='Country', 
    text='Country',
    orientation='h')
fig.update_yaxes(visible=False, showticklabels=False)

# change here between "auto" (default), "inside", "outisde"
fig.update_traces(textposition="auto")

fig.show()

Setting 0 values to a small value is a dirty fix that may also lead to the text disappearing when the graph is resized. At the same time, such a fix endangers data integrity.

The alternative would be setting the textposition for every observation separately. I think that should be avoided and covered by setting texposition="auto".

Fix that everybody can implement in their code currently:

fig.update_traces(textposition=['outside' if val==0 else 'auto' for val in df['Some Metric']])

Tested with plotly 5.10.0.

Duplicate of plotly/plotly.py#2709

@archmoj

@archmoj is this by design? I noticed this in bar/plot.js:

    if(!text ||
        textPosition === 'none' ||
        ((calcBar.isBlank || x0 === x1 || y0 === y1) && (
            textPosition === 'auto' ||
            textPosition === 'inside'))) {
        bar.select('text').remove();
        return;

plotly.js/src/traces/bar/plot.js

Lines 301 to 307 in 70c49ce

    
           if(!text || 
        
               textPosition === 'none' || 
        
               ((calcBar.isBlank || x0 === x1 || y0 === y1) && ( 
        
                   textPosition === 'auto' || 
        
                   textPosition === 'inside'))) { 
        
               bar.select('text').remove(); 
        
               return;

@AaronStiff

Does look like a bug to me, and certainly a zero-size bar is different from no bar! Nice detective work @AaronStiff - fixing this may be as simple as removing that textPosition === 'auto' || line (and adding this situation to a test image) but it would be good to at least investigate why that condition was added in the first place...

@alexcjohnson

Thanks @alexcjohnson! Unfortunately I'm not really setup for/knowledgeable in plotly.js development yet, so I'll let someone else make that change. But the git blame seems like it's been around for several years.

Also in the same position of having to conside that same dirty fix for 0 values! 🙏

Codepen from duplicate issue #6544: https://codepen.io/bleah1/pen/dyqLmvN

Equivalent plotly.py issue: plotly/plotly.py#4686

Navigation Menu

Repository navigation

bar chart: textposition='auto' not working for 0 values #6474

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

	if(!text \|\|
	textPosition === 'none' \|\|
	((calcBar.isBlank \|\| x0 === x1 \|\| y0 === y1) && (
	textPosition === 'auto' \|\|
	textPosition === 'inside'))) {
	bar.select('text').remove();
	return;

bar chart: textposition='auto' not working for 0 values #6474

Description

Activity

AaronStiff commented on Feb 8, 2023

AaronStiff commented on Feb 8, 2023

alexcjohnson commented on Feb 9, 2023

AaronStiff commented on Feb 9, 2023

JosieAilsa commented on Aug 8, 2023

emilykl commented on Aug 28, 2026

emilykl commented on Sep 1, 2026

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions