1

我的问题

我正在我的 Django 应用程序中创建一个交互式绘图。我为绘图模板创建了一个视图和一个仅生成绘图本身的视图，以便我可以使用<img src= "{% url 'ozmod:plot' %}"/>精美的绘图模板来渲染绘图。

如果我导航到我分配给绘图模板视图的 URL，我会看到一个损坏的图像链接，但导航栏和一切都很好。如果我直接导​​航到该图的 URL，则该图可以正常显示，但是当然，导航栏和 page.html 中的所有内容都没有扩展。我已经包含了我的错误和我的代码的屏幕截图：

视图.py

class PlotView(generic.TemplateView):
    template_name = 'ozmod/plot.html'

def RunOZCOT(request):
    fig = plt.figure()
    x = range(20)
    y = [i for i in range(20)]
    random.shuffle(y)
    plot = plt.plot(x,y)
    g = mpld3.fig_to_html(fig)
    return HttpResponse(g)

网址.py

app_name = 'ozmod'
urlpatterns = [
    path('', views.HomePageView.as_view(), name='home'),
    path('metfiles/', views.MetIndexView.as_view(), name='metindex'),
    path('metfiles/<int:pk>/', views.DetailView.as_view(), name='detail'),
    path('runmodel/', views.PlotView.as_view(), name = 'runmodel'),
    path('plot/', views.RunOZCOT, name = 'plot'),
]

绘图.html

{% extends "ozmod/page.html" %}

{% block content %}

<img src= "{% url 'ozmod:plot' %}"/> 
<!-- http://myserver:8000/ozmod/plot/ -->

{% endblock %}

page.html ...为清楚起见缩写

{% load static %}

<!DOCTYPE html>
<head>
  <title>OZCOT interactive</title>
</head>
<body>

<ul class="nav nav-pills">
  <li class="{% if request.resolver_match.url_name == "home" %}active{% endif %}"><a href="{% url 'ozmod:home' %}">Home</a></li>
  <li class="{% if request.resolver_match.url_name == "metindex" %}active{% endif %}"><a href="{% url 'ozmod:metindex' %}">MetIndex</a></li>
  <li class="{% if request.resolver_match.url_name == "runmodel" %}active{% endif %}"><a href="{% url 'ozmod:runmodel' %}">Plot</a></li>
</ul>

<div class="container-fluid text-center">
    {% block content %}{% endblock content %}
</div>

<nav class="navbar navbar-default navbar-fixed-bottom">
        <div class="container">
            <p>This is a test</p>
        </div>
      </nav>

</body>
</html>

这就是 myserver:8000/ozmod/runmodel/ 的样子

在此处输入图像描述

这就是 myserver:8000/ozmod/plot/ 的样子

在此处输入图像描述

少了什么东西？

因此，绘图工作正常，但当我在主绘图模板中引用为该视图提供服务的 url 时不会显示。我错过了什么？

编辑：2018-03-23

<embed>不使用<img>。

问题在于使用<img>而不是<embed>. 通过嵌入，交互功能保持响应。

正确的views.py：

{% extends "ozmod/page.html" %}

{% block content %}

<embed src="{% url 'ozmod:plot' %}" width="800" height="600">

{% endblock %}

结果：

在此处输入图像描述

4

1 回答 1

1

我真的不明白是什么mpld3.fig_to_html()- 文档非常稀疏，我对 matplotlib 或 mpld3 一无所知 - 但它似乎正在返回某种 HTML。这不能作为图像的 src 工作，它需要图像格式（gif/png/jpeg 等）的单个文件。

您需要使用 matplotlib 以该格式保存绘图并在 HttpResponse 中返回它。类似的东西（记住我根本不知道图书馆）：

plot = plt.plot(x,y)
response = HttpResponse()
plot.savefig(response)
return response
于 2018-03-18T20:06:01.087 回答