0

我正在尝试使用 d3.js 从 mysql 表中绘制关系图。这是一个示例表来解释我想要实现的目标。

+----+---------+-------+------+
| id | name    | entry | type |
+----+---------+-------+------+
|  1 | ObjectA | 100   | ID1  |
|  2 | ObjectA | 101   | ID1  |
|  3 | ObjectB | 101   | ID1  |
|  4 | ObjectB | 102   | ID1  |
|  5 | ObjectC | 102   | ID1  |
|  6 | ObjectC | 100   | ID1  |
|  7 | ObjectA | 200   | ID2  |
|  8 | ObjectA | 201   | ID2  |
|  9 | ObjectB | 201   | ID2  |
| 10 | ObjectB | 202   | ID2  |
| 11 | ObjectC | 202   | ID2  |
| 12 | ObjectC | 200   | ID2  |
+----+---------+-------+------+

ObjectA 有 ID1 和 101 连接到 ObjectB ID1 101
ObjectB 有 ID1 和 102 连接到 ObjectC ID1 102
ObjectC 有 ID1 和 100 连接到 ObjectA ID1 100

我的最终目标是将 ObjectA、ObjectB、ObjectC 显示为三个单独的圆圈，它们相互连接，蓝色和红色线条代表 ID1 和 ID2 关系。

到目前为止，我正在将表格输出到 json，正如我在我读过的视频和内容中广泛推荐的那样。我为此使用php。

[
{
    "id": "1",
    "name": "ObjectA",
    "entry": "100",
    "type": "ID1",
},
etc..

然后从 html 文件中读取

d3.json(
  "mysql_table_to_json.php?table=objects",
       function (error, json) {
then something..
})

我还没有弄清楚的东西..我发现我很难把我的头包裹在javascript上，因为我自己习惯了php和python编码。我真的真的真的很希望somone会同情我，并举出一个我可以开始乱搞的小例子。

所以任何关于如何进行的想法和例子都将非常感激。

4

1 回答 1

2

我已经使用您上面的数据创建了一个似乎符合您描述的可视化。你可以在这里找到它。这一刻很无聊，但我相信更多的数据会让它更有趣。请注意，我必须对您的数据进行一轮处理才能获得适用于此示例的格式，但是对于此类事情，pythons 是一个非常好的工具，因此您应该在那里遇到问题。

当我读到你的描述时，我想到的另一件事是 Parallel Sets，Kai Chang 为它创建了一个插件，可以在这里找到。

如果您还没有，我建议您查看d3 示例页面，以了解更多关于哪种可视化适合您的数据集和所需结果的想法。除此之外，还有一些非常酷的东西。

于 2013-09-24T04:24:47.527 回答