创建可扩展的多层系统图
Creating an expandable multi-layer System Diagram
情况： 我的公司拥有极其复杂且动态的 IT 基础架构。这些系统过于复杂，无法通过图表进行映射和呈现。我正在尝试创建一个集中式网站，为所有 IT 团队提供所有文档，并带有交互式可扩展系统图，以便团队可以根据需要向下钻取和查看尽可能多或尽可能少的系统，而不会不知所措。
问题： 使用 DHTML，是否可以创建一个交互式图表，开始时是一个带有系统名称的简单方块，然后一旦用户点击它，那个方块消失并扩展以显示更多系统组件？然后每个组件都可以点击，这个过程将一直持续到系统完全崩溃。
注意： 如果这有歧义，我深表歉意。我不知道还能怎么形容它。 Google 继续为所有查询提取不正确的结果。感谢所有帮助。
我不确定我是否理解正确你的问题。但您似乎正在寻找树状图。 D3中有这个example。
是的，这是可能的，但可能的设计有很多选择，因此更具体的建议不会是最终的。客户端和服务器之间的关注点分布（谁在什么时间/根据哪个用户操作计算原理图的哪一部分）应该是合理的第一个设计选择。进一步的标准包括可视化复杂性、数据复杂性、数据源、数据更改频率、开发难易程度、可用的开发技能和预算。
今天的用户代理和计算能力允许 运行 仅客户端和仅服务器处理之间的整个范围（几乎就是：基本用户输入 ['mouse clicks'] 当然会被处理客户端）。
最简单的方法可能是像@MárioAreias 建议的那样在预先计算的数据集上使用 D3.js 这样的客户端库。
你要找的绝对有可能。我相信您应该寻找的搜索词是 diagramming libraries 或 graph drawing 和 flow-charting 编程库。那里有很多库，包括商业库和开源库。有关许多选项，请参阅 this related SO question。
根据您的描述，我相信 yFiles for HTML diagramming library 应该是一个很好的匹配。
有两个在线演示显示的场景似乎符合您的描述：
由于这是一个带有 huge API 的库，您可以根据自己的特定要求轻松自定义外观和数据源。
披露：我为创建该（商业）图书馆的公司工作，但我在这里不代表我的雇主。这是我自己的 post 和意见。
情况： 我的公司拥有极其复杂且动态的 IT 基础架构。这些系统过于复杂，无法通过图表进行映射和呈现。我正在尝试创建一个集中式网站，为所有 IT 团队提供所有文档，并带有交互式可扩展系统图，以便团队可以根据需要向下钻取和查看尽可能多或尽可能少的系统，而不会不知所措。
问题： 使用 DHTML，是否可以创建一个交互式图表，开始时是一个带有系统名称的简单方块，然后一旦用户点击它，那个方块消失并扩展以显示更多系统组件？然后每个组件都可以点击，这个过程将一直持续到系统完全崩溃。
注意： 如果这有歧义，我深表歉意。我不知道还能怎么形容它。 Google 继续为所有查询提取不正确的结果。感谢所有帮助。
我不确定我是否理解正确你的问题。但您似乎正在寻找树状图。 D3中有这个example。
是的，这是可能的，但可能的设计有很多选择，因此更具体的建议不会是最终的。客户端和服务器之间的关注点分布（谁在什么时间/根据哪个用户操作计算原理图的哪一部分）应该是合理的第一个设计选择。进一步的标准包括可视化复杂性、数据复杂性、数据源、数据更改频率、开发难易程度、可用的开发技能和预算。
今天的用户代理和计算能力允许 运行 仅客户端和仅服务器处理之间的整个范围（几乎就是：基本用户输入 ['mouse clicks'] 当然会被处理客户端）。
最简单的方法可能是像@MárioAreias 建议的那样在预先计算的数据集上使用 D3.js 这样的客户端库。
你要找的绝对有可能。我相信您应该寻找的搜索词是 diagramming libraries 或 graph drawing 和 flow-charting 编程库。那里有很多库，包括商业库和开源库。有关许多选项，请参阅 this related SO question。
根据您的描述，我相信 yFiles for HTML diagramming library 应该是一个很好的匹配。
有两个在线演示显示的场景似乎符合您的描述：
由于这是一个带有 huge API 的库，您可以根据自己的特定要求轻松自定义外观和数据源。
披露：我为创建该（商业）图书馆的公司工作，但我在这里不代表我的雇主。这是我自己的 post 和意见。