Example of rendering a matplotlib image directly to Flask view

flaskplotlib.py

from flask import Flask, make_response
app = Flask(__name__)

@app.route("/simple.png")
def simple():
    import datetime
    import StringIO
    import random

    from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
    from matplotlib.figure import Figure
    from matplotlib.dates import DateFormatter

    fig=Figure()
    ax=fig.add_subplot(111)
    x=[]
    y=[]
    now=datetime.datetime.now()
    delta=datetime.timedelta(days=1)
    for i in range(10):
        x.append(now)
        now+=delta
        y.append(random.randint(0, 1000))
    ax.plot_date(x, y, '-')
    ax.xaxis.set_major_formatter(DateFormatter('%Y-%m-%d'))
    fig.autofmt_xdate()
    canvas=FigureCanvas(fig)
    png_output = StringIO.StringIO()
    canvas.print_png(png_output)
    response=make_response(png_output.getvalue())
    response.headers['Content-Type'] = 'image/png'
    return response


if __name__ == "__main__":
    app.run()

Yo this is awesome. Thank you and works perfectly out of the box.

Thanks, this has given me some ideas!

Thanks! I teaching my stats class using Python and this is very helpful.

Just what I was looking for. Thanks!

I have a problem that when render matplot image directly into flask view , I loose my basic features of matplot image(like now it donot show coordinates when hovering over the image ,now I cannot zoom into a particular portion of image etc ) . Can you suggest how can I render matplotimage into flask and still having these features of images ? (I am able to do that using pygal but not matplot lib)
Thanks in advance :)

Thanks Andy. :)

Great! thanks that works wonderfully.
Is there a way that I can do something like that and using Drawnow() and plotting a PNG image that will show my graph and also interactive mode.
I was trying to figure that ourt and I am getting always Error with $DISPLAY.
Thanks.

thanks !

Patch to make this work with python 3

15:18 $ diff -u /tmp/fa2.py /tmp/fa.py 
--- /tmp/fa2.py	2017-01-25 15:18:03.000000000 -0500
+++ /tmp/fa.py	2017-01-25 15:13:33.000000000 -0500
@@ -5,7 +5,7 @@
 @app.route("/simple.png")
 def simple():
     import datetime
-    import StringIO
+    from io import BytesIO
     import random
 
     from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
@@ -26,7 +26,7 @@
     ax.xaxis.set_major_formatter(DateFormatter('%Y-%m-%d'))
     fig.autofmt_xdate()
     canvas=FigureCanvas(fig)
-    png_output = StringIO.StringIO()
+    png_output = BytesIO()
     canvas.print_png(png_output)
     response=make_response(png_output.getvalue())
     response.headers['Content-Type'] = 'image/png'

Hi Thanks for the example. What is I want to put he result back to same home url. What changes I have to do?

This is a good example but what if i wanted to show this image in my Html <img> tag dynamically without downloading it. I mean within my Markup.

This works quite well. However, after reloading the image a few times, I get errors like this:

Exception RuntimeError: RuntimeError('main thread is not in main loop',) in <bound method PhotoImage.__del__ of <Tkinter.PhotoImage instance at 0x7f5889efcc68>> ignored Tcl_AsyncDelete: async handler deleted by the wrong thread Aborted (core dumped)

or
Tcl_AsyncDelete: cannot find async handler

this doesn't work in pythonanywhere.com anymore. is it maybe outdated? I keep getting a 404 URL not found

mark

from flask import Flask, make_response
app = Flask(name)

@app.route("/simple.png")
def simple():
import datetime
from io import BytesIO

import random

from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
from matplotlib.figure import Figure
from matplotlib.dates import DateFormatter

fig=Figure()
ax=fig.add_subplot(111)
x=[]
y=[]
now=datetime.datetime.now()
delta=datetime.timedelta(days=1)
for i in range(10):
    x.append(now)
    now+=delta
    y.append(random.randint(0, 1000))
ax.plot_date(x, y, '-')
ax.xaxis.set_major_formatter(DateFormatter('%Y-%m-%d'))
fig.autofmt_xdate()
canvas=FigureCanvas(fig)
png_output =   BytesIO()
canvas.print_png(png_output)
response=make_response(png_output.getvalue())
response.headers['Content-Type'] = 'image/png'
return response

if name == "main":
app.run(debug=True)

it is working