大数跨境
0
0

《构建个人知识图谱》018:再看 2D 和 3D

《构建个人知识图谱》018:再看 2D 和 3D 数翼
2024-09-19
1
之前的文章也谈过知识图谱 2D 和 3D 的可视化对比。今天来给大家再做一个对比。

整体布局

为了做对比,我选择了左右布局,这样的话,左侧是 3D 知识图谱,右侧是 2D 知识图谱,比上下等布局看着方便。

2D 图谱同样增加了一个控制面板,不过只增加了布局类型的切换,没有把具体的参数放上来。

操作按钮也是放了部分操作,界面上大部分的按钮操作并没有实现具体功能。

样式

节点颜色我使用了和 3D 图谱同样的节点颜色。

如果只是从截图看的话,右边2D图谱还是比较清晰的。不过我可能是操作和交互习惯了3D,在实际操作的时候信息一直是动态的 , 总觉得2D的图谱不太方便,开起来也比较费眼睛。

我只实现了2D的Hover和点击效果,并没有实现更多的效果,比如鱼眼效果等,这些事可以让2D图谱使用起来更好的。

布局算法

由于 Antv 本身提供了很多布局算法,我都测试了一下。

层级布局
圆形布局

不过我感觉对于知识图谱来说,还是 Force Layout 最好。

放小一点:

当只有零零散散几个节点时:

聚合节点和离散节点都比较多的时候:

使用技术

文章中的 2D 部分使用了 Antv G6 的 5.x 版本[1]来实现, 没有继续使用 D3 来进行布局。

代码都是官网拿下来的,很简单,参数也很多。不过不知道是 G6 5.x 本身的问题,还是别的原因,2D 图谱的性能很差, 切换布局页面也很卡顿,Force Layout 的动画时长也不可控。比其我用 D3 实现的性能要差的很多。

后续的话可能还是切换回 D3 的 Force Layout。

写在结尾

当我把文章上传之后,我发现了一个问题,那就是 截图里面的 2D 效果,要比 3D 好看很多,这个和实际操作的体验还是有不少差别。

引用链接

[1] Antv G6 的 5.x 版本: https://g6-next.antv.antgroup.com/


【声明】内容源于网络
0
0
数翼
专注 AIGC 人工智能知识传播和实践
内容 228
粉丝 0
数翼 专注 AIGC 人工智能知识传播和实践
总阅读124
粉丝0
内容228