Plotly Chart at Tkinter Python

Question

is it possible to show Plotly chart at Tkinter GUI? I have been trying to make this happens but to no avail.

Here is the code I have (the Plotly code is copied from the Plotly website):

from tkinter import *
import plotly.plotly as py
import plotly.graph_objs as go 

from datetime import datetime
import pandas.io.data as web


mGui = Tk()

mGui.geometry('651x700+51+51')
mGui.title('Plotly at Tkinter')

df = web.DataReader("AAPL", 'yahoo',
                    datetime(2007, 10, 1),
                    datetime(2016, 7, 11))

trace = go.Scatter(x=df.index,
                   y=df.High)


data = [trace]
layout = dict(
    title='Time series with range slider and selectors',
    xaxis=dict(
        rangeselector=dict(
            buttons=list([
                dict(count=1,
                     label='1m',
                     step='month',
                     stepmode='backward'),
                dict(count=6,
                     label='6m',
                     step='month',
                     stepmode='backward'),
                dict(count=1,
                    label='YTD',
                    step='year',
                    stepmode='todate'),
                dict(count=1,
                    label='1y',
                    step='year',
                    stepmode='backward'),
                dict(step='all')
            ])
        ),
        rangeslider=dict(),
        type='date'
    )
)

fig = dict(data=data, layout=layout)
py.iplot(fig)

mGui.mainloop()

Thank you in advance.

Answer 1

According to: https://plotly.com/python/renderers/ The available plotly renderers are:

 ['plotly_mimetype', 'jupyterlab', 'nteract', 'vscode',
 'notebook', 'notebook_connected', 'kaggle', 'azure', 'colab',
 'cocalc', 'databricks', 'json', 'png', 'jpeg', 'jpg', 'svg',
 'pdf', 'browser', 'firefox', 'chrome', 'chromium', 'iframe',
 'iframe_connected', 'sphinx_gallery']

This means that it is not possible to have tkinter directly handle plotly user interactive events. The closest to what you want would hence be to generate a non interactive plotly rendering eg a png/jpg and display it in a tkinter canvas. At least canvas would allow to pan/scan and zoom. Another alternative would be to open a web browser from the tkinter app but this means user will not directly interact with the original tkinter application.

Answer 2

Since

• plotly can be viewed in your browser, and
• this answer says you can embed a 'full-blown chromium browser' in Tkinter,

I imagine it's possible to present an interactive plotly graph in an embedded browser in Tktinter.

If I get a working example I'll post it here.

Answer 3

A possible thing is that convert your ploty into the image you can easily use image into Tkinter

ploty to image first insatall kaleido

pip install -U kaleido

than use this code you don't need to import kaleido

fig.write_image("fig1.png")

in tkinter you can use any label to show image

  img = Image.open('image_name.png')
  tkimage = ImageTk.PhotoImage(img)
  lbl = Label(mGui, image = tkimage)
  lbl.place(x=0, y=0)

  # if not work than use commented line below
  # img = PhotoImage(file='logo.gif')
  # lbl = Label(mGui, image=img)
  # lbl.place(x=0, y=0)

another way for doing this is convert into localhost website and embed it into tkinter

# for installing dash use command 'pip install dash'
import dash
import dash_core_components as dcc
import dash_html_components as html

    # open in website
    app = dash.Dash()
    app.layout = html.Div([
        dcc.Graph(figure=fig)
    ])

    app.run_server(debug=True, use_reloader=False)

now embed it into Tkinter I don't know how it's possible but you can google it.

Edit : you can see it Is it possible to render HTML in Tkinter?