python - D3.js 定向图 Django 集成

Question

我有一个简单的 Django 应用程序，用于查询数据库并显示返回对象的字段。我想知道集成的最佳方式是什么 this将图形可视化引导到我的项目中；到目前为止我从未使用过 d3。

请允许我解释一下我的申请。目前，它只是一个表单，允许用户通过输入书籍的唯一 ID 来查询数据库中有关书籍信息的内容。这工作正常，内容是通过使用模板显示的。

我想要做的是使用查询对象的字段之一将数据推送到上面的图形示例中，并在按下文本链接时简单地在新窗口中显示该图形。

这是我的应用程序结构:

代码

myapp.models.py:

from django.db import models

class Book(models.Model):
    uid = models.IntegerField(primary_key=True)
    title = models.CharField(max_length=30)
    related_books = models.CharField(max_length=2048)
    class Meta:
        db_table = u'books'

字段lated_books包含我想要绘制图表的数据。数据以rel_book1 rel_book2 rel_book3 ...格式存储，其中每本书都与查询的Book对象相关，每个对象有n个相关书籍，但有至少总是两个。

myproject.templates.search.html:

<form action="" method="get">
<label for="id_q">Search:</label>
<input id="id_q" name="q" type="text">
<input type="submit" value="Submit">

{% if found_entries %}
    <ul>
        {% for i in found_entries %}
            {{ i.uid }} {{ i.title }} {{ value|linebreaks }}
        {% endfor %}
    </ul>
{% endif %}
</form>

这就是我想显示图表的地方；当按下文本链接时在新窗口中。

myapp.views.py:

from django.shortcuts import render_to_response
from django.template import RequestContext
from myapp.search import get_query
from myapp.models import Book

def search(request):
    query_string = ''
    found_entries = None

    if ('q' in request.GET) and request.GET['q']:
        query_string = request.GET['q']
        found_entries = Book.objects.filter(uid=query_string)

    return render_to_response('search.html',
                        { 'query_string': query_string, 'found_entries': found_entries },
                          context_instance=RequestContext(request))

重申一下，用户输入给定书籍的唯一 ID，就会显示与该书籍相关的数据库内容。显示 ID 和标题时，我还想显示有向图示例的链接。

所以我的问题是，当查询 Book 模型时，如何从字段 lated_books 中提取信息，以便我可以将这些数据插入图形示例中以生成图形生成每个 Book 对象？

谢谢你对我的包容!

Answer 1

在我看来，你已经掌握了足够的信息。您的 View 返回与过滤器匹配的图书对象，并且 lated_books 是 Book 类的成员。

您只需要通过迭代每本书的 lated_books 属性来动态生成链接，例如

{% for book in found_entries %}
# print out whatever results here
<a href="graphing_page.html?contents=
    {% for content in book.related_books %}content{% endfor %}
">Graph this</a>
{% endfor %}

我不确定 d3 库采用哪些参数，但连接组件的列表似乎是合理的。