9

所以这有点类似于

在网络上获取 Python 脚本输出的最简单方法是什么？ 和 Matplotlib：Web 服务器上的交互式绘图

但是没有一个使用 d3.js，我认为它们没有达到相同水平的交互性。

所以我是 d3.js 的新手，坦率地说，我不知道在这种情况下我应该从哪里开始。

项目流程：

  1. 在前端询问用户名。将此发送到后端 python
  2. 获取深度为 x 的图形数据（对象 + 边），其中 x 是通过 Python 调用第 3 方网站 API 与起始节点的距离
  3. 对数据运行一些机器学习（python）
  4. 在 d3.js 循环中显示图形 + 一些数字（可能在右下角）：
  5. 有一个交互式 d3.js 图表，这样如果我单击一个节点，它将以该节点为起始节点重做计算
  6. 让 d3.js 显示每个节点的部分文本（前 10 个字符？），然后在鼠标悬停时显示全文。

(7) 奖励更新可嵌入图片？喜欢那些个人资料签名吗？

问题：我将如何实现这种双向通信？我应该从哪里开始？有没有更好的方法可以做到这一点？

旁注：我打算使用 Google App Engine 来做这个项目，但我不知道这是否能让你将它用作“虚拟机”。

谢谢！

编辑：这看起来很像前端集成的后端 JS 中的 Python，但我什至不知道从哪里开始，我认为由于他的项目，他们建议使用更多面向艺术的工具。

4

2 回答 2

13

听起来您需要用 Python 编写一个使用并返回JSON的 Web 服务。我不确定数据是来自客户端还是服务器，所以对于这个例子，我假设它来自客户端。

  1. 将您的图形数据以 JSON 格式发布到您的网络服务
  2. 做处理服务器端
  3. 将表示处理结果的 JSON 返回给客户端
  4. 用 d3.js 渲染它
  5. 客户端上的用户交互创建新的或修改的数据结构
  6. 返回步骤 1

也许您的服务器端 Web 服务方法如下所示（这是基于web.py的伪代码）：

import simplejson

class ml(object):

    def POST(self,data=None):
        # turn the JSON string into a Python data structure
        d = simplejson.loads(data)
        # do stuff
        results = alter_data(d)
        web.header('Content-Type','application/json')
        # send JSON back to the client
        return simplejson.dumps(results)

您的客户端代码可能看起来像这样（同样，只是一个粗略的草图）。此示例假定您使用 jQuery 来执行 AJAX 操作。

function render(data,textStatus) {
    d3
      .select('svg')
      .selectAll('circle')
      .data(data)
      .enter()
      .append('circle')
      .on('click',function() {
          $.getJSON(
              'your_webservice_url',
              // POST an updated data structure to your service
              { 'data' : alter_data(data) },
              // Call the render method again when new data is received
              render);
       });
}

d3.js'enter和exit方法使更新数据的可视化表示非常容易。我建议阅读这些文档。

这个例子可能会给你一些关于如何用 JSON 表示你的图形数据以及如何渲染它的想法。

查看该on方法，了解单击节点时如何触发对 Web 服务的 POST。

我将跳过真正具体的内容，例如使用 d3.js 显示文本。我相信您可以通过阅读 d3.js 文档来弄清楚如何做到这一点。

于 2012-10-26T21:18:59.560 回答
1

这是一个迟到的答案，我刚刚偶然发现了这个 python 包：Bokeh

为了满足您要求的第 1-6 点，您似乎几乎只需要编写 python 代码，这对于不习惯编写 java 脚本的人来说是一个加分项。

但是这个包还是很新的，可能有一些我目前还不知道的限制。

于 2015-12-10T12:06:44.460 回答