Изображение, созданное в представлениях, не отображается в шаблоне django

Question

Я пытаюсь сделать простой график, который я создаю с помощью matplotlib в моем шаблоне. Я хочу отобразить график в теле страницы, а не просто вернуть HttpResponse с этим графиком. Но я не могу заставить его работать. Вот что я попробовал.

views.py код

def showGraph(request):

content_x = [10, 20, 30]
content_y = ['one', 'two', 'three']
plt.bar(content_x, content_y)
plt.title('Some chart')
plt.show()
buffer = io.BytesIO()
canvas = plt.get_current_fig_manager().canvas
canvas.draw()
graphIMG = PIL.Image.frombytes('RGB', canvas.get_width_height(), canvas.tostring_rgb())
graphIMG.save(buffer, "PNG")
content_type = "Image/png"
buffercontent = buffer.getvalue()
graphic = (buffercontent, content_type)
plt.close()
return render(request, 'projectRelated/LAN/graphs.html', {'graphic': graphic})

html код страницы

{% extends 'base.html' %}
{% load static %}
{% block container_content %}
  <img src="data:image/png;base64,{{ graphic }}">
{% endblock container_content %}

Приведенный выше код просто отображает случайный значок ..

Answer 1

Хорошо, я понял это! Как я уже сказал, я не хочу возвращать HttpResponse графика, я хотел как-то сохранить картинку и отобразить ее на моей странице html. Я сделал это так ..

views.py code

def show_graph(request):

values_x = [10, 20, 30]
values_y = ['first', 'second', 'third']
plt.title('My chart')
plt.plot(values_x, values_y)
plt.legend()
plt.show()
canvas = plt.get_current_fig_manager().canvas
canvas.draw()
pil_image = PIL.Image.frombytes('RGB', canvas.get_width_height(), canvas.tostring_rgb())
plt.close()
pil_image.save('static/images/result_graph.png')
return render(request, 'projectRelated/LAN/graphs.html', context={})

my html. html

<img src="{% static 'images/result_graph.png' %}">

Я не знаю, является ли это хорошим решением, что я сохраняю изображение в моей папке c. Но это было единственное, что я мог найти, чтобы отобразить изображение в теле моей страницы. Дайте мне знать, если это хорошее решение, и спасибо за ваше время!

Answer 2

Поскольку я не могу расшифровать ваши шестнадцатеричные значения, чтобы увидеть, что происходит, лучший способ обойти это - сохранить изображение в media dir и просто передать path в шаблон для его рендеринга. в шаблоне.

x. html

{% block main %}
    <img src="{{ media_url }}{{ image.file }}">
{% endblock %}

In settings.py

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(PROJECT_PATH, 'media')

См. здесь для примера

Вы можете читать больше на документах от здесь