我的代码基于这个问题的答案text
但是当我将它放在 PyQt5 的 QWebEngineView 上时，当我平移或缩放时它不会同步或执行任何操作 Python代码：
import sys
from PyQt5.QtWidgets import QApplication, QMainWindow, QVBoxLayout, QWidget
from PyQt5.QtWebEngineWidgets import QWebEngineView
class SynchronizedPlotWindow(QMainWindow):
def __init__(self):
super().__init__()
# Crear vistas web para las gráficas
self.graph1 = QWebEngineView()
self.graph2 = QWebEngineView()
self.graph3 = QWebEngineView()
# Cargar el contenido HTML con las gráficas sincronizadas
html_content = """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Plotly Synchronized Charts</title>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<h2>Resize any chart, the others will get the same zoom level applied</h2>
<div id="myDiv"></div>
<div id="myDiv2"></div>
<div id="myDiv3"></div>
<script>
var myDiv = document.getElementById("myDiv");
var myDiv2 = document.getElementById("myDiv2");
var myDiv3 = document.getElementById("myDiv3");
var startTime = new Date().getTime();
var timeStep = 60000;
var myDivMax = 70;
var myDiv2Max = 9000;
var myDiv3Max = 500;
var d3 = Plotly.d3,
N = 40,
x = d3.range(N).map(() => {
return new Date((startTime += timeStep));
}),
y = d3.range(N).map(() => Math.random() * myDivMax),
data = [{ x: x, y: y }];
var layout = {
height: 200,
margin: { l: 45, t: 5, r: 45, b: 45 },
xaxis: {
tickfont: {
size: 10,
color: "#7f7f7f"
}
},
yaxis: {
fixedrange: true,
tickfont: {
size: 10,
color: "#7f7f7f"
}
}
};
var layout2 = {
height: 200,
margin: { l: 45, t: 5, r: 45, b: 45 },
xaxis: {
tickfont: {
size: 10,
color: "#7f7f7f"
}
},
yaxis: {
fixedrange: true,
tickfont: {
size: 10,
color: "#7f7f7f"
}
}
};
var layout3 = {
height: 200,
margin: { l: 45, t: 5, r: 45, b: 45 },
xaxis: {
tickfont: {
size: 10,
color: "#7f7f7f"
}
},
yaxis: {
fixedrange: true,
tickfont: {
size: 10,
color: "#7f7f7f"
}
}
};
Plotly.plot(myDiv, data, layout);
var data2 = [{ x: x, y: d3.range(N).map(() => Math.random() * myDiv2Max) }];
Plotly.plot(myDiv2, data2, layout2);
var data3 = [{ x: x, y: d3.range(N).map(() => Math.random() * myDiv3Max) }];
Plotly.plot(myDiv3, data3, layout3);
var divs = [myDiv, myDiv2, myDiv3];
function relayout(ed, divs) {
if (Object.entries(ed).length === 0) {return;}
divs.forEach((div, i) => {
let x = div.layout.xaxis;
if (ed["xaxis.autorange"] && x.autorange) return;
if (x.range[0] != ed["xaxis.range[0]"] ||x.range[1] != ed["xaxis.range[1]"])
{
var update = {
'xaxis.range[0]': ed["xaxis.range[0]"],
'xaxis.range[1]': ed["xaxis.range[1]"],
'xaxis.autorange': ed["xaxis.autorange"],
};
Plotly.relayout(div, update);
}
});
}
var plots = [myDiv, myDiv2, myDiv3];
plots.forEach(div => {
div.on("plotly_relayout", function(ed) {
relayout(ed, divs);
});
});
</script>
</body>
</html>
"""
# Cargar el contenido HTML en cada gráfico
self.graph1.setHtml(html_content)
self.graph2.setHtml(html_content)
self.graph3.setHtml(html_content)
# Disposición de los widgets
layout = QVBoxLayout()
layout.addWidget(self.graph1)
layout.addWidget(self.graph2)
layout.addWidget(self.graph3)
container = QWidget()
container.setLayout(layout)
self.setCentralWidget(container)
if __name__ == "__main__":
app = QApplication(sys.argv)
window = SynchronizedPlotWindow()
window.show()
sys.exit(app.exec_())
我已经尝试更新plotly和QWebEngineView并从plotly中删除缓存，但似乎没有任何效果，当我使用原始问题中的html代码时，它按预期工作
所以我也遇到了这个问题，对我来说，在引擎内使用破折号来管理绘图解决了我的所有问题。