KansaiRobot
KansaiRobot

Reputation: 10032

How do you rotate the axis of a plot in Plotly?

I have the following plot done in Plotly

A plot

As you can see the X,Y axis are in the traditional way. How can I rotate the axis so that X is plot vertically and Y horizontally (to the left)?

(also I would like to modify the reach and separations of each axis)

I suppose it has to do something with the layout element.

My code if so far

layout= go.Layout(title=go.layout.Title(text=title,x=0.5),
        xaxis={'title':'x[m]'},
        yaxis={'title':'y[m]'})

    point_plot=[
            go.Scatter(x=[series[listoflabels[0]]],y=[series[listoflabels[1]]],name="V0"),
            go.Scatter(x=[series[listoflabels[2]]],y=[series[listoflabels[3]]],name="GT"),
            go.Scatter(x=[0],y=[0],name="egoCar")
            ]

    return go.Figure(data=point_plot, layout=layout)

EDIT:

In order to make it reproducible I modified the code to

layout1= go.Layout(title=go.layout.Title(text="A graph",x=0.5),
        xaxis={'title':'x[m]'},
        yaxis={'title':'y[m]'})

point_plot=[
            go.Scatter(x=[3],y=[1],name="V0"),
            go.Scatter(x=[5],y=[2],name="GT"),
            go.Scatter(x=[0],y=[0],name="egoCar")
    ]
            
go.Figure(data=point_plot, layout=layout1).show()

and the plot is

enter image description here

Upvotes: 4

Views: 7761

Answers (2)

hrokr
hrokr

Reputation: 3569

Derek O hit on what is the easiest to implement. It's the graph analogy of 1km is 0.6 miles or a, b = b, a

A second option is to abstract the data and your axes. That's essentially saying the same thing but can be easier to read as Plotly has a unique ability to turn clear, well-structured Python into ugly JS without parenthesis pretty quickly.

Option three is to further abstract this and have it set your axes for you.

Upvotes: 1

Derek O
Derek O

Reputation: 19635

I am not aware that Plotly has any built-in method to switch x- and y-axes. However, you can achieve this yourself but switching the titles of the x- and y-axes, then switching the parameters x and y that correspond to your points.

Then you can place the y-axis (containing your x-coordinates) on the right side in your layout, and reverse the range of the x-axis (containing your y-coordinates) so that the origin is in the lower-right side.

import plotly.graph_objects as go

# switch the axes titles
layout1= go.Layout(title=go.layout.Title(text="A graph",x=0.5),
        xaxis={'title':'y[m]'},
        yaxis={'title':'x[m]', 'side':'right'})

# switch the x- and y-coordinates
point_plot=[
            go.Scatter(y=[3],x=[1],name="V0"),
            go.Scatter(y=[5],x=[2],name="GT"),
            go.Scatter(y=[0],x=[0],name="egoCar")
    ]


fig = go.Figure(data=point_plot, layout=layout1)

# reverse the range of the xaxis (which contains the y values)
fig.update_xaxes(autorange="reversed")
fig.show()

enter image description here

Upvotes: 3

Related Questions