Help with multi yaxis graph

📊 Plotly Python
1

Hello! I’m trying to make a multi y-axis graph for a dash app I’m working on, but it isn’t turning out how I like.

Multi-Axis
Multi-Axis969×613 19.7 KB

As you can see the Engine RPM axis is covering part of the graph. I mostly followed the code here.

fig = go.Figure()

        fig.add_trace(
            go.Scatter(
                x = [entry[1] for entry in throttles],
                y = [entry[0] for entry in throttles],
                name = 'Throttle'
            )
        )

        fig.add_trace(
            go.Scatter(
                x = [entry[1] for entry in engine_rpms],
                y = [entry[0] for entry in engine_rpms],
                name = 'Engine RPM',
                yaxis='y2'
            )
        )

        fig.add_trace(
            go.Scatter(
                x = [entry[1] for entry in speeds],
                y = [entry[0] for entry in speeds],
                name = 'Speed',
                yaxis='y3'
            )
        )

        fig.update_layout(
            yaxis=dict(
                title="Throttle",
            ),
            yaxis2=dict(
                title="Engine RPM",
                anchor="free",
                overlaying="y",
                side="left",
                position=0.15
            ),
            yaxis3=dict(
                title="Speed",
                anchor="x",
                overlaying="y",
                side="right"
            ),
            paper_bgcolor='#f9f9f9', 
            plot_bgcolor='#f9f9f9'
        )

Does anyone know what I can do to make the multiple axes look correct?

2

@Krichardson

Plotly allows to reference more than one trace to two cartesian systems with a common xaxis and two different yaxes: a left one and a right one(the latter is called secondary yaxis).

From your trace definition it appears that each trace has different x-data, In this case it is recommended to define subplots.

For more details see these examples: https://plotly.com/python/subplots/

3

Yes each one may have different x data, but each one is using time as the x coordinate. But I think you are correct! I’ll try subplots and then I’ll update on the results. Thank you!

:Edit: @empet So after looking into subplots It will work, but my goal really is to have each one of these metrics on one graph as that is what the user is requesting. Let me explain what is going on with the x data in this case and maybe you can tell if subplots really are required here!

So the data is coming from a logger on a running machine and is stored in a azure database in JSON format. Some of these points of data are recorded every second, and some every minute and since its JSON its okay for some of the data points to be missing. Even though maybe RPM and throttle are posted every second, speed is posted every two seconds would it be possible to have these on the same graph with multiple y axes since all the x data is within the same span of time?