图数据正在成为描述复杂系统的主流方式——社交关系、设备拓扑、供应链网络、 知识体系、代码依赖,本质上都是「点」与「边」的组合。然而当节点规模从几百 增长到几万、几十万,传统前端图表库往往力不从心:布局卡顿、交互掉帧、 内存溢出。
数点云图数据可视化引擎围绕「大规模、低延迟、易集成」三个目标进行设计, 采用自研渲染内核与增量布局算法,在浏览器端即可承载十万级节点、百万级边的 图数据,并保持顺滑的缩放、拖拽、框选与路径高亮体验。
围绕大规模图数据的「看得清、算得动、接得上」三个环节,提供完整能力矩阵。
基于 WebGL 的自研渲染管线,采用批量绘制与纹理图集技术,节点与边按需分级加载, 视口外图元自动裁剪。十万级节点场景下仍可保持流畅的缩放与拖拽体验。
内置力导向、层次、环形、网格、DAG、放射等 12 种布局算法,并支持自定义布局插件。 增量布局让新增节点自然融入现有结构,避免整图抖动。
支持缩放平移、框选、套索选择、节点折叠展开、邻域高亮、路径追踪等交互方式, 配合鱼眼放大与标签避让,帮助使用者在密集网络中快速定位目标。
内置最短路径、连通分量、社区发现、中心度分析、PageRank 等常用图算法, 计算结果可直接回写到可视化层,用颜色、大小、透明度等方式直观表达。
同一套配置可在桌面浏览器、平板与移动端运行,自动根据屏幕尺寸与设备性能 调整渲染策略与图元细节,保证不同终端下的观感与操作一致性。
提供 JavaScript SDK、REST 接口与配置化 JSON 描述,支持与既有业务系统对接。 事件体系完整,节点点击、悬停、框选等行为均可被外部逻辑接管。
每一层均可独立替换与扩展,便于接入现有技术栈。
只要数据之间存在关联,图可视化就能带来不同于表格与图表的观察视角。
呈现城市部件、管网、设施之间的连接关系,辅助管理者从整体结构上理解城市运行脉络。
展示线路、站点、运力之间的网络结构,直观查看路径连通性与中转关系。
用于电网拓扑、设备连接关系的可视化呈现,支持分层展开与局部细节查看。
梳理产线设备、工序、物料之间的依赖关系,帮助定位关键环节与瓶颈节点。
用于知识体系、学科关联、文献引用网络等结构化内容的可视化展示与研究。
呈现服务调用链路、微服务依赖、主机与实例关系,快速定位异常传播路径。
引擎以 SDK 形式提供,无需搭建额外服务即可在前端项目中运行。 数据格式清晰直观,节点与边的属性可自由扩展,样式通过配置项统一管理。
// 1. 引入引擎
import { Graph } from '@shudian/graph-engine';
// 2. 初始化实例
const graph = new Graph({
container: '#viewport',
renderer: 'webgl',
layout: { type: 'force', iterations: 300 }
});
// 3. 载入图数据
graph.setData({
nodes: [
{ id: 'A', label: '节点 A', size: 12 },
{ id: 'B', label: '节点 B', size: 8 }
],
edges: [
{ source: 'A', target: 'B', weight: 1 }
]
});
// 4. 监听交互事件
graph.on('node:click', (node) => {
console.log('当前节点:', node.id);
});
关于接入方式、部署形态与性能表现的常见疑问。
在常规办公级终端上,采用 WebGL 渲染模式时,单图可稳定承载十万级节点与百万级边, 并保持流畅的缩放与拖拽体验。若数据规模进一步增长,可通过分层加载、 按需展开、子图聚焦等方式进行分段呈现。
支持。引擎既可以在浏览器端以纯前端 SDK 的形式运行,也可以配合服务端组件 部署在自有服务器或内网环境中,数据无需离开本地网络即可完成渲染与分析。
可以。引擎不依赖特定框架,在原生 JavaScript、Vue、React 等项目中均可使用。 只需提供一个容器元素,引擎会在其中创建并管理画布,其余业务逻辑保持独立。
采用通用的节点与边结构:节点包含唯一标识与可选属性,边通过源节点与目标节点的 标识建立连接。业务字段可以自由扩展,不影响渲染与布局逻辑。
提供完整的接口文档、配置说明与示例工程,涵盖常见布局、交互与样式定制场景。 使用过程中遇到问题,可通过页面底部的联系方式与我们取得沟通。
我们是一支专注于数据可视化方向的技术团队,位于合肥市高新区创新产业园二期。 团队长期围绕大规模图数据的渲染、布局与交互体验进行研发,致力于让复杂关系 数据以更直观、更高效的方式被理解和运用。
数点云网络科技高性能图数据可视化引擎是我们的核心产品。我们希望它能够成为一个 可靠的基础组件,帮助不同行业的团队把关系数据真正用起来。
无论是产品咨询、技术交流还是合作洽谈,都欢迎与我们取得联系。