网络关系图 (Network Diagram)
使用力导向布局可视化多个节点之间的关系和连接。
关于 网络关系图 (Network Diagram)
网络图(或关系图)可视化一组实体之间的复杂关系。它使用节点表示实体,使用边(链接)表示它们之间的连接,通常使用力导向布局以实现最佳间距。
如何使用
- 粘贴连接数据 — 为每个关系提供源节点和目标节点名称。
- 映射边权重 — 可选包含“数值”列以改变连接线的粗细。
- 配置布局 — 调整引力和摩擦力以分散或聚集节点。
- 切换标签 — 为密集或稀疏的网络启用或禁用节点标题。
- 导出 — 下载为高分辨率 PNG 或交互式 SVG。
常见使用场景
- 社交网络分析 — 可视化用户或组织之间的互动。
- 供应链映射 — 跟踪供应商和制造商之间的依赖关系。
- IT 网络拓扑 — 映射服务器、路由器和端点之间的连接。
- 知识图谱 — 可视化概念、实体或研究论文之间的关系。
技术细节
基于 Apache ECharts 开发。使用斥力和引力物理模拟实施力导向布局。
常见问题
- 我可以拖动节点吗?
- 可以,可以点击并拖动节点以手动调整布局并探索连接。
- 网络图的数据格式是什么?
- 网络图使用两个表:节点表(ID 和标签)和边表(源节点 ID 和目标节点 ID,以及可选的权重)。CSV 格式通常最容易准备——一个 CSV 用于节点,另一个 CSV 用于边。
- 什么布局算法效果最好?
- 力导向布局(Force-directed)适合大多数通用网络,自然地将高度连接的节点聚集在一起。层级/树状布局适合组织结构图或流程图。环形布局适合显示循环结构。对于地理数据,地图投影布局将节点放置在地理坐标上。
- 网络图可以处理多少个节点?
- 浏览器中超过 500-1,000 个节点的网络图会开始变慢和混乱。对于大型网络,考虑过滤重要节点(按度数、中心性等)或使用聚类将相关节点分组为单个超节点,再呈现网络概览。
- 如何导出网络图?
- 单击“下载 PPTX“或“下载 PNG“。PPTX 格式允许您在 PowerPoint 中进一步标注节点和边。PNG 格式适合嵌入报告或论文。
- 网络图在不显得杂乱的情况下最多可以展示多少个节点?
- 网络图在节点数为50至80个时渲染效果良好。超过此范围,布局算法会产生标签重叠和边缘交叉,使图表难以阅读。对于较大的图,建议将相关节点归入集群,或按领域或功能将图表拆分为多个子图。力导向布局会自动调整节点位置。你可以拖动各个节点微调位置,然后再导出为PNG、SVG或PowerPoint幻灯片。
PNG 中的图表数据 — 恢复编辑
什么是嵌入式图表数据?
导出的 PNG 和分享链接可能包含原始图表数据及设置。持有文件或完整链接的人可能恢复这些数据。
如何使用
- 将图表导出为 PNG
- 保留 PNG 文件
- 任何时候需要再次编辑时,将其拖放或粘贴到"从 PNG 恢复图表"工具中
- 您的图表完全恢复到您离开时的状态——进行更改并再次导出
为什么比静态图像更好
其他图表工具导出最终的 PNG 图像——导出后,无法在不从头重做工作的情况下编辑它们。
- 无需单独保存源电子表格——PNG 就是您的备份
- 与同事共享 PNG,他们可以在没有原始数据的情况下恢复和编辑它
- 多年后,如果需要更新图表,打开 PNG 并恢复——无需搜索旧文件
- 用于存档:将 PNG 与您的报告和演示文稿放在一起;它们是完全独立的
它安全吗?
导出的 PNG 和分享链接可能包含原始图表数据及设置。持有文件或完整链接的人可能恢复这些数据。
嵌入 URL — 用于演示的交互式图表
什么是嵌入 URL?
嵌入 URL 会在浏览器中打开一个干净、交互式的图表版本——仅显示图表,没有工具界面、设置面板或导出按钮。工具提示和悬停交互可完全正常工作。图表数据在 URL 中加密,就像还原链接一样。
在哪里可以找到它
- 点击图表工具页面上的“🔗 嵌入 URL”按钮——它会立即将 URL 复制到您的剪贴板
- 嵌入 URL 也会保存在导出的 PPTX 文件中的幻灯片边界下方,标记为“Embed URL — interactive view”
在其他工具中使用嵌入 URL
嵌入 URL 适用于任何支持 iframe 或 URL 嵌入的地方:
- Notion —— 将 URL 粘贴为嵌入块(在 Notion 中输入 /embed)
- Confluence —— 使用 HTML 宏或 iframe 宏配合嵌入 URL
- SharePoint —— 通过“嵌入” Web 部件进行嵌入
任何网站或内网页面 —— 使用标准 HTML iframe:
<iframe
src="YOUR_EMBED_URL"
width="800"
height="500"
frameborder="0"
allowfullscreen>
</iframe>私有部署说明:如果您的组织在内网使用私有部署版的 Lokaltools,嵌入 URL 将指向您的内部域名。这些仅对公司网络或 VPN 内的查看者有效——这可能正是您 IT 安全团队的要求。
图表颜色 — 秒级生成品牌一致的调色板
大多数图表工具只为您提供固定的调色板且无法更改,或者要求您逐个手动选择每种颜色。Lokaltools 使用三步颜色系统,从您公司的品牌颜色开始,自动构建一个完整、和谐的调色板。
第 1 步 — 品牌锚点
在“品牌锚点”字段中输入您公司的主要品牌颜色十六进制代码(例如 #0066CC)。这通常是您的主 Logo 颜色、主要按钮颜色或品牌指南中的主色。品牌锚点颜色被用作所有调色板生成的起点。图表中的每种颜色都追溯到这个唯一的输入——因此您的图表始终具有品牌感,无需手动选择颜色。
第 2 步 — 配色方案
“配色方案”下拉菜单选择用于从您的品牌锚点生成剩余图表颜色的色论规则。每种配色方案都会产生不同的颜色关系。
| 配色方案 | 产生效果 | 适用场景 |
|---|---|---|
| 相邻色 | 色轮上相邻的颜色——微妙、内敛 | 单一主题数据,颜色应感觉相似时 |
| 互补色 | 色轮上直接相对的两种颜色——高对比度 | 双系列对比,正向 vs 负向 |
| 三基色 (平衡) | 色轮上三个等间距的颜色——鲜艳但平衡 | 大多数业务图表,3-6 个数据系列 |
| 分裂互补色 | 一个锚点 + 侧接其补色的两种颜色 | 良好的对比度,但没有完全互补色那么强烈 |
| 四分色 | 在色轮上形成矩形的四种颜色——丰富、多样 | 具有 4 个以上系列且需要最大区分度的图表 |
“三基色 (平衡)”是默认设置,适用于大多数业务演示。如果想要更微妙、保守的外观,请切换到“相邻色”;当您希望两个数据系列在视觉上形成强烈对比(例如预算 vs 实际)时,请使用“互补色”。
第 3 步 — 生成的色块(手动覆盖)
在配色方案选择器下方,工具会显示 5–6 个生成的颜色色块——这些是实际出现在您图表中的颜色。如果任何单个颜色不合适,点击该色块可打开颜色选择器并将其替换为您选择的任何颜色。手动覆盖的内容会保留在还原链接中。
背景模式(浅色 / 深色切换):切换调色板亮度以适应您的幻灯片背景。这会自动调整生成的颜色,确保它们保持清晰可读。
品牌颜色使用技巧
- 寻找确切的品牌十六进制代码:查看您公司的品牌指南 PDF,或在网站上右键点击公司 Logo $ ightarrow$ 检查 $ ightarrow$ 找到 CSS 颜色值。
- 何时使用相邻色 vs 三基色:当您的图表有一个主导信息且您希望颜色感觉统一时,使用相邻色。当每个系列代表真正不同的事物(例如收入、成本、利润)时,使用三基色。
- 将导出的图表颜色与您的 PowerPoint 模板匹配:“PPTX 精确版”导出保留了完美的像素级颜色——您在浏览器中看到的与出现在 PowerPoint 幻灯片中的完全一致。
常见问题
- 该工具可以离线使用吗?
- 是的——页面加载完成后,该工具完全可以在没有互联网连接的情况下工作。唯一的例外是嵌入 URL 交互式视图,它在显示嵌入内容时需要能够访问图表工具页面。
- 我可以将其用于机密或敏感数据吗?
- 是的。您的数据完全在您的浏览器中使用 WebAssembly 处理。它绝不会发送到 Lokaltools 服务器或任何第三方。这使得该工具适用于财务数据、患者数据、法律文件以及任何其他敏感信息。
- 我可以粘贴什么格式的数据?
- 直接从 Excel、Google Sheets 或 Apple Numbers 中复制单元格并粘贴——工具会自动检测格式。也支持 CSV 文件上传。从网页或 PDF 复制的数据可能无法正确粘贴——请先在 Excel 中进行清理。
- 如何找到我公司的品牌十六进制颜色?
- 查看您公司的品牌指南文档,或打开您的公司网站,右键点击 Logo 或品牌按钮,选择“检查 (Inspect)”,并寻找以 # 开头的 CSS 颜色值。
- 我可以保存我的品牌颜色,以便下次不必重新输入吗?
- 品牌锚点颜色与所有其他图表设置一起保存在还原链接中。导出您的图表,下次使用还原链接即可自动恢复您的品牌颜色。
- 还原链接是永久性的吗?
- 只要 Lokaltools 可以访问,还原链接就有效。加密数据存储在 URL 本身中——而不是在任何服务器上——因此没有过期时间。
- 我可以与同事共享还原链接吗?
- 是的——任何拥有该链接的人都可以恢复图表。请像处理共享文档一样对待还原链接:仅与应有权访问基础数据的人共享。
- 还原链接和嵌入 URL 有什么区别?
- 还原链接会打开带有您预加载数据的完整图表工具——您可以进行编辑并重新导出。嵌入 URL 打开一个只读的交互式图表视图,没有编辑功能。
隐私与安全
此工具完全在您的浏览器中运行。您的数据遵循以下路径:您的电子表格 $ ightarrow$ 您的浏览器 $ ightarrow$ 您导出的文件。没有其他路径。没有上传步骤。没有服务器处理。不对您的数据内容进行分析。
导出的图表 PNG 可能将原始数据和设置保存为可恢复的元数据。恢复链接和嵌入链接的 URL 片段包含数据及解密所需的密钥。持有文件或完整链接的人可能恢复这些数据。请仅与预期接收者分享。URL 片段通常不会随 HTTP 请求发送,但 JavaScript 及您分享链接的服务可以读取它。
对于需要正式确认的组织:Lokaltools 无法读取您的数据,不存储您的数据,并且即使在法律强制要求下也没有技术机制来访问您的数据。这不是一项政策——这是一个架构事实。
技术细节
由 Apache ECharts 提供高性能 Canvas 渲染支持,使用 PapaParse 进行智能 CSV 和制表符分隔数据解析,并使用 PptxGenJS 生成原生的 OOXML 图表对象。还原链接加密使用浏览器内置的 Web Crypto API (AES-256-GCM) 配合 pako 压缩——无需外部加密库。所有处理均 100% 在客户端完成。任何时候都不会传输数据。
本地处理
本地文件、文本和图表工具通过 JavaScript、浏览器 API 以及必要时使用的 WebAssembly 在您的设备上处理内容。使用事件不包含文件名、文件内容、输入文本、图表数值、原始错误、电子邮箱或许可证引用。DNS、WHOIS、IP 和测速等网络工具会为其功能访问外部服务。加载网站、字体、库和模型也会产生网络请求。WebAssembly 本身并不能阻止网络访问。