1

I would superpose this 2 next histograms enter image description here To have this histogram (this histogram was obtained after the answer in this discussion) enter image description here when I display them one by one it works but the problem is when I do sublopt (px.histogram)

import plotly.graph_objects as go
from plotly.subplots import make_subplots

# Create figure with secondary y-axis
fig = make_subplots(specs=[[{"secondary_y": True}]])

# Add traces
fig.add_trace(
    px.histogram(data, x="mean_rating"),
    secondary_y=False
)

fig.add_trace(
    go.Scatter(x=[2, 3, 4], y=[4, 5, 6], name="yaxis2 data"),
    secondary_y=True,
)

ValueError: 
    Invalid element(s) received for the 'data' property of 
        Invalid elements include: [Figure({

due at line : fig.add_trace( px.histogram(data, x="mean_rating"),

I cannot incorporate px.histogram

data :

data = {'id': {0: 'TZJHLljE',
  1: 'l1NXvwaE',
  2: 'mIICvQHh',
  3: 'kWKvrqYL',
  4: '9tXo1AUZ'},
 'rated': {0: False, 1: True, 2: True, 3: True, 4: True},
 'created_at': {0: 1504210000000.0,
  1: 1504130000000.0,
  2: 1504130000000.0,
  3: 1504110000000.0,
  4: 1504030000000.0},
 'last_move_at': {0: 1504210000000.0,
  1: 1504130000000.0,
  2: 1504130000000.0,
  3: 1504110000000.0,
  4: 1504030000000.0},
 'turns': {0: 13, 1: 16, 2: 61, 3: 61, 4: 95},
 'victory_status': {0: 'outoftime',
  1: 'resign',
  2: 'mate',
  3: 'mate',
  4: 'mate'},
 'winner': {0: 'white', 1: 'black', 2: 'white', 3: 'white', 4: 'white'},
 'increment_code': {0: '15+2', 1: '5+10', 2: '5+10', 3: '20+0', 4: '30+3'},
 'white_id': {0: 'bourgris',
  1: 'a-00',
  2: 'ischia',
  3: 'daniamurashov',
  4: 'nik221107'},
 'white_rating': {0: 1500, 1: 1322, 2: 1496, 3: 1439, 4: 1523},
 'black_id': {0: 'a-00',
  1: 'skinnerua',
  2: 'a-00',
  3: 'adivanov2009',
  4: 'adivanov2009'},
 'black_rating': {0: 1191, 1: 1261, 2: 1500, 3: 1454, 4: 1469},
 'moves': {0: 'd4 d5 c4 c6 cxd5 e6 dxe6 fxe6 Nf3 Bb4+ Nc3 Ba5 Bf4',
  1: 'd4 Nc6 e4 e5 f4 f6 dxe5 fxe5 fxe5 Nxe5 Qd4 Nc6 Qe5+ Nxe5 c4 Bb4+',
  2: 'e4 e5 d3 d6 Be3 c6 Be2 b5 Nd2 a5 a4 c5 axb5 Nc6 bxc6 Ra6 Nc4 a4 c3 a3 Nxa3 Rxa3 Rxa3 c4 dxc4 d5 cxd5 Qxd5 exd5 Be6 Ra8+ Ke7 Bc5+ Kf6 Bxf8 Kg6 Bxg7 Kxg7 dxe6 Kh6 exf7 Nf6 Rxh8 Nh5 Bxh5 Kg5 Rxh7 Kf5 Qf3+ Ke6 Bg4+ Kd6 Rh6+ Kc5 Qe3+ Kb5 c4+ Kb4 Qc3+ Ka4 Bd1#',
  3: 'd4 d5 Nf3 Bf5 Nc3 Nf6 Bf4 Ng4 e3 Nc6 Be2 Qd7 O-O O-O-O Nb5 Nb4 Rc1 Nxa2 Ra1 Nb4 Nxa7+ Kb8 Nb5 Bxc2 Bxc7+ Kc8 Qd2 Qc6 Na7+ Kd7 Nxc6 bxc6 Bxd8 Kxd8 Qxb4 e5 Qb8+ Ke7 dxe5 Be4 Ra7+ Ke6 Qe8+ Kf5 Qxf7+ Nf6 Nh4+ Kg5 g3 Ng4 Qf4+ Kh5 Qxg4+ Kh6 Qf4+ g5 Qf6+ Bg6 Nxg6 Bg7 Qxg7#',
  4: 'e4 e5 Nf3 d6 d4 Nc6 d5 Nb4 a3 Na6 Nc3 Be7 b4 Nf6 Bg5 O-O b5 Nc5 Bxf6 Bxf6 Bd3 Qd7 O-O Nxd3 Qxd3 c6 a4 cxd5 Nxd5 Qe6 Nc7 Qg4 Nxa8 Bd7 Nc7 Rc8 Nd5 Qg6 Nxf6+ Qxf6 Rfd1 Re8 Qxd6 Bg4 Qxf6 gxf6 Rd3 Bxf3 Rxf3 Rd8 Rxf6 Kg7 Rf3 Rd2 Rg3+ Kf8 c3 Re2 f3 Rc2 Rg5 f6 Rh5 Kg7 Rd1 Kg6 Rh3 Rxc3 Rd7 Rc1+ Kf2 Rc2+ Kg3 h5 Rxb7 Kg5 Rxa7 h4+ Rxh4 Rxg2+ Kxg2 Kxh4 b6 Kg5 b7 f5 exf5 Kxf5 b8=Q e4 Rf7+ Kg5 Qg8+ Kh6 Rh7#'},
 'opening_eco': {0: 'D10', 1: 'B00', 2: 'C20', 3: 'D02', 4: 'C41'},
 'opening_name': {0: 'Slav Defense: Exchange Variation',
  1: 'Nimzowitsch Defense: Kennedy Variation',
  2: "King's Pawn Game: Leonardis Variation",
  3: "Queen's Pawn Game: Zukertort Variation",
  4: 'Philidor Defense'},
 'opening_ply': {0: 5, 1: 4, 2: 3, 3: 3, 4: 5},
 'opening_name_trimmed': {0: 'Slav Defense',
  1: 'Nimzowitsch Defense',
  2: "King's Pawn Game",
  3: "Queen's Pawn Game",
  4: 'Philidor Defense'},
 'mean_rating': {0: 1345.5, 1: 1291.5, 2: 1498.0, 3: 1446.5, 4: 1496.0},
 'count': {0: 1, 1: 1, 2: 1, 3: 1, 4: 1},
 'black': {0: 0, 1: 1, 2: 0, 3: 0, 4: 0},
 'draw': {0: 0, 1: 0, 2: 0, 3: 0, 4: 0},
 'white': {0: 1, 1: 0, 2: 1, 3: 1, 4: 1}}

4
  • @Nathanmonnier You are aware that your histogram will have values in the range of 1200-1500 and that you have x=[2, 3, 4] for you go.Scatter trace? Commented Mar 16, 2021 at 17:21
  • This answer shows examples of how to overlay histograms using Plotly. Commented Mar 16, 2021 at 17:22
  • 1
    @S3DEV Indeed it does (+1), but those cases don't suffer from wildly different x-values. Commented Mar 16, 2021 at 17:57
  • 1
    @vestland - Ah yes, fair play. Nice / clean effort in your answer. (+1). Commented Mar 16, 2021 at 21:01

1 Answer 1

2

The error:

ValueError: 
    Invalid element(s) received for the 'data' property of 
        Invalid elements include: [Figure({

...is raised because you're trying to use a Figure object (returned by px.histogram) as an argument where such an object is not accepted. fig.add_trace() accepts traces such as plotly.graph_objs._scatter (returned by go.Scatter). That does not mean that what you're trying to do here is impossible though. Only a bit cumbersome.

The fact that your histogram will have values in the range of 1200-1500 and your scatter trace has x=[2, 3, 4] poses a challenge as long as you'd like to have a shared x-axis. If that's not necessarily the case you can set up double y-axes and double x-axes. I don't know if you'd prefer to handle the rest with go.Histogram or px.histogram. I often see cases where users like to run px.histogram, and then build on that. And you can set up a px.histogram, "steal" the values from there and use them in go.Histogram traces and combine them with go.Scatter traces. The code snippet below does just that to produce this figure:

enter image description here

import numpy as np
import plotly.graph_objects as go
from plotly.subplots import make_subplots
import pandas as pd
import plotly.express as px

data = {'id': {0: 'TZJHLljE',
  1: 'l1NXvwaE',
  2: 'mIICvQHh',
  3: 'kWKvrqYL',
  4: '9tXo1AUZ'},
 'rated': {0: False, 1: True, 2: True, 3: True, 4: True},
 'created_at': {0: 1504210000000.0,
  1: 1504130000000.0,
  2: 1504130000000.0,
  3: 1504110000000.0,
  4: 1504030000000.0},
 'last_move_at': {0: 1504210000000.0,
  1: 1504130000000.0,
  2: 1504130000000.0,
  3: 1504110000000.0,
  4: 1504030000000.0},
 'turns': {0: 13, 1: 16, 2: 61, 3: 61, 4: 95},
 'victory_status': {0: 'outoftime',
  1: 'resign',
  2: 'mate',
  3: 'mate',
  4: 'mate'},
 'winner': {0: 'white', 1: 'black', 2: 'white', 3: 'white', 4: 'white'},
 'increment_code': {0: '15+2', 1: '5+10', 2: '5+10', 3: '20+0', 4: '30+3'},
 'white_id': {0: 'bourgris',
  1: 'a-00',
  2: 'ischia',
  3: 'daniamurashov',
  4: 'nik221107'},
 'white_rating': {0: 1500, 1: 1322, 2: 1496, 3: 1439, 4: 1523},
 'black_id': {0: 'a-00',
  1: 'skinnerua',
  2: 'a-00',
  3: 'adivanov2009',
  4: 'adivanov2009'},
 'black_rating': {0: 1191, 1: 1261, 2: 1500, 3: 1454, 4: 1469},
 'moves': {0: 'd4 d5 c4 c6 cxd5 e6 dxe6 fxe6 Nf3 Bb4+ Nc3 Ba5 Bf4',
  1: 'd4 Nc6 e4 e5 f4 f6 dxe5 fxe5 fxe5 Nxe5 Qd4 Nc6 Qe5+ Nxe5 c4 Bb4+',
  2: 'e4 e5 d3 d6 Be3 c6 Be2 b5 Nd2 a5 a4 c5 axb5 Nc6 bxc6 Ra6 Nc4 a4 c3 a3 Nxa3 Rxa3 Rxa3 c4 dxc4 d5 cxd5 Qxd5 exd5 Be6 Ra8+ Ke7 Bc5+ Kf6 Bxf8 Kg6 Bxg7 Kxg7 dxe6 Kh6 exf7 Nf6 Rxh8 Nh5 Bxh5 Kg5 Rxh7 Kf5 Qf3+ Ke6 Bg4+ Kd6 Rh6+ Kc5 Qe3+ Kb5 c4+ Kb4 Qc3+ Ka4 Bd1#',
  3: 'd4 d5 Nf3 Bf5 Nc3 Nf6 Bf4 Ng4 e3 Nc6 Be2 Qd7 O-O O-O-O Nb5 Nb4 Rc1 Nxa2 Ra1 Nb4 Nxa7+ Kb8 Nb5 Bxc2 Bxc7+ Kc8 Qd2 Qc6 Na7+ Kd7 Nxc6 bxc6 Bxd8 Kxd8 Qxb4 e5 Qb8+ Ke7 dxe5 Be4 Ra7+ Ke6 Qe8+ Kf5 Qxf7+ Nf6 Nh4+ Kg5 g3 Ng4 Qf4+ Kh5 Qxg4+ Kh6 Qf4+ g5 Qf6+ Bg6 Nxg6 Bg7 Qxg7#',
  4: 'e4 e5 Nf3 d6 d4 Nc6 d5 Nb4 a3 Na6 Nc3 Be7 b4 Nf6 Bg5 O-O b5 Nc5 Bxf6 Bxf6 Bd3 Qd7 O-O Nxd3 Qxd3 c6 a4 cxd5 Nxd5 Qe6 Nc7 Qg4 Nxa8 Bd7 Nc7 Rc8 Nd5 Qg6 Nxf6+ Qxf6 Rfd1 Re8 Qxd6 Bg4 Qxf6 gxf6 Rd3 Bxf3 Rxf3 Rd8 Rxf6 Kg7 Rf3 Rd2 Rg3+ Kf8 c3 Re2 f3 Rc2 Rg5 f6 Rh5 Kg7 Rd1 Kg6 Rh3 Rxc3 Rd7 Rc1+ Kf2 Rc2+ Kg3 h5 Rxb7 Kg5 Rxa7 h4+ Rxh4 Rxg2+ Kxg2 Kxh4 b6 Kg5 b7 f5 exf5 Kxf5 b8=Q e4 Rf7+ Kg5 Qg8+ Kh6 Rh7#'},
 'opening_eco': {0: 'D10', 1: 'B00', 2: 'C20', 3: 'D02', 4: 'C41'},
 'opening_name': {0: 'Slav Defense: Exchange Variation',
  1: 'Nimzowitsch Defense: Kennedy Variation',
  2: "King's Pawn Game: Leonardis Variation",
  3: "Queen's Pawn Game: Zukertort Variation",
  4: 'Philidor Defense'},
 'opening_ply': {0: 5, 1: 4, 2: 3, 3: 3, 4: 5},
 'opening_name_trimmed': {0: 'Slav Defense',
  1: 'Nimzowitsch Defense',
  2: "King's Pawn Game",
  3: "Queen's Pawn Game",
  4: 'Philidor Defense'},
 'mean_rating': {0: 1345.5, 1: 1291.5, 2: 1498.0, 3: 1446.5, 4: 1496.0},
 'count': {0: 1, 1: 1, 2: 1, 3: 1, 4: 1},
 'black': {0: 0, 1: 1, 2: 0, 3: 0, 4: 0},
 'draw': {0: 0, 1: 0, 2: 0, 3: 0, 4: 0},
 'white': {0: 1, 1: 0, 2: 1, 3: 1, 4: 1}}

data = pd.DataFrame(data)

fig=make_subplots(
        specs=[[{"secondary_y": True}]])

fig.update_layout(xaxis2= {'anchor': 'y', 'overlaying': 'x', 'side': 'top'},
                  yaxis_domain=[0, 0.94]);


hist = px.histogram(data, x="mean_rating")

fig.add_trace(
    go.Histogram(x=hist.data[0].x,
           y=hist.data[0].y,
           name="histogram trace, left y and lower x",
          ), secondary_y=False)
fig.add_trace(
    go.Scatter(x=[2, 3, 4],
               y=[4, 5, 6],
               name="Scatter trace, right y and upper x",
               line_color="#ee0000"), secondary_y=True)
fig.data[1].update(xaxis='x2')
fig.update_layout(width=700, height=475)
fig.show()
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.