如何最好地展示这一点以解释通用概念？
我有一堆具有类似架构的项目......
A----1 Y
\ / \ /
\/ \ /
/ \ \ /
B---2----X----Z, etc, etc
\ / /
\ /
/ \ /
C----3
（对糟糕的ascii艺术感到抱歉）
- （测量/控制设备）中可以有多个A，B，C（通常是一个，但可能更多）
- 每个项目 其中将使用 1、2、3（通信技术）之一
- 与 X（数据库服务器）进行通信，X（数据库服务器）
- 为 Y、Z 等（基于浏览器的应用程序）提供服务
我不太擅长以图形方式显示内容，所以我想知道是否有人能建议：
- 静态的东西 - 在文档中显示它的通用方法（我尝试使用漂亮的符号来反映实际的系统组件，但因为视觉上很混乱）
- 动态的东西 - 在网站上显示它的某种方式（可能只有一个项目）对于 A、B、C 和 1、2、3 列中的每一列，并使图像相互淡入）。
我应该自动执行此操作，还是根据用户输入执行此操作？
I have a bunch of projects which have a similar architecture...
A----1 Y
\ / \ /
\/ \ /
/ \ \ /
B---2----X----Z, etc, etc
\ / /
\ /
/ \ /
C----3
(sorry about the bad ascii art)
- there can be multiple A, B, C (generally one, but may be more) in each project (measurement/control devices)
- each of which will use one of 1, 2, 3 (communciations technologies)
- to communicate with X (databse server)
- which serves Y, Z, etc (browser based apps)
I am not very good at displaying things graphically, so am wondering if someone can suggest:
- something static- a generic way to display this in documentation (I tried using nice symbols to reflect the actual system components, but is because visually messy)
- something dynamic - some way to show it on a Web Site (perhaps having just one item for each of the A, B, C and 1, 2, 3 columns and having the images fade into each other).
Should I do this automatically, or as a result of user input?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
对于静态来说，这样的东西怎么样（抱歉，ascii 艺术不好；）
更新：“网站动态”有点通用。取决于你的意思。您可以生成 SVG 图形或一些奇特的 HTML5 + JavaScript - 也许其他答案中提到的工具支持这样的输出？
How about something like this for static (sorry for the bad ascii art ;)
Update: "Dynamic for a website" is a bit generic. Depends on what you mean by that. You could generate SVG graphics or some fancy HTML5 + JavaScript - maybe the tools mentioned in the other answers support output like that?
Graphviz 通常是我的第一选择。 图库 有很多示例，Dot 语言简单直接。
关于布局的思考：也许通信通道应该表示为数据库服务器上的接口，而不是它自己的节点。正如 ChrisWue 所建议的，具有 Component -> 的三（或四）层图数据库服务器->客户。 Graphviz 的 switch 示例看起来非常接近。
Graphviz is usually my first choice. The Gallery has lots of examples, and the Dot language is simple and straight-forward.
A thought on the layout: Maybe the communications channel should be expressed as an interface on the database server rather than a node of its own. As ChrisWue suggests, a three (or four) layered graph with Component -> Database server -> Clients. The switch example of Graphviz seems pretty close.
如果您想以某种方式可视化数据：http://vis.stanford.edu/protovis/
If you want to visualise data in some fashion: http://vis.stanford.edu/protovis/