Mirror axis (x: bottom and top, y: left and right)

I am using plotly in a python 2.7 environment
I want to create a (Heatmap) plot, showing the axis labels on ALL FOUR sides, i.e. y-axis mirrored from left to right and x-axis mirrored from bottom to top.

With the axis mirror option I can use ‘ticks’ as value to mirror the axis ticks to the opposite side, but no labels are shown.
axis = {“mirror” : “ticks”}

With the axis side option I can move the x-axis from bottom to top and the y-axis from left to right.

But how can I show both axis on the correpsonding opposite side, including ticks and ticklabels?

The following minimal example shows, that the tick markers are mirrored, but not the tick markers.

import plotly.offline as py
import plotly.graph_objs as go

trace = go.Heatmap(z=[[1, 20, 30, 50, 1], [20, 1, 60, 80, 30], [30, 60, 1, -10, 20]],
                   x=['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'],
                   y=['Morning', 'Afternoon', 'Evening'])

# set plot layout  
layout = go.Layout(
    title="<b>Heatmap</b>",
    xaxis={"mirror" : "allticks"}, # x-axis also at top
    yaxis={"mirror" : "allticks"}  # y-axis also at right
)

fig = go.Figure(data=[trace], layout=layout)

py.plot(fig, filename='labelled-heatmap.html')
1 Like

@HeXor Found any solution?

@arshiyan In the example above you should insert ‘side’:

layout = go.Layout(
    title="<b>Heatmap</b>",
    xaxis={"mirror" : "allticks", 'side': 'top'}, 
    yaxis={"mirror" : "allticks", 'side': 'right'}  
)
2 Likes

@arshiyan
No, unfortunately I did not find any solution yet… Apart from the idea to add manual text overlays, but I think there should be a better solution

@empet
This only reproduces my desribed approach with the axis side option, plotting the axis ONLY at top and right. But I want to plot them at ALL FOUR axis!

1 Like

@HeXor - I have also not been able to find a good solution - I think added an additional trace would be a bit numb.

Does anyone if this will be implemented in the layout for plots in plotly?

No solution. A request though: for xaxis, support ‘side’: ‘both’ so that ‘top’ and ‘bottom’ would display the title.

1 Like

It is working here, with side, thanks!

this trick helped me out for my application.