Set Alignment of Vertical Bar on X axis

Hi I am trying to change where my bars start and stop on a bar chart. My goal is to have a bar that spans the entire month. right now my code is:

    cumulative = go.Bar([self.y_column],
                        hovertemplate="Month: %{x} <br>Cumulative Tank " + self.units + ": %{y}",

and my output is:

I currently have the xtick set at the end of the month. If I can make the bars right-aligned to the xtick I can use a custom bar width to make it reach the end of the month. I don’t think I can calculate the middle day of the month, because on months with 31 days I’ll have either a one day gap or be one day over. Any help would be greatly appreciated!

I also posted this on stackoverflow:

So I decided to implement a work around by using a filled line graph. here is the code, one helper function to calculate the monthly cumulative values and the plotly filled area scatter object:

def cumulative_df(df, date_term, y_term, v_print):
    v_print('Making the Monthly Sum DF')
    df = df[[date_term, y_term]]
    df = df.set_index(date_term)
    gb = df.groupby(pd.Grouper(freq="M")).sum()

    starts = []
    for index, row in gb.iterrows():
        new_start = index - pd.offsets.MonthBegin(1, normalize=True)
        starts.append([new_start, row.values[0]])

    starts_df = pd.DataFrame(starts, columns=[date_term, y_term])
    starts_df = starts_df.set_index(date_term)
    gb = gb.append(starts_df, sort=False)
    gb.sort_values(date_term, inplace=True)
    return gb

And the plotly call:

        cumulative = [go.Scatter([self.y_column],
                                hovertemplate="Month: %{x} <br>Cumulative Meter " + self.units + ": %{y}",
                                line={'color': self.cum_line_color,}

        scatters = cumulative + scatters

And here’s the output:

1 Like

I Would also welcome a Solution for this issue. I used to use matplotlib and it was possible to specify align=“left”, “right” or “center”

Hey @kcesc04 and @mason_caiby ,

A possible solution would be to use the “xperiod” and “xperiodalignment” parameters as shown in this example:

Worked for me!