I'm very new to Flask and Matplotlib. I'd like to be able to show a simple chart I generated in some html, but I'm having a very hard time figuring out how. Here is my Python code:
from flask import Flask, render_template import numpy as np import pandas import matplotlib.pyplot as plt app = Flask(__name__) variables = pandas.read_csv('C:\\path\\to\\variable.csv') price =variables['price'] @app.route('/test') def chartTest(): lnprice=np.log(price) plt.plot(lnprice) return render_template('untitled1.html', name = plt.show()) if __name__ == '__main__': app.run(debug = True)
And here is my HTML:
<!doctype html> <html> <body> <h1>Price Chart</h1> <p>{{ name }}</p> <img src={{ name }} alt="Chart" height="42" width="42"> </body> </html>
Work with threadsMatplotlib is not thread-safe: in fact, there are known race conditions that affect certain artists. Hence, if you work with threads, it is your responsibility to set up the proper locks to serialize access to Matplotlib artists. You may be able to work on separate figures from separate threads.
plt. show() starts an event loop, looks for all currently active figure objects, and opens one or more interactive windows that display your figure or figures. The plt. show() command does a lot under the hood, as it must interact with your system's interactive graphical backend.
You can generate the image on-the-fly in Flask URL route handler:
import io import random from flask import Response from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas from matplotlib.figure import Figure @app.route('/plot.png') def plot_png(): fig = create_figure() output = io.BytesIO() FigureCanvas(fig).print_png(output) return Response(output.getvalue(), mimetype='image/png') def create_figure(): fig = Figure() axis = fig.add_subplot(1, 1, 1) xs = range(100) ys = [random.randint(1, 50) for x in xs] axis.plot(xs, ys) return fig
Then you need to include the image in your HTML template:
<img src="/plot.png" alt="my plot">
As @d parolin pointed out, the figure generated by matplotlib
will need to be saved before being rendered by the HTML. In order to serve images in flask
by HTML, you will need to store the image in your flask
file directory:
static/ images/ plot.png --> store plots here templates/
Therefore, in your application, use plt.savefig
:
@app.route('/test') def chartTest(): lnprice=np.log(price) plt.plot(lnprice) plt.savefig('/static/images/new_plot.png') return render_template('untitled1.html', name = 'new_plot', url ='/static/images/new_plot.png')
Then in untitled1.html
:
<p>{{ name }}</p> <img src={{ url}} alt="Chart" height="42" width="42">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With