Отправка изображения в качестве аргумента в render () в представлениях Django - PullRequest
0 голосов
/ 04 марта 2019

Я пытаюсь создать веб-приложение, которое показывает пользователю изменение его веса с течением времени.Поэтому я пытаюсь построить линейный график.Я хочу использовать matplotlib или аналогичную библиотеку внутри моего файла представлений для построения графика.
Этот ответ объясняет, как можно построить график с помощью представлений Django.

Мой кодв файле views.py выглядит так: (не нужно подробно читать, все работает нормально)

from django.shortcuts import render, HttpResponseRedirect, HttpResponse
from .forms import DiabetesForm
from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
from matplotlib.figure import Figure
import matplotlib as plt
from matplotlib.dates import DateFormatter
import datetime
import random
import io


def mplimage(request):
    f = Figure()
    ax = f.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'))
    f.autofmt_xdate()

    buf = io.BytesIO()
    canvas = FigureCanvas(f)
    canvas.print_png(buf)
    response=HttpResponse(buf.getvalue(),content_type='image/png')
    # if required clear the figure for reuse
    f.clear()
    # I recommend to add Content-Length for Django
    response['Content-Length'] = str(len(response.content))
    #
    return response

И код в urls.py:

from django.urls import path, include
from . import views
urlpatterns = [
    path('', views.mplimage, name='home'),

]

Однако,этот код показывает только построенное изображение (которое было сгенерировано в файле views.py) на странице HTML.
Что я хочу:
Я хочу передать сгенерированное изображение и имя шаблона вместе в функции рендеринга, чтобыкроме изображения я могу также записать другую информацию / контент.

Другими словами, я хочу использовать переданное изображение на моей HTML-странице, которое также может содержать другой контент.

Любой другой метод, с помощью которого я могу выполнить эту работу, также будет высоко оценен.

Редактировать: Я не очень разбираюсь в javascript, поэтому, пожалуйста, не давайте ответов, связанных с javascript, если нет другого метода.

Edit2: здесь обновленный и рабочий код, предложенный @Mikhail (второй метод):

from django.shortcuts import render, HttpResponseRedirect, HttpResponse
from .forms import DiabetesForm
from matplotlib.backends.backend_agg import FigureCanvasAgg as FigureCanvas
from matplotlib.figure import Figure
import matplotlib as plt
from matplotlib.dates import DateFormatter
import datetime
import random
import io
import base64


def mplimage(request):
    f = Figure()
    ax = f.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'))
    f.autofmt_xdate()

    buf = io.BytesIO()
    canvas = FigureCanvas(f)
    canvas.print_png(buf)
    response=HttpResponse(buf.getvalue(),content_type='image/png')
    # if required clear the figure for reuse
    img_str = base64.b64encode(buf.getvalue())
    data_url = 'data:image/jpg;base64,' + base64.b64encode(buf.getvalue()).decode()
    f.clear()
    # I recommend to add Content-Length for Django
    #response['Content-Length'] = str(len(response.content))
    #
    #return response
    return render(request, "display.html", {'image': data_url })

Вот файл display.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Display</title>
</head>
<body>
    <img src="{{ image }}" alt=""/>
    <h1>Write whatever you want</h1>
</body>
</html>

1 Ответ

0 голосов
/ 04 марта 2019

То, что вы хотите, это встроить изображение в HTML-страницу.

Здесь я вижу два варианта:

  1. Загрузить изображение отдельно:
    С этимвариант вы создадите два вида Django.Один будет отображать изображение, а другой - содержимое HTML с тегом <img>, относящимся к изображению.Таким образом, пользователь откроет URL-адрес HTML и увидит там изображение.

  2. Возвращает страницу HTML с изображением, встроенным в виде data: URL :
    Вам нужно будет преобразовать ваше изображение из строки байтов (buf.getvalue() в вашем коде) в строку base64 и создать URL-адрес в форме data:image/png;base64,YOUR_IMAGE_BASE64_CONTENT, а затем добавить тег <img> с набором src к созданному URL-адресу.

...