3D可视化:用元宇宙的方式打开知识图谱技术WebGL

从简单的纸质记录,到灵活的电子图表,再到进一步的三维可视化、沉浸式体验……为了清晰有效地传递、挖掘和交互信息,类表征世界的技术段经过了代代的演化改进,用以实现更好地分析与推理知识,最终有效理解和洞察世界。随着人工智能的发展,如今3D知识可视化已成为最炙手可热的表达方式之一。本篇将从知识图谱可视化的技术内核切入,介绍3D图谱可视化的技术要点和应用方式,最后提出关于该技术的落地前景和创新实践。

目录

一、什么是知识图谱可视化?

二、知识图谱可视化的现状

三、3D图谱可视化的价值

四、3D图谱渲染技术

五、3D图谱布局计算

六、VR/AR技术在图谱可视化上的应用

七、知识图谱可视化技术的创新实践:DataExa-Sati认知智能平台

一、什么是知识图谱可视化

知识图谱是将复杂的信息通过计算、处理成能够结构化表示的知识的一种现代理论,可视化技术是其技术基础之一,利用可视化技术手段能够形象展示知识资源及其载体间的相互联系。

"一画胜千言"。从生物认知的角度,图像视觉信息远比单一的文字、声音来的迅捷丰富。数据的可视化意义在于视物致知,即从看见物体到获取知识,从视觉感知与认知的角度看,用户是所有行为的主体,通过视觉感知器官获取可视信息、编码并形成认知,在交互分析过程中获取解决问题的方法。在这个过程中,感知和认知能力直接影响着信息的获取和处理进程,进而影响对外在世界环境所做出的反应。人类处理数据的能力远远落后于获取数据的能力,人类视觉对于形象视觉符号的理解能力更强。

知识图谱可视化既是一门技术也是一门艺术,旨在借助于图形化手段,清晰有效地传达与沟通信息。但知识可视化不只是为了看上去绚丽多彩显得复杂,为的是有效地传递思想概念,美学与功能需要齐头并进,通过直观地传达关键的方面与特征,实现对于相当稀疏而又复杂的数据集的深入洞察。

借助计算机图形可视化技术,知识图谱的可视化维度也从2D拓展到了3D,近几年基于3D可视化技术衍生了VR/AR以及目前统一后的XR技术等,3D可视化从生物感知的生理特点决定了是一个更贴近自然的交互方式,后文将一一阐述。

知识图谱的可视化经过是一个逐步演进的过程,经过了几个阶段的技术引入,包括SVG、Canvas2D、WebGL、WebGL2以及最新的WebGPU,目前的技术现状是受限于计算机软硬件的限制,主要以2D为主。

1、可缩放矢量图形(ScalableVectorGraphics,SVG),是一种用于描述二维的矢量图形,基于XML的标记语言。作为一个基于文本的开放网络标准,SVG能够优雅而简洁地渲染不同大小的图形,并和CSS,DOM,JavaScript等其他网络标准无缝衔接操作非常方便。其中D3.js开创了使用SVG绘制知识图谱网络图的先河,为开源社区提供了早期知识图谱可视化的技术库资源。

2、Canvas是HTML5提供的一种新的标签,它定义了一个矩形区域的画布,通过Javascript可以再画布上绘制各种图形,拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法,为区别WebGL这里的Canvas主要是指Canvas2D。

Canvas、SVG技术的优劣势比较:

从大部分的实践来看,Canvas比SVG在渲染绘制性能上有优势,特别是在绘制对象数量比较多的情况,但另一个方面是画布尺寸的影响,因为SVG是矢量的,所以在大尺寸的绘制上性能有优势。微软MSDN上给的一个对比图:

而且在小数据量的情况下,SVG的方案通常内存占用会更小,做缩放、平移等操作的时候往往帧率也更高。

从交互优势上,看由于SVG是基于HTML的DOM,能快速应用浏览器底层的鼠标事件、CSS样式、CSS3动画等,在交互、局部重绘制上有很多便利。

3、WebGL(Web图形库)是一个JavaScriptAPI,可在任何兼容的Web浏览器中渲染高性能的交互式3D和2D图形,而无需使用插件。WebGL通过引入一个与OpenGLES2.0非常一致的API来做到这一点,该API可以在HTML5的Canvas元素中使用。

4、WebGL2是WebGL的一个主要更新,它通过WebGL2RenderingContext接口提供。它基于OpenGLES3.0,新一些功能特性,在性能上也有较大提升,但受限于OpenGL引擎技术相对WebGPU落后。

在知识图谱的可视化逐步演进的过程中,也涌现出了一些较为经典的开源项目和企业,如:

1、D3.js项目

D3是一款可视化Javascript库,提供了可视化的的基础能力:如图形、色彩、比例尺、布局算法、定时器、缩放、动画已经操作交互等。

2、Sigma.js项目

Sigma.js相较D3.js是专门为图谱渲染编写的Javascript库,期主要特点是对图谱渲染做了一些优化努力,包括使用Canvas技术来渲染图谱,所以能处理上千节点的图谱渲染。

3、Cytoscape.js项目

Cytoscape.js主要专注在图论算法上,Cytoscape.js图布局上上做了很多研究,在提供了大量的实践示例对不同布局的同时Cytoscape.js也提供了手势等交互控制。

4、Cambridge-intelligence公司

Cambridge-intelligence开发了多款知识图谱可视化产品,Keylines是基于Javascript的图谱可视化库,ReGraph是基于React前端框架的可视化组件库,KronoGraph是用于时序数据分析的工具,剑桥公司在知识图谱领域实践了很多应用场景,是目前改领域大家争相学习的对象。

目前主流的图谱可视化还是基于平面的可视化,使用的技术也是基于Canvas为主,其表现力和性能方便还比较有限。但随着新的技术演进、硬件的更新,WebGL、WebGPU技术将2D的可视化扩展到3D的可视化,未来3D可视化技术在软硬件成熟后将给人以更贴近自然的方式去了解把握知识。

3D可视化技术是一种新的管理、分析和交互数据的方式。它能实现实时反射、实时折射、动态阴影等高品质,也可以逼真地实时渲染3D图像。3D数据可视化与一般数据可视化主要区别就是更立体、更真实、更有沉浸感。2D的图谱由于平面空间比较有限,节点与边容易糊在一起形成麻球状,使得视觉不清晰,而3D图谱数据可视化呈现了一个全新的视角,运用3D空间,我们可以很容易的通过旋转视角、缩放相机达到深入了解并且查看数据的目的。

3D图谱可视化可以运用物理坐标体系,将数据映射到地理空间上,结合图谱与地理信息进行数据汇集,使得用户更好地理解数据与物理现实之间的关系,加深对数据的理解,创造更好的体验感。

3D数据可视化技术能够呈现数据独特的立体美,使用粒子、轨迹线、流光等特效大大提升用户交互体验。

3D可视化技术在知识图谱应用中的价值正在逐渐显现,渊亭科技作为行业内领先的人工智能产品提供商,始终紧跟行业前沿技术趋势,并依靠强大的自主研发能力,在自研的DataExa-Sati平台中拓展了多种3D图谱技术,包括3D图谱渲染技术、布局计算技术、VR/AR应用技术等。

原生的WebGL接口包括WebGL上下文、视野和裁剪、状态信息、缓冲区、帧缓冲、渲染缓冲、纹理、程序对象和着色器对象、Uniform、Attribute、绘制缓冲区等,但对于实际的应用开发来说,WebGL的原生接口比较技术化,使用起来不是很友好,因此主流的WebGL开发有一些更友好的库来完成,3D基于Web方面有Three.js和Babylon.js两款著名的引擎,基于原生应用的有Unity、Unreal。

从图谱渲染技术角度来看主要包含:材质纹理、文本渲染、节点渲染、边渲染、动画处理、相机、粒子系统、交互处理等技术。

1、材质纹理

在DataExa-Sati中,我们可以选择不同的材质贴图,为图谱节点对象进行贴面渲染,材质在场景中受灯光等作用下可以呈现丰富的视觉效果,对于材质有PBR(PhysicallyBasedRendering)材质和传统的Bling-Phong材质,他们使用不同的算法所达到的效果也有差异。

2、文本渲染

3D场景下的文本比2D要复杂很多,文本需要考虑光影、呈现角度、抗锯齿等复杂的问题。

3、节点、边等元素渲染

节点、边元素包括是主要的图谱呈现元素,节点通过边连接构成图谱,节点之间需要通过合理的布局达成分布位置,使观察者能得到易读、易用、可分析的数据可视化。

4、动画

动画的作用不仅仅是好看、炫酷,流畅的动画表达能指引用户理解数据的含义,节点动画能吸引用户的注意力,不同的动画类型可以表述不用的动画含义,进而赋予业务意义。边的动画能表述节点间的方向关系,不同的边动画也可以指向不同的业务目的。

5、相机

相机是用户的视角,用户以不同的观察点、视野宽度观察图谱,它定义了三维空间到二维屏幕的投影方式。

6、粒子系统

在2D布局中我们设计了多种布局如:随机布局、网格布局、圆形布局、径向布局、顺序布局、垂直布局、力导向布局等,3D的布局从维度来说是在二维的基础上加上一个维度即[x,y]变成[x,y,z],看起来也不是太复杂,渊亭DataExa-Sati已经可以实现基于2D的布局扩展3D布局。

3D力导向布局原理可以在2D力排斥布局上扩展,在平面上二维空间要使节点拉开距离即通过排斥能量来重新计算平面两点距离的向量。同理,三维空间里我们只要把二维向量变成求三维向量即可。从视觉容量的角度来说3D的可视容积和住房一样,通过向上扩展,同样的视窗内我们可以放入更多的元素节点而不容易产生视觉混淆。

W3C在今年1026发布了WebXRDeviceAPI草案,WebXRDeviceAPI用于替换之前的WebVR,该草案支持在Web上访问虚拟现实(VR)和增强现实(AR)设备,包括传感器和头戴式显示器。标准的制订有利于设备的兼容性,让开发者更容易开发出VR/AR应用。

A-Frame,款基于HTML语言的开发框架,可兼容多种3D可视化引擎,设备方面兼容Vive、Rift、Quest、Daydream、GearVR、Cardboard等主流VR平台。基于A-Frame技术,渊亭科技在DataExa-Sati上开发、拓展了WebXR的技术应用。

WebXR应用于图谱可视化的优势在于交互性,借助于A-Frame的交互能力与硬件设备的支持,我们可以有无限遐想,基于基础动作抓、抛、擦、转、戳、伸、压等等动作延伸出我们现实世界里能想到的动作进行控制交互,不仅如此通过混合现实中的跟踪和自定义控制器我们甚至可以创造超现实主义手握乾坤、睥睨世界,为此DataExa-Sati设计了组叫“魔方手势”,用于缩放、旋转、聚焦、销毁、拓展等图谱可视化操作。

WebXR非常有趣的是基于凝视(Gaze-Based)的光标组件交互,与网页的交互不样,我们在虚拟环境中,可以使视觉焦点,当视觉焦点移动到目标上的时候就像鼠标移动到目标上样,凝视控制对于没有柄的头显会特别有用,通过凝视交互,DataExa-Sati把这一交互形式应用在了图谱节点的信息标题查看上。

WebXR中控制器对于虚拟现实中的沉浸体验特别重要,使用使用六自由度(6DoF)控制器,人们就可以感觉接触到周围的景物,用手与物体进行交互。A-Frame提供了系列控制器组件,通过各自的网络浏览器来支持游戏手柄(Gamepad)WebAPI。有不同的组件来支持不同厂商的控制器,使用手柄我们可以实现自己在虚拟世界的位置移动,通过手柄的抛射线,我们可以很容易的指向到我们需要移动的位置,通过这一交互方式DataExa-Sati实现了沉浸式的虚拟世界遨游,行走于数字空间。

WebXR中我们通过注册监听器来监听按钮事件和轴事件,通过监听事件我们可以动态地改变图谱的些属性如高亮图谱节点、边,放或者移动节点等,另项非常有的交互手段是使超级手组件,超级手组件提供了全功能的自然手控制器交互,基本手势包括:

●悬停(Hover):在实体的碰撞空间中握住控制器

●抓住(Grab):按下个按钮在实体上悬停或移动它

●拉伸(Stretch):用双手抓住个实体并调整大小

●拖放(Drag-drop):将实体拖到另实体上

2020年1022日,W3C沉浸式Web工作组(ImmersiveWebWorkingGroup)发布WebXR手势输入模块第一版规范(WebXRHandInputModule–Level1)的首个公开工作草案(FirstPublicWorkingDraft)。该模块扩展了WebXRDeviceAPI规范,具有追踪关节手势的功能,可用于在VR场景中识别手部关节姿势或渲染手势模型。

借助于手柄控制,我们可以很真实地模拟现实世界,将图谱投射到3维空间中,我们可以用虚拟的手拾取、触摸图谱,通过面板触碰图谱节点、操作图谱节点等,这一交互形式使我们很大程度上还原了现实世界的交互模拟,交互显得特别自然。

七、知识图谱可视化技术的应用实践

1、DataExa-Sati认知智能平台

近年来,渊亭科技在知识图谱、可视化等人工智能前沿领域上投入了诸多研究。公司自研的DataExa-Sati认知智能平台提供一站式多模态行业知识图谱构建体系,包括定义领域认知框架的知识建模、多源异构的知识抽取、提升本体层和实例层质量的知识融合、支持万亿级别的高性能图存储计算引擎以及知识推理能力等,让机器使用专家知识以及推理能力解决实际问题为主要目标,最终针对行业应用进行赋能。

DataExa-Sati大量使用了知识图谱可视化技术,涵盖了2D、3D的可视化渲染以及VR/AR的技术应用,性能更加卓越,表达方式更为多样和一目了然,能够直观展示信息之间的特定关系,深入浅出地描绘信息之间地潜在关联,以及预测信息的动态变化。DataExa-Sati现已覆盖了金融、公安、国防、运营商、教育、医疗等领域。其中,产品为公安、国防领域提供的情报分析和金融领域提供的征信大数据分析、风险控制分析等基于知识图谱的知识推理分析,成功帮助客户挖掘了海量数据背后的价值信息。

2、基于DataExa-Sati可视化知识图谱的最新技术应用

去年渊亭科技为某某军事研究单位研发的网络安全图谱应用,大量运用了WebXR交互手段,全应用了3D图谱可视化分析技术。这项目中,所涉及的数据量非常庞大,数据种类繁多,是典型的多源异构数据,且大量的数据中也关联着时空关系。

传统基于平面的图谱分析面对海量的数据节点,数据即使在良好布局下屏幕上往往也会糊成“大草球”,而通过3D图谱的展示,则能有效地利用了空间可变视角,可以通过缩放偏移看到节点的细节;同时,我们应用了WebXR技术,通过魔方手势交互,通过双缩放图谱、自然滑动翻转图谱,极大地方便了数据的可视化分析;另外,我们借助手柄可视位移技术实现了第一人称在数据空间内移动,沉浸式的交互体验很好的解决了复杂海量数据的洞察分析困难,更然的交互使用方式也使得上手更加容易。该项目的成功应用,获得了客户的极大认可和好评。

技术创新是企业前进发展的不竭动力,渊亭将努力把更多的前沿技术带入到知识图谱产品中,丰富产品能力,为客户创造更多的价值。

THE END
1.知识图谱数据可视化怎么做帆软数字化转型知识库知识图谱数据可视化可以通过使用FineBI、FineReport、FineVis等工具来实现,步骤包括数据集成、图谱构建和可视化展示。FineBI提供强大的数据分析能力,使得数据处理更加高效;FineReport则在报表设计和展示方面有着突出的表现;FineVis专注于数据可视化,能够将复杂的数据关系通过图形化方式直观呈现。通过FineVis进行知识图谱数据可视化https://www.fanruan.com/blog/article/131137/
2.dirKGUI:NebulaGraph的可视化,前后端完全打通nebula前端展示dirKG_UI:NebulaGraph的可视化,前后端完全打通 前言 1.含义: dir:代表“directory”(目录),指的是文件目录或文件夹。 KG:代表“Knowledge Graph”(知识图谱),用于表示和处理数据关系。 UI:代表“User Interface”(用户界面),用于用户与软件系统交互。 总体来说,dirKG_UI是一个用于展示和交互文件目录知识图谱的https://blog.csdn.net/qq_47753695/article/details/140290916
3.知识图谱可视化.pptx知识图谱可视化简介1.知识图谱可视化是将知识图谱中的信息以图形、图像、动画等视觉形式展示出来的过程,以帮助用户更好地理解和利用知识。2.知识图谱可视化可以借助交互技术和数据挖掘技术,让用户能够更方便地进行信息探索和分析,从而发现隐藏在数据背后的规律和趋势。3.知识图谱可视化在多个领域都有广泛的应用,比如人工智https://max.book118.com/html/2024/0115/5010240043011042.shtm
4.可视化“三驾马车”:知识图谱知识可视化与信息可视化可视化“三驾马车”:知识图谱、知识可视化与信息可视化 可视化是将大量的数据、信息和知识转化为一种人类的视觉形式,直观、形象地表现、解释、分析、模拟、发现或揭示隐藏在数据内部的特征和规律,提高人类对事物的观察、记忆和理解能力及整体概念的形成。 可视化研究发展的境脉大致遵循着科学计算可视化、数据可视化、信息https://blog.sciencenet.cn/blog-415-931560.html
5.知识图谱可视化:揭示知识的结构与关联文章摘要:在大数据时代,知识图谱作为一种结构化的知识表示方式,已经成为了数据分析和信息检索的重要工具。然而,知识图谱的数据规模庞大、关系复杂,如何有效地呈现其结构和关联成为了一个挑战。知识图谱可视化作为解决这一挑战的关键技术,正逐渐受到研究者和实践者的关注。 https://www.udesk.cn/ucm/report/58629
6.知识图谱的构建及知识图谱可视化知识图谱具有非结构化、可扩展性强、可解释性强、高度抽象等特点,是一种全新的知识呈现方式,是人工智能技术发展到一定阶段的产物,它打破了传统的数据库形式,将结构化信息以更为抽象的方式呈现出来,从而为人类认知世界提供了全新的视角和更大的想象空间。并通过知识图谱可视化,将数据和信息以可视化的方式呈现,更直观更https://yueshu.com.cn/posts/construction-and-visualization-of-kg
7.知识图谱可视化一、知识图谱可视化概述知识图谱是一种基于语义网络的可视化知识表示方法,通过图形化的方式将复杂的知识结构进行清晰、直观的表达。知识图谱可视化可以帮助人们更好地理解和掌握知识,同时还能发现和挖掘知识之间的关联和规律。知识图谱可视化技术的主要特点包括:1. 可视化表达:可视化表达是知识图谱的核心,它通过图形化的方式https://aiqicha.baidu.com/qifuknowledge/detail?id=10030783001
8.知识图谱可视化知识图谱可视化是一项重要的技术,它能够将庞大而复杂的知识图谱以直观的方式展现给用户。知识图谱(knowledge graph)是一种用于组织和表示结构化知识的图形数据库模型,它将现实世界中的事物、概念、关系等信息以图形的形式进行建模,并使用图形数据库技术来存储和查询这些数据。 https://www.huaweicloud.com/zhishi/smart-18525863.html
9.领域知识图谱构建可视化流程我的毕设是做领域知识图谱,知识图谱的构建主要有一下几步:数据采集、数据处理、数据存储以及可视化。知识图谱的可视化功能是很强的,因此我根据网上基于vue和d3.js可视化程序,改造为了我的知识图谱可视化方案。 简介 系统的总体架构分为知识存储层和知识图谱应用层。知识图谱的知识存储层主要涉及到对数据的采集、处理https://zhuanlan.zhihu.com/p/494300250
10.什么是知识图谱可视化工具?这篇文章带你深入探索!知识图谱作为一种强大的信息组织和表达方式,已经在多个领域得到广泛应用。而知识图谱可视化工具则是将复杂的知识图谱数据以直观、可交互的方式展现给用户,帮助人们更好地理解和利用知识图谱。本文将介绍知识图谱可视化工具的优势及其在不同领域的应用案例,带你一同探索其魅力所在。 https://www.finebi.com/visualization/smszhshtpkshh
11.知识图谱可视化是什么初闻这个名词,我是迷惑的,知识图谱是后端的东西,它常用的图形存储数据库就能够将它很好滴可视化,那为什么还要放到前端呢?要怎么放? 讲知识图谱存储到图形数据库,前端从接口调数据库里的数据,然后可视化展现,那知识图谱用在了哪一步呢? 然后我发现其实知识图谱的可视化也就是数据的可视化,也是用可视化的工具比如echarthttps://www.jianshu.com/p/1a9fb28db768
12.知识图谱可视化工具:数据洞察的新视角通过使用沃丰科技的知识图谱可视化工具,企业可以更有效地挖掘和利用自己的数据资源,从而在激烈的市场竞争中占据优势。这一工具不仅提高了数据分析的效率,还提升了企业决策的质量。随着数据驱动决策在商业环境中变得越来越重要,沃丰科技的知识图谱可视化工具无疑将成为众多企业不可或缺的伙伴。 https://chuangke.aliyun.com/info/1067920.html