在互动模式下以qwebview开启情节

时间:2017-03-17 20:57:03

标签: javascript python plotly pyqt5 qwebview

我在离线模式下使用plotly库和python,而我正在尝试创建一些情节,将它们保存为本地html并在第二时刻加载到QWebView中。

这是带有虚拟变量的boxplot的代码:

from PyQt5.QtWebKitWidgets import QWebView
import plotly
import plotly.graph_objs as go

x1 = [10, 3, 4, 5, 20, 4, 3]

trace1 = go.Box(
x = x1)

layout = go.Layout(
    showlegend = True
)


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

fn = '/home/matteo/plot.html'
plotly.offline.plot(fig, filename = fn, 
auto_open = False)

view = QWebView()
view.load(QUrl.fromLocalFile(fn))
view.show()

我面临两个主要问题:

  1. 如果我按原样使用代码,QWebView将不会显示图片中的任何内容: enter image description here

  2. 如果我用标准浏览器(例如Firefox)打开html文件,我可以看到并与情节互动,这很好。但是如果我将浏览器中的html页面保存在本地目录中并尝试将保存的文件加载到QWebView我可以看到该情节,但不能与它交互(可能是因为某些Javascript丢失了?!):< / p>

  3. enter image description here

    任何人都有一些想法如何将交互式离线制作图表嵌入到QWebView中?

1 个答案:

答案 0 :(得分:2)

好的,我应该找到问题所在。

似乎QWebView在加载本地文件时遇到一些困难,因为它太重了(简单绘图大约2mb)。

所以我在保存本地文件时使用包含javascript的选项,并在第二时刻加载javascript,谢谢,如{{3}所述}。

换句话说,创建初始的html标签,包括在没有整个javascript代码的情况下生成的图形的结果,并包括javascript的链接。

通过这种方式,文件非常轻,QWebView没有问题可以打开它。

# create the initial html code
raw_html = '<head><meta charset="utf-8" /></head>''<head><meta charset="utf-8" /><script src="https://cdn.plot.ly/plotly-latest.min.js"></script></head>'

# call the plot method without all the javascript code
raw_html += plotly.offline.plot(fig, filename = fn, include_plotlyjs=False)

# close the body and html tags
raw_html += '</body></html>'