How to show plotly graphic on PyQt5 Application

Question

I try to show the plotly graph in one of application’s window.

But this graph does not scale when the window changes.

How can I fix it?

Here is begin of class Main Window

class MainWindow(QWidget, From_Main):
    def __init__(self):
        super(MainWindow, self).__init__()
        QWidget.__init__(self)
        self.setupUi(self)
        
        self.browser = QtWebEngineWidgets.QWebEngineView(self)
        
        vlayout = QtWidgets.QVBoxLayout(self)
        vlayout.addWidget(self.BtnDescribe, alignment=QtCore.Qt.AlignHCenter)
        self.browser.setGeometry(QtCore.QRect(730, 170, 444, 596))

Here is def plotter, which creates my plot

    def plotter(self):
        df_period = self.all_data.loc[:len(self.all_data)-13]
        df_predict = self.all_data.loc[len(self.all_data)-12:]
        fig = go.Figure()
        fig.add_trace(go.Scatter(x=df_period.index, y=df_period['value'], mode='lines', name='value'))
        fig.add_trace(go.Scatter(x=df_predict.index, y=df_predict['value'], mode='lines', opacity=0.7, name='value_true'))
        fig.add_trace(go.Scatter(x=df_predict.index, y=df_predict['value_predict'], mode='lines',  name='value_predict'))
        self.browser.setHtml(fig.to_html(include_plotlyjs='cdn'))

I tried to make auto scaled plotly graph but crashed

I expect to have code which gives me auto scaled plotly graph

Asked By: Ivan

||

Source

Answer 1

You already have a layout, you cannot set a new one; instead, you need to add the view to it.

Go to Designer, select the parent widget in which you want to add the browser, if it already has an existing layout to which you can add the view, then scroll down to the end of the property editor and get its layoutName.

Finally, in the code, use self.<layout name>.addWidget(self.browser).

If it’s a grid layout, you need to check the actual row and column of the cell position in which you want to add the view. Eventually, you can add a child layout as a "placeholder" by dragging it from the widget box; in that case, that new layout will be the one to which you’ll add the view.

Note that, if you cannot add QWebEngineView from Designer, you can always add a QWidget as a placeholder and then promote it.

Answered By: musicamante

How to show plotly graphic on PyQt5 Application

Question:

Answers: