使用 d3.js 可视化数据组的数据技术

Visualizing data techniques for groups of data using d3.js

本文关键字：数据 技术 可视化 d3 js 使用      更新时间：2023-09-26

我有一个应用程序和提供对这些应用程序的访问的服务器的列表，有大量的交叉，例如：

Servers 01-09 provide App A, App, B
Servers 05-09 provide App C
Servers 10-14 also provide App A

目前，我在一张纸上画了很多盒子，上面有服务器及其应用程序的列表，分组到运行相同应用程序的服务器中。 使用上面的示例：一个标记为 01-09 的框，里面写着应用程序 A 和应用程序 B，并与另一个标记为 05-09 的框重叠，其中写着应用程序 C。

我想将其转移到d3提供的可视化中（我也在学习d3），我可以在网站上显示。我想到了一种超级venn diagram什么的？目标是轻松查看运行相同应用程序的服务器组。

有没有其他人遇到过这种可视化问题 - 你使用了什么技术？ d3内置了什么可以在这种情况下使用？

对我来说，最简单的方法是在表格中，因为您只有两个维度：

| Server | App A | App B | App C |
|--------------------------------|
| 01     |   X   |       |       |
| 02     |       |       |       |
etc

如果您设置为 d3.js（相当合理），我会使用垂直服务器和水平应用程序的共现图。

或者，您可以尝试将具有一种形状的应用程序和具有另一种形状的服务器标记为强制。我认为这不像表格那样可读！

在这种情况下，

一种选择是使用二分图进行可视化。

https://en.wikipedia.org/wiki/Bipartite_graph

二分图是具有两组不同节点的图形，其中同一集的成员之间没有边，并且所有边都从一个集合到另一个集合。

在这里，您可以将应用程序（A、B、C 等）作为一个集合，将服务器 （01-14） 作为另一个集合。

此外，这取决于您希望通过此可视化实现的目标。例如，如果您的目的是显示和比较运行应用程序的服务器数量的服务器负载，则可以使用节点的大小对其进行编码。

相关文章：