python plotly express vs graph_objects: what is the equivalent of plotly.express's line_group for plotly.graph_objects

Question

I'm trying to find out how to make a plot with grouped lines

base data is organized as :

so each id shoul plot as a diferente line. with px.line it works well:

but with graph_object it gets weird:

It is missing the lines grouping. Searched in the plotly docs but could not find a way. Help is apreciated. Below is a code with some sample data:

import pandas as pd
import plotly.express as px
from plotly import graph_objects as go
from plotly.subplots import make_subplots
    
dd_sample = [{'id':80,'x':0,'y':-3.5,'cluser':4},{'id':80,'x':1,'y':-3.0,'cluser':4},{'id':80,'x':2,'y':-3.5,'cluser':4},{'id':80,'x':3,'y':-3.0,'cluser':4},{'id':80,'x':4,'y':-3.0,'cluser':4},{'id':80,'x':5,'y':-2.0,'cluser':4},{'id':80,'x':6,'y':-2.5,'cluser':4},{'id':80,'x':7,'y':-1.5,'cluser':4},{'id':80,'x':8,'y':-0.5,'cluser':4},{'id':80,'x':9,'y':-2.0,'cluser':4},{'id':80,'x':10,'y':-1.5,'cluser':4},{'id':80,'x':11,'y':-0.5,'cluser':4},{'id':80,'x':12,'y':-0.5,'cluser':4},{'id':80,'x':13,'y':0.0,'cluser':4},{'id':80,'x':14,'y':-1.0,'cluser':4},{'id':80,'x':15,'y':-0.5,'cluser':4},{'id':80,'x':16,'y':-0.5,'cluser':4},{'id':80,'x':17,'y':-0.5,'cluser':4},{'id':80,'x':18,'y':0.0,'cluser':4},{'id':80,'x':19,'y':0.0,'cluser':4},{'id':80,'x':20,'y':-0.5,'cluser':4},{'id':80,'x':21,'y':-1.0,'cluser':4},{'id':80,'x':22,'y':-1.0,'cluser':4},{'id':80,'x':23,'y':-1.5,'cluser':4},{'id':80,'x':24,'y':-3.0,'cluser':4},{'id':80,'x':25,'y':-4.0,'cluser':4},{'id':80,'x':26,'y':-4.0,'cluser':4},{'id':80,'x':27,'y':-3.5,'cluser':4},{'id':80,'x':28,'y':-3.5,'cluser':4},{'id':80,'x':29,'y':-3.5,'cluser':4},{'id':80,'x':30,'y':-3.5,'cluser':4},{'id':80,'x':31,'y':-1.5,'cluser':4},{'id':80,'x':32,'y':-1.5,'cluser':4},{'id':80,'x':33,'y':-1.0,'cluser':4},{'id':80,'x':34,'y':-0.5,'cluser':4},{'id':80,'x':35,'y':-1.0,'cluser':4},{'id':80,'x':36,'y':-1.5,'cluser':4},{'id':80,'x':37,'y':-1.5,'cluser':4},{'id':80,'x':38,'y':-1.0,'cluser':4},{'id':80,'x':39,'y':-1.5,'cluser':4},{'id':80,'x':40,'y':-2.0,'cluser':4},{'id':80,'x':41,'y':-2.5,'cluser':4},{'id':80,'x':42,'y':-3.0,'cluser':4},{'id':80,'x':43,'y':-3.5,'cluser':4},{'id':80,'x':44,'y':-3.0,'cluser':4},{'id':80,'x':45,'y':-3.0,'cluser':4},{'id':80,'x':46,'y':-3.5,'cluser':4},{'id':80,'x':47,'y':-3.0,'cluser':4},{'id':80,'x':48,'y':-3.0,'cluser':4},{'id':80,'x':49,'y':-3.5,'cluser':4},{'id':222,'x':0,'y':-6.5,'cluser':4},{'id':222,'x':1,'y':-6.0,'cluser':4},{'id':222,'x':2,'y':-7.0,'cluser':4},{'id':222,'x':3,'y':-6.5,'cluser':4},{'id':222,'x':4,'y':-6.5,'cluser':4},{'id':222,'x':5,'y':-7.0,'cluser':4},{'id':222,'x':6,'y':-6.0,'cluser':4},{'id':222,'x':7,'y':-6.5,'cluser':4},{'id':222,'x':8,'y':-6.5,'cluser':4},{'id':222,'x':9,'y':-7.5,'cluser':4},{'id':222,'x':10,'y':-7.5,'cluser':4},{'id':222,'x':11,'y':-8.5,'cluser':4},{'id':222,'x':12,'y':-8.5,'cluser':4},{'id':222,'x':13,'y':-8.0,'cluser':4},{'id':222,'x':14,'y':-7.5,'cluser':4},{'id':222,'x':15,'y':-8.0,'cluser':4},{'id':222,'x':16,'y':-8.5,'cluser':4},{'id':222,'x':17,'y':-9.0,'cluser':4},{'id':222,'x':18,'y':-8.0,'cluser':4},{'id':222,'x':19,'y':-8.0,'cluser':4},{'id':222,'x':20,'y':-7.5,'cluser':4},{'id':222,'x':21,'y':-7.5,'cluser':4},{'id':222,'x':22,'y':-7.0,'cluser':4},{'id':222,'x':23,'y':-7.5,'cluser':4},{'id':222,'x':24,'y':-8.0,'cluser':4},{'id':222,'x':25,'y':-8.0,'cluser':4},{'id':222,'x':26,'y':-4.0,'cluser':4},{'id':222,'x':27,'y':-4.0,'cluser':4},{'id':222,'x':28,'y':-5.0,'cluser':4},{'id':222,'x':29,'y':-4.5,'cluser':4},{'id':222,'x':30,'y':-5.0,'cluser':4},{'id':222,'x':31,'y':-5.0,'cluser':4},{'id':222,'x':32,'y':-3.5,'cluser':4},{'id':222,'x':33,'y':-3.0,'cluser':4},{'id':222,'x':34,'y':-3.5,'cluser':4},{'id':222,'x':35,'y':-5.0,'cluser':4},{'id':222,'x':36,'y':-5.0,'cluser':4},{'id':222,'x':37,'y':-5.5,'cluser':4},{'id':222,'x':38,'y':-4.5,'cluser':4},{'id':222,'x':39,'y':-4.5,'cluser':4},{'id':222,'x':40,'y':-4.5,'cluser':4},{'id':222,'x':41,'y':-5.0,'cluser':4},{'id':222,'x':42,'y':-5.5,'cluser':4},{'id':222,'x':43,'y':-4.5,'cluser':4},{'id':222,'x':44,'y':-5.0,'cluser':4},{'id':222,'x':45,'y':-4.5,'cluser':4},{'id':222,'x':46,'y':-3.0,'cluser':4},{'id':222,'x':47,'y':-3.0,'cluser':4},{'id':222,'x':48,'y':-2.5,'cluser':4},{'id':222,'x':49,'y':-2.0,'cluser':4},{'id':361,'x':0,'y':-9.0,'cluser':4},{'id':361,'x':1,'y':-10.0,'cluser':4},{'id':361,'x':2,'y':-10.0,'cluser':4},{'id':361,'x':3,'y':-10.0,'cluser':4},{'id':361,'x':4,'y':-9.5,'cluser':4},{'id':361,'x':5,'y':-10.0,'cluser':4},{'id':361,'x':6,'y':-11.0,'cluser':4},{'id':361,'x':7,'y':-9.5,'cluser':4},{'id':361,'x':8,'y':-9.5,'cluser':4},{'id':361,'x':9,'y':-10.5,'cluser':4},{'id':361,'x':10,'y':-10.0,'cluser':4},{'id':361,'x':11,'y':-9.5,'cluser':4},{'id':361,'x':12,'y':-8.5,'cluser':4},{'id':361,'x':13,'y':-6.0,'cluser':4},{'id':361,'x':14,'y':-4.0,'cluser':4},{'id':361,'x':15,'y':-3.5,'cluser':4},{'id':361,'x':16,'y':-2.5,'cluser':4},{'id':361,'x':17,'y':-3.0,'cluser':4},{'id':361,'x':18,'y':-2.5,'cluser':4},{'id':361,'x':19,'y':-0.5,'cluser':4},{'id':361,'x':20,'y':-1.0,'cluser':4},{'id':361,'x':21,'y':0.0,'cluser':4},{'id':361,'x':22,'y':-1.5,'cluser':4},{'id':361,'x':23,'y':1.0,'cluser':4},{'id':361,'x':24,'y':0.5,'cluser':4},{'id':361,'x':25,'y':0.0,'cluser':4},{'id':361,'x':26,'y':-1.0,'cluser':4},{'id':361,'x':27,'y':-0.5,'cluser':4},{'id':361,'x':28,'y':-1.0,'cluser':4},{'id':361,'x':29,'y':-1.0,'cluser':4},{'id':361,'x':30,'y':-1.0,'cluser':4},{'id':361,'x':31,'y':-2.0,'cluser':4},{'id':361,'x':32,'y':-0.5,'cluser':4},{'id':361,'x':33,'y':0.0,'cluser':4},{'id':361,'x':34,'y':-0.5,'cluser':4},{'id':361,'x':35,'y':-0.5,'cluser':4},{'id':361,'x':36,'y':0.0,'cluser':4},{'id':361,'x':37,'y':0.0,'cluser':4},{'id':361,'x':38,'y':0.0,'cluser':4},{'id':361,'x':39,'y':0.5,'cluser':4},{'id':361,'x':40,'y':0.0,'cluser':4},{'id':361,'x':41,'y':0.0,'cluser':4},{'id':361,'x':42,'y':0.0,'cluser':4},{'id':361,'x':43,'y':0.0,'cluser':4},{'id':361,'x':44,'y':1.0,'cluser':4},{'id':361,'x':45,'y':0.5,'cluser':4},{'id':361,'x':46,'y':0.5,'cluser':4},{'id':361,'x':47,'y':2.0,'cluser':4},{'id':361,'x':48,'y':4.0,'cluser':4},{'id':361,'x':49,'y':4.0,'cluser':4},{'id':366,'x':0,'y':5.0,'cluser':4},{'id':366,'x':1,'y':4.5,'cluser':4},{'id':366,'x':2,'y':4.5,'cluser':4},{'id':366,'x':3,'y':4.5,'cluser':4},{'id':366,'x':4,'y':4.0,'cluser':4},{'id':366,'x':5,'y':3.5,'cluser':4},{'id':366,'x':6,'y':4.0,'cluser':4},{'id':366,'x':7,'y':3.5,'cluser':4},{'id':366,'x':8,'y':4.0,'cluser':4},{'id':366,'x':9,'y':4.0,'cluser':4},{'id':366,'x':10,'y':3.5,'cluser':4},{'id':366,'x':11,'y':3.5,'cluser':4},{'id':366,'x':12,'y':4.0,'cluser':4},{'id':366,'x':13,'y':4.0,'cluser':4},{'id':366,'x':14,'y':6.0,'cluser':4},{'id':366,'x':15,'y':5.5,'cluser':4},{'id':366,'x':16,'y':7.0,'cluser':4},{'id':366,'x':17,'y':7.0,'cluser':4},{'id':366,'x':18,'y':7.0,'cluser':4},{'id':366,'x':19,'y':8.0,'cluser':4},{'id':366,'x':20,'y':9.0,'cluser':4},{'id':366,'x':21,'y':9.0,'cluser':4},{'id':366,'x':22,'y':10.5,'cluser':4},{'id':366,'x':23,'y':9.5,'cluser':4},{'id':366,'x':24,'y':9.0,'cluser':4},{'id':366,'x':25,'y':9.5,'cluser':4},{'id':366,'x':26,'y':10.0,'cluser':4},{'id':366,'x':27,'y':10.0,'cluser':4},{'id':366,'x':28,'y':10.5,'cluser':4},{'id':366,'x':29,'y':10.5,'cluser':4},{'id':366,'x':30,'y':10.0,'cluser':4},{'id':366,'x':31,'y':10.5,'cluser':4},{'id':366,'x':32,'y':9.0,'cluser':4},{'id':366,'x':33,'y':8.5,'cluser':4},{'id':366,'x':34,'y':9.0,'cluser':4},{'id':366,'x':35,'y':8.5,'cluser':4},{'id':366,'x':36,'y':8.5,'cluser':4},{'id':366,'x':37,'y':9.0,'cluser':4},{'id':366,'x':38,'y':7.5,'cluser':4},{'id':366,'x':39,'y':7.5,'cluser':4},{'id':366,'x':40,'y':7.5,'cluser':4},{'id':366,'x':41,'y':7.0,'cluser':4},{'id':366,'x':42,'y':6.5,'cluser':4},{'id':366,'x':43,'y':7.5,'cluser':4},{'id':366,'x':44,'y':8.0,'cluser':4},{'id':366,'x':45,'y':7.0,'cluser':4},{'id':366,'x':46,'y':7.5,'cluser':4},{'id':366,'x':47,'y':7.5,'cluser':4},{'id':366,'x':48,'y':7.5,'cluser':4},{'id':366,'x':49,'y':7.0,'cluser':4}]

# with plotly Express
fig = px.line(dd_sample,x='x',y='y',line_group='id')
fig.show()


# trying with graph_objects
fig = go.Figure()
fig.add_trace(
    go.Scatter(x=dd[mask].x,y=dd[mask].y)
    
    # WHAT IS THE EQUIVALENTOF line_group for graph_objects
    )
fig.show()

Rob Raymond · Accepted Answer · 2021-11-16 08:38:42Z

1

Plotly Express generates a trace for each id. Hence this can be easily done in graph objects

Your code for graph objects does not work as dd and mask are not defined.

go.Figure(
    [
        go.Scatter(
            x=d[1]["x"],
            y=d[1]["y"],
            name=d[0],
            line_color="blue",
            hovertemplate=f"id={d[0]}<br>" + "x=%{x}<br>y=%{y}<extra></extra>",
        )
        for d in pd.DataFrame(dd_sample).groupby("id")
    ]
).update_layout(showlegend=False)

answered Nov 16, 2021 at 8:38

Rob Raymond

31.5k3 gold badges19 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

python plotly express vs graph_objects: what is the equivalent of plotly.express's line_group for plotly.graph_objects

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related