Matplotlib checkbox in template

Question

I have a pretty novice question. Is it possible to display dynamically processed matplotlib images (as shown in https://gist.github.com/wilsaj/862153 or https://gist.github.com/rduplain/1641344 ) directly via render_template (...) or do I need use app.route ('... /')? The goal is to show a custom (scientific) storyline inside the website.

Is there any clean solution if I want to pass an array (or several variables) to a chart function?

Sorry, if this is a trivial question, but I'm not sure how to solve this problem. Best regards, Martin

Answer 1

For this you need to use two routes and a template.

The route displaying the page will call render_template() using the HTML page template. The template contains HTML for the page, but not PNG data.

In the place where the PNG image is located, you need to insert the <img> element, as if you were trying to display a static image.

The trick is that the src attribute of this image points to the second route. You can generate it using url_for() . For instance:

 <img src="{{ url_for('mypng', data = some_data) }}"> 

When the browser receives the HTML code, it will find a link to the image and download that URL. This will execute the second route on the server.

This second route generates PNG data and returns it as a response without a template and sets the image/png content type so that the browser displays it as an image. This second route will be encoded, as shown in the two links to which you referred.

Hope this helps!