在 html 文件中使用图表（使用 matplotlib 用 python 编写）答案

【问题标题】：to employ charts(written in python using matplolib) in html file在 html 文件中使用图表（使用 matplotlib 用 python 编写）
【发布时间】：2012-07-26 21:27:01
【问题描述】：

我使用 django 创建了应用程序，该应用程序在 10 个 xml 文档中搜索用户输入的关键字，并为每个文件维护这些词的频率计数。结果以文件名和图表的可扩展超链接列表的形式返回给用户。我的html代码：

<html>
 <style type="text/css">
        h1 {
             position: absolute;
             top:   5px;
             left:  200px;      
           }    
        form #Edit1 { 
                     position: absolute;
                     top:    37px; 
                     left:   410px; 
                    }
        form #Edit2 { 
                     position: absolute; 
                     top:    37px; 
                     left:   840px; 
                    }
       </style>
       <font size="4" face="arial" color="#0000FF">
       <h1>XML Search</h1>
       </font>
       <br/>
       <br/>
       <Form Action ="/search/" Method ="POST">
       <div id="Edit1">
            <INPUT TYPE = 'VARCHAR'  name ='word' VALUE ="" size = "50">
       </div>
       <div id="Edit2">
            <INPUT TYPE = "Submit" VALUE = "Search">
       </div>
       <br/>
       <hr/>
       {% csrf_token %}
       </FORM>
       {% if list1 %}
          <input type="text" name="word" value="{{ word }}" />
          <ul> 
             {% for l in list1 %}
                  <li><a href="{{STATIC_URL}}static/{{l.file_name}}">{{l.file_name}}</a>, {{l.frequency_count}}</li>
             {% endfor %}
          </ul>
          <br/>     
     # -- charts to be employed -- #
       {% endif %}
</html>

这个 html 页面是从 views.py 文件重定向的。现在，我想在这个 html 代码中使用 matplotlib 编写图表代码。由于使用上述库创建图表的代码是用python编写的，所以我该如何在上面的html文件中编写这个python代码或者是否有其他出路，所以请告诉？

注意：我已经使用了谷歌图表，它工作得很好，但我想让这个应用程序独立于互联网，所以请不要建议我使用谷歌图表。

请帮助，我是图表和 django 的新手。

【问题讨论】：

嘿，没人能帮我吗？

标签： python django linux matplotlib ubuntu-10.04

【解决方案1】：

matplotlib cookbook 有一个entry 用于将 matplotlib 与 django 结合使用。

归结为以下几点：

在 urls.py 中为 png 添加一个条目，其中包含指向新视图的链接。
在您的新视图中，您使用 content_type image/png 创建一个 HttpResponse
使用 matplotlib 将图形作为 png 写入上述 HttpResponse

从食谱中直接复制/粘贴应该可以帮助您。

也许您可以将问题分解成小块，以避免一次学习三件事：

向您的页面添加静态 .png
通过 urls.py 和新视图将动态 .png 添加到您的页面
在 Matplotlib 中创建图形（离线）
将步骤 3 中的 matplotlib 图放入步骤 2 中的动态图像中

【讨论】：