Announcing Dash Bio 1.0.0 🎉 : a one-stop-shop for bioinformatics and drug development visualizations.

How to Create Multiple X-axis and Y-axis At the Same Time?

Hello there,

I am trying to create a plot with multiple x-y axes. There is a “bar chart” and also a “line chart” at the same time. I just want to add the “same x-axis” to also the upside of the chart.

import plotly.graph_objects as go

fig = go.Figure(
    data=[
        go.Bar(name='Ranking Count', x=df_average[("count","rank")], y=df_average.index[:10], yaxis='y', xaxis="x", offsetgroup=1, orientation="h", text=df_average[("count","rank")]),
        go.Scatter(name='Average Ranking', x=df_average[("mean","rank")], y=df_average.index[:10], yaxis='y2', xaxis="x2", orientation="h", text=df_average[("mean","rank")])
    ],
    layout={
        'yaxis': {'title': 'SERP Appearence Count'},
        'yaxis2': {'title': 'Average Ranking', 'overlaying': 'y', 'side': 'right'},
        "title": "Ranking Domains and Their General Situation",
        "legend_title":"Legend",
        "font":{"family":"Open-Sans","size":15,"color":"RebeccaPurple"}
    },

)
# Change the bar mode
fig.update_layout(barmode='group', bargap=0.5, width=1000, height=500,   legend=dict(
    yanchor="top",
    y=1.5,
    xanchor="right",
    x=1.3))
fig.show()

@KorayTugberk-G

Is this what you are looking for:

import plotly.graph_objects as go
import numpy as np


fig = go.Figure(
    data=[
        go.Bar(name='Ranking Count', x=np.random.randint(3, 9, 5), y=np.arange(5),
                yaxis='y', xaxis="x", offsetgroup=1, orientation="h"),#, #text=df_average[("count","rank")]),
        go.Scatter(name='Average Ranking', x=np.arange(-1, 5), y=3+2*np.random.rand(6), 
                   yaxis='y2', xaxis="x2")#, orientation="h", text=df_average[("mean","rank")])
    ],
    layout={
        'yaxis': {'title': 'SERP Appearence Count'},
        'yaxis2': {'title': 'Average Ranking', 'overlaying': 'y', 'side': 'right'},
        'xaxis2': {'title': 'xaxis2 title', 'side': 'top', 'overlaying': 'x'},
        "title": "Ranking Domains and Their General Situation",
        "legend_title":"Legend",
        "font":{"family":"Open-Sans","size":15,"color":"RebeccaPurple"}
    },

)
# Change the bar mode
fig.update_layout( bargap=0.5, width=1000, height=500,   legend=dict(
    yanchor="top",
    y=1.5,
    xanchor="right",
    x=1.3))


I’ve just modified data, and added the settings for xaxis2.

1 Like