javascript - 构建图表编辑器 - 如何创建数据驱动图表

Question

就目前情况而言，这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放， visit the help center以获得指导。

已关闭 10 年前。

我正在开发一个图形编辑器，它使用拖放来构建层次图(包含节点和链接)，图中的每个节点都应该链接到我们数据库(SQL Server)中的一个表，我做了很多关于基于 javascript 或/和 JSON 规范来绘制节点和链接的库的研究，有很多很好的例子可供引用。但我不知道如何将图形链接到数据库(SQL Server、Oracle、MySQL...)。我考虑过这种架构:

我看过D3库，它创建数据驱动图表，但我认为它只使用平面文件，而不是关系数据库。首先你能告诉我我的架构是否经过深思熟虑吗？其次可以给我一些关于如何将我的图表链接到 DBMS 的想法。

非常感谢。

Answer 1

假设一个节点被反序列化为以下 POCO:

public class Node
{
    public int id {get;set;}
    public string name {get; set;}
    public List<int> outBoundConnection {get;set;}
    public List<int> inBoundConnection {get; set;}
}

id字段来自数据库。您将用它来跟踪对象。假设每个行/节点/..都有一个唯一的 id，您需要在对象的整个生命周期中保留它(查询 -> POCO -> JSON -> D3)。此 ID 会将您的 D3 数据集链接到 SQL Server 行。

我希望这有助于作为一个总体轮廓。

1. Set up a web project, which will expose web services that D3 will use.

2. Create a web service to query the nodes. Return data as JSON.

   D3 has API for web serivces

You might want to look in to AutoMapper, as it makes it super easy to convert from DataTable/Reader to POCO. Or a DTO/OOM Framework in your favorite language.

In this web service: Create a connection to database, query needed tables, execute the query, turn the returned data in to a class object (AutoMapper), return what ever structure you constructed as JSON.

现在，由于 id 在整个生命周期中都会保留，因此您可以使用 id 作为参数向 Web 服务发出请求。

例如，如果您想删除一条注释。您可以向接受 id 作为参数的 Web 服务端点发出 HTTP DELETE 请求 ( jQuery comes in handy here )。

或者，如果您想删除连接节点，请创建一个带有两个 id 或连接 id 的 Web 服务(如果您以这种方式设置了架构)。

您想要了解图形数据的独特之处。