Wrongly connected lineplot

So I am creating lineplots from my data.
The relevant portion of my dataframe looks like this:

    Metadata_Timepoint AreaShape_Area_median
0                   11                  3980
8                   12                4066.5
16                  13                  4297
24                   2                1487.5
27                   3                  1739
29                   4                  1837
34                   5                  2463
42                   6                2825.5
49                   7                  3028
56                   8                  3205
63                   9                  3449
70                  10                4023.5
78                  11                2227.5
84                  12                1918.5
90                  13                  2164
95                   2                  1243
98                   3                1337.5
102                  4                  1488
105                  5                  1621
109                  6                1860.5

And my lineplots look something like this:
image

It should be one line with the Time column on the X and the Area column on the Y Axis.
But somehow it is connecting timepoint 3 to timepoint 13 directly and breaks the connection between time point 10 and 11.

Does anybody know how I can fix this?

The code for the plot is the following

def lineplot(dat=[], classifier_column='', identifier_column='', timepoint_column='',
             data_column='', distance_filter='', unique_time_selector='', testmode=False):
    '''
    testmode: If testomde is set to True only the first 10 items will be used in the graph
    '''    
    print('creating migration lineplot')
    #print(identifier_column)
    #print(type(identifier_column))
    #cells=list(dat[identifier_column].unique())
    #dat[unique_time_selector]=dat[identifier_column]+'_T'+dat[timepoint_column].astype('str')

    classes=list(dat[classifier_column].unique())
   
    X_column=data_column[0]
    Y_column=data_column[1]
    #excluding rows where the data columns is 'None'
    #relevant for averaging
    dat=dat[dat[X_column]!='None']
    dat=dat[dat[Y_column]!='None']
    #making sure values are floats
    dat[X_column]=dat[X_column].astype(float)
    dat[Y_column]=dat[Y_column].astype(float)
    #initiating traces as a list
    #getting trace IDs from unique IDs (cells)
    print('looping through cells...')
    #getting the number of rows for suplots based on the amount of classes
    row_n=len(classes)
    if row_n==0:
        print('No classes found, make sure your filters do not exclude all data')

    rowlist=np.arange(1, row_n+1, 1)

        #defining subplot layout
    fig=make_subplots(rows=row_n, cols=1, subplot_titles=[str(c) for c in classes])
    r_i=0
    #getting max axis values
    max_x=dat[X_column].max()
    min_x=dat[X_column].min()
    max_y=dat[Y_column].max()
    min_y=dat[Y_column].min()
    #looping through the clases
    for i in classes:
        #subsetting the data by the class
        dat_class=dat.loc[dat[classifier_column]==i]
        #getting only the cells from that class
        cells=list(dat_class[identifier_column].unique())
        print('...of class ', i, '...')
        if testmode==True:        
            cells=cells[50:100]
        #append the current classes name to the titles of the plot


    #looping through the cells
        for c in cells:               
            #appending x, y data based on current cell to the list of traces
            fig.append_trace(trace=go.Scatter(
            #getting x values
            x=dat_class.loc[dat_class[identifier_column]==c][X_column],
            #getting y values
            y=dat_class.loc[dat_class[identifier_column]==c][Y_column],
            #getting unique ID
            hovertext=dat_class.loc[dat_class[identifier_column]==c][unique_time_selector],
            customdata=[dat_class.loc[dat_class[identifier_column]==c][unique_time_selector]],
            name=c,
            ),
            row=int(rowlist[math.floor(r_i)]) , col=1)
         
        #adding 1 to the row indicator, so that every class will be 
        #plottet in a new row
        fig.update_yaxes(range=[min_y*1.05, max_y*1.05], row=int(rowlist[math.floor(r_i)]), col=1)
        fig.update_xaxes(range=[min_x*1.05, max_x*1.05], row=int(rowlist[math.floor(r_i)]), col=1)
        r_i+=1

    fig.update_layout(margin={'l': 40, 'b': 5, 't': 30, 'r': 40},
            height=row_n*375, width=750)
    fig.update_layout({'clickmode':'event+select'})
  

    print('...done')
        
    return fig

Looks like you’re having passing data through the plotly.py API - I suggest posting your question in #api:python

Anybody has an idea, what could have gone wrong here?

Line plots in Plotly will plot in the order the data is given, so in this case it’s starting at 11, then 12, then 13, then looping back to 2, 3, 4 etc. If you want your data plotted in X-order, then you’ll need to sort it before passing it into Plotly :slight_smile: