CN113721823A - 一种基于拖拽式的人机互动数据可视化方法 - Google Patents

一种基于拖拽式的人机互动数据可视化方法 Download PDF

Info

Publication number
CN113721823A
CN113721823A CN202111084075.9A CN202111084075A CN113721823A CN 113721823 A CN113721823 A CN 113721823A CN 202111084075 A CN202111084075 A CN 202111084075A CN 113721823 A CN113721823 A CN 113721823A
Authority
CN
China
Prior art keywords
data
dragging
human
computer interaction
node
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202111084075.9A
Other languages
English (en)
Inventor
周国庆
吴凡
曹志富
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Fuyun Data Service Co ltd
Original Assignee
Fuyun Data Service Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Fuyun Data Service Co ltd filed Critical Fuyun Data Service Co ltd
Priority to CN202111084075.9A priority Critical patent/CN113721823A/zh
Publication of CN113721823A publication Critical patent/CN113721823A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0486Drag-and-drop
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/901Indexing; Data structures therefor; Storage structures
    • G06F16/9024Graphs; Linked lists
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Databases & Information Systems (AREA)
  • Data Mining & Analysis (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明公开了一种基于拖拽式的人机互动数据可视化方法,包括如下步骤:S1:数据解析,分析从图数据库读取关联关系数据,将其解析转化成结构化的本体数据;S2:数据处理,实例化数据模型映射业务类型;S3:人机互动操作,通过页面拖拽技术直接拖动页面中预先设定的元素配置查询参数;S4:界面层,根据业务类型呈现对应的可视化类图。本发明通过页面拖拽技术拖到箭头直接改变节点间的关联关系;拖动元素到目前区域,创建查询筛选条件;拖动节点、边线的建立新的节点;这种拖拽式的人机互动大大提高可视化分析效率,解决如何便捷地使用数据可视化查询、编辑技术的问题。

Description

一种基于拖拽式的人机互动数据可视化方法
技术领域
本发明涉及大数据分析可视化技术领域,特别涉及一种基于拖拽式的人机互动数据可视化方法。
背景技术
随着大数据技术的快速发展,各大公司企业,尤其是互联网企业,都在从各个角度采集数据、存储数据、处理数据、分享数据、检索数据、分析数据、展示数据和挖掘数据背后的商业价值,并通过打造一站式大数据分析平台。随着业务应用的精细化,降低数据分析难度已经成为各大公司的重点研究方向。
但是,平台的构建与应用的落地依然存在一定的差距,如大数据业务应用分析逻辑建立,无法实现复用,另外针对大数据分析特点,需要多方面技术人员的配合,耗费大量的人力和时间,在人才储备不足和知识融合欠缺的现状下,为了降低企业大数据应用的开发难度,构建一套面向数据分析师和业务专家的大数据可视化分析系统显得非常必要。
目前市面上的类似产品如ETL工具,用户在使用工具去做大数据分析时,需要进行一定的代码编写或者SQL逻辑的处理,对使用用户有较高的技术基础要求,从而增加了使用大数据技术的成本。另外在编辑网络关系图边的方向指向是不方便,如果拖到箭头直接改变节点间的关联关系,那么将会大大提高编辑效率。
发明内容
本发明的目的在于提供一种基于拖拽式的人机互动数据可视化方法,通过页面拖拽技术拖到箭头直接改变节点间的关联关系;拖动元素到目前区域,创建查询筛选条件;拖动节点、边线的建立新的节点;这种拖拽式的人机互动大大提高可视化分析效率,解决如何便捷地使用数据可视化查询、编辑技术的问题。
为实现上述目的,本发明提供如下技术方案:
一种基于拖拽式的人机互动数据可视化方法,包括如下步骤:
S1:数据解析,分析从图数据库读取关联关系数据,将其解析转化成结构化的本体数据;
S2:数据处理,实例化数据模型映射业务类型;
S3:人机互动操作,通过页面拖拽技术直接拖动页面中预先设定的元素配置查询参数;
S4:界面层,根据业务类型呈现对应的可视化类图。
进一步地,S1数据解析从Neo4j数据库读取保存好的关联关系数据,将JSON数据解析成定义的本体数据,再转化成V节点和E边实例,内容包括nodes节点V数组、links边E数组。
进一步地,S1数据解析包括本体数据类型定义和转化V节点和E边。
进一步地,S2数据处理包括配置布局参数和根据Type映射draw方法。
进一步地,S3人机互动操作包括拖拽节点和拖拽边和箭头。
进一步地,S4界面层包括节点层显示、边和箭头层显示。
进一步地,S2数据处理,配置布局初始化位置,布局区域大小、Edge边标签长度、Node节点大小的半径初始值、Edge边线和箭头长度、Dragger对象初,根据type映射draw方法,通过计算位置绘制文字位置、曲线位置、箭头位置。
进一步地,S3人机互动操作,通过拖拽操作是获取鼠标移动的距离和坐标(x,y),计算出新的位置。
进一步地,步骤4界面层,判断力位置是否发生变化;若位置变化则更新图中节点、边、箭头的位置重新显示。
与现有技术相比,本发明的有益效果是:
1.本发明提出的基于拖拽式的人机互动数据可视化方法,支持本体数据类型的关联关系:本发明可将普通的关联关系数据转化成结构化得本体数据,根据本体的数据类型映射对应的draw方法。
2.本发明提出的基于拖拽式的人机互动数据可视化方法,支持力布局配置参数:通过力导向算法模型配置布局参数,均匀计算分布节点位置,有利于揭示事物间关联关系。
3.本发明提出的基于拖拽式的人机互动数据可视化方法,支持元素的拖拽:有助于整个关联关系图的布局,可以有效防止位置的重叠,更好的显示关联关系。拖拽元素可以更新位置,拖拽边的箭头可以重新指向节点,拖拽节点可以直接当条件查询。
附图说明
图1为本发明的拖拽式的人机互动数据可视化分析方法框架图;
图2为本发明的实体关联局部关系图;
图3为本发明的拖拽式的人机互动具体绘制方法流程图;
图4为本发明的关联关系布局绘制结果图;
图5为本发明的鼠标拖拽位置坐标变化图;
图6为本发明的元素拖拽流程图;
图7为本发明的拖拽式的人机互动数据可视化构建流程图。
具体实施方式
下面将结合本发明实施例中的附图,对本发明实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
一种基于拖拽式的人机互动数据可视化方法,通过页面拖拽技术实现业务模型中,逻辑条件筛选、节点、边线的可视化参数设置,并建立节点之间的关系。本发明能够简化数据可视化分析方面的查询工作流程,提高可视化分析效率,其发明原理如图1,包括如下步骤:
S1:数据解析,根据输入JSON数据,从Neo4j数据库读取保存好的关联关系数据,将JSON数据解析成定义的本体数据,再转化成V节点和E边实例,内容包括nodes节点V数组、links边E数组;
S2:数据处理,配置布局初始化位置,布局区域大小、Edge边标签长度、Node节点大小的半径初始值、Edge边线和箭头长度、Dragger对象初。根据type映射draw方法.通过计算位置绘制文字位置、曲线位置、箭头位置;
S3:人机互动操作,通过页面拖拽技术拖动页面中预先设定的元素,实现业务类型中各个节点、边线参数的可视化参数设置,并构建节点、边之间的关系,形成可视化类图,通过拖拽操作是获取鼠标移动的距离和坐标(x,y),计算出新的位置;
S4:界面层,根据业务类型呈现对应的可视化类图,判断力位置是否发生变化;若位置变化则更新图中节点、边、箭头的位置重新显示。
拖拽式:即拖拽页面上设定好的元素或内容块进行人机互动可视化数据分析。
如图2是以实体关联关系绘制的关系局部图,其中,图各个圆型节点表示实体节点,有向边表示节点之间的关联关系,由源节点指向目标节点,边上标注的是各本体之间的关联信息,拖拽包括箭头改变边到节点指向;对于本发明而言,最重要的是如何通过拖拽支持图的查看、编辑。当拖拽箭头改变节点的指向,拖拽节点改变节点位置。从两个节点之间拖拽一条直线立即新建一条边。
其中S1数据解析模块的详细步骤如下:
S1.1本体数据类型定义:
节点包括:类、事物、等价物、弃用、外部、文本、数据类型、rdfs类、rdfs资源、交集、并集、补码。
边包括:对象、数据类型、rdf、弃用、外部、不相交、子类。
箭头包括:正常1、虚线、特殊。
封装拖拽对象:类拖动器,目标,源拖动器。
S1.2转化V节点和E边,将JSON数据的nodes数组转化成V节点数组,为每个V节点添加初始半径,宽、高及本体数据类型;将JSON格式的links数组转化成E边数组每个E边添加初始半径、宽、高及本体边标签属性数据类型,边链线的类型、边标签属性主要标题和副标题。遍历数组计算是否存在多边、自己指向自己的边。
其中S2数据处理模块详细步骤如下:
S2.1配置布局初始化位置
初始化参数:布局区域大小width为800px,height为600px;Edge边标签长度160px;Node节点大小的半径初始值30px;Edge边线和箭头长度200px;Dragger对象初始化隐藏,当鼠标移动到拖拽对象上的时候显示;离开拖拽对象再次隐藏。
S2.2根据Type映射draw方法
draw方法基于浏览器SVG,节点的Draw方法为先节点的圆和文本,再居中文字,如果有辅助文字和图片添加在右下角。边线的Draw方法利用两个节点点间的距离公式先计算边的长度再除以2找到中心点,属性的位置添加到中心点,关联关系布局绘制结果如图4。
节点的Draw方法如下:
Figure BDA0003262541970000051
Figure BDA0003262541970000061
边线的Draw方法如下:
Figure BDA0003262541970000062
其中S3人机互动操作模块详细步骤如下:
拖拽操作是通过获取鼠标移动的距离来实现的,即计算移动前的位置的坐标(x,y)与移动中的位置的坐标(x,y)差值,鼠标拖拽位置坐标变化如图5。
S3.1拖拽节点
拖拽节点的位置计算:当鼠标按下时,需要记住鼠标的初始位置与目标元素的初始位置,目标就是实现当鼠标移动时,目标元素也跟着移动,移动位置关系:移动后的鼠标位置-鼠标初始位置=移动后的目标元素位置-目标元素的初始位置;如果鼠标位置的差值用dis来表示,那么移动后目标元素的位置=dis+目标元素的初始位置;通过事件对象,可以精确的知道鼠标的当前位置,因此当鼠标拖动时,可以不停的计算出鼠标移动的差值,以此来求出目标元素的当前位置。而在鼠标松开结束拖拽时,计算移动后目标元素的最终位置(x,y),根据x,y在布局中的位置,查找映射的拖拽对象,改变成新的指向targetDragger.在实际应用中独拖拽节点没有放入目标元素则只是移动节点,改变节点的位置。若拖拽节点到查询框则以此为条件查询相关联的信息,元素拖拽流程如图6。
S3.2拖拽边和箭头
若将指针指向目标对象的边或箭头,按下并且拖动它到一个新的目标位置,然后释放则重新变更边的指向。
若单独拖拽上的箭头到目标节点则是新建一条边。
若节点类别不可以拖拽,则拖拽功能禁止。
其中S4界面层模块详细步骤如下:
操作界面上节点和边分层显示处理,当鼠标hover节点或者鼠标hover边就出现拖拽操作对象。
S4.1节点层显示
将所有的nodes的V数组对象显示成节点,index为节点在nodes数组中的索引,x为节点当前的x坐标,y为节点当前的y坐标,Vx为节点当前的x方向速度,vy为节点当前的y方向速度。
S4.2边和箭头层显示
将所有的links的E数组对象显示成link边,source为边的源节点;target为边的目标节点;index-基于0的在links中的索引,会自动分配。为方便起见,边的源和目标节点可以在初始时使用索引或者字符串标识符,而不一定非要为对象引用。任何不是引用的link.source or link.target都会根据指定的标识符被转为node引用形式。如果指定的links数组被修改,比如添加或者移除边,重新调用重绘。
构建的基于拖拽式的人机互动数据可视化关系如图7。
本发明加入数据解析模块,可以解析成本体类型,支持实体的关联关系;再转化成V节点和E边实例,根据本体的数据类型添加对应的draw方法,实现不同节点的绘制方法,而且扩展性好;加入数据处理模型,配置力布局参数,均匀的布局节点和边;加入人机互动操作模块,支持节点和边的编辑、查询法功能,方面图的操作。
首先,本方法结合实际应用,优化了本体数据的分类定义问题,提出了真实本体数据定义,优化了其应用价值。其次,在数据处理的问题中,配置布局参数,参数值充分调优;可以使用分布均匀、高对称性;同时根据不同的类型映射draw方法。最后,通过拖拽式的人机互性操作,可以快速的改变元素的位置、编辑和查询节点信息,监听位置的变化,若拖拽改变x,y则及时更新位置。
以上所述,仅为本发明较佳的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明披露的技术范围内,根据本发明的技术方案及其发明构思加以等同替换或改变,都应涵盖在本发明的保护范围之内。

Claims (9)

1.一种基于拖拽式的人机互动数据可视化方法,其特征在于,包括如下步骤:
S1:数据解析,分析从图数据库读取关联关系数据,将其解析转化成结构化的本体数据;
S2:数据处理,实例化数据模型映射业务类型;
S3:人机互动操作,通过页面拖拽技术直接拖动页面中预先设定的元素配置查询参数;
S4:界面层,根据业务类型呈现对应的可视化类图。
2.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S1数据解析从Neo4j数据库读取保存好的关联关系数据,将JSON数据解析成定义的本体数据,再转化成V节点和E边实例,内容包括nodes节点V数组、links边E数组。
3.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S1数据解析包括本体数据类型定义和转化V节点和E边。
4.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S2数据处理包括配置布局参数和根据Type映射draw方法。
5.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S3人机互动操作包括拖拽节点和拖拽边和箭头。
6.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S4界面层包括节点层显示、边和箭头层显示。
7.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S2数据处理,配置布局初始化位置,布局区域大小、Edge边标签长度、Node节点大小的半径初始值、Edge边线和箭头长度、Dragger对象初,根据type映射draw方法,通过计算位置绘制文字位置、曲线位置、箭头位置。
8.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,S3人机互动操作,通过拖拽操作是获取鼠标移动的距离和坐标(x,y),计算出新的位置。
9.如权利要求1所述的一种基于拖拽式的人机互动数据可视化方法,其特征在于,步骤4界面层,判断力位置是否发生变化;若位置变化则更新图中节点、边、箭头的位置重新显示。
CN202111084075.9A 2021-09-14 2021-09-14 一种基于拖拽式的人机互动数据可视化方法 Pending CN113721823A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202111084075.9A CN113721823A (zh) 2021-09-14 2021-09-14 一种基于拖拽式的人机互动数据可视化方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202111084075.9A CN113721823A (zh) 2021-09-14 2021-09-14 一种基于拖拽式的人机互动数据可视化方法

Publications (1)

Publication Number Publication Date
CN113721823A true CN113721823A (zh) 2021-11-30

Family

ID=78683949

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111084075.9A Pending CN113721823A (zh) 2021-09-14 2021-09-14 一种基于拖拽式的人机互动数据可视化方法

Country Status (1)

Country Link
CN (1) CN113721823A (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114741018A (zh) * 2022-04-21 2022-07-12 平安国际智慧城市科技股份有限公司 数据可视化方法、装置、设备及存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103246704A (zh) * 2013-04-08 2013-08-14 浪潮集团山东通用软件有限公司 一种基于通用数据结构描述的实体与关系数据的映射方法
CN107545019A (zh) * 2017-03-02 2018-01-05 微云数聚(北京)科技有限公司 一种图数据库数据驱动的可视化方法及系统
CN111813926A (zh) * 2019-11-13 2020-10-23 中国传媒大学 一种图数据库Neo4J交互可视化的操作方法与系统
CN112783966A (zh) * 2021-01-08 2021-05-11 科大国创云网科技有限公司 一种基于业务元数据的sql可视化设计生成方法及系统

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103246704A (zh) * 2013-04-08 2013-08-14 浪潮集团山东通用软件有限公司 一种基于通用数据结构描述的实体与关系数据的映射方法
CN107545019A (zh) * 2017-03-02 2018-01-05 微云数聚(北京)科技有限公司 一种图数据库数据驱动的可视化方法及系统
CN111813926A (zh) * 2019-11-13 2020-10-23 中国传媒大学 一种图数据库Neo4J交互可视化的操作方法与系统
CN112783966A (zh) * 2021-01-08 2021-05-11 科大国创云网科技有限公司 一种基于业务元数据的sql可视化设计生成方法及系统

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114741018A (zh) * 2022-04-21 2022-07-12 平安国际智慧城市科技股份有限公司 数据可视化方法、装置、设备及存储介质
CN114741018B (zh) * 2022-04-21 2023-12-01 平安国际智慧城市科技股份有限公司 数据可视化方法、装置、设备及存储介质

Similar Documents

Publication Publication Date Title
US9152695B2 (en) Generation of metadata and computational model for visual exploration system
CN103744846A (zh) 一种多维度动态局部知识地图及其构建方法
CN102763100B (zh) 用于利用交互式图形接口创建及操纵数据结构的系统和方法
US10146843B2 (en) System, method and computer program for creating and manipulating data structures using an interactive graphical interface
Saygi et al. Management of Architectural Heritage Information in BIM and GIS: State-of-the-art and Future Perspectives
US9465523B2 (en) Visual exploration of multidimensional data
CN114379608A (zh) 一种城市轨道交通工程的多源异构数据集成处理方法
CN109614671B (zh) 一种基于视图的三维mbd工序模型组织及表达方法
US20090326921A1 (en) Grammar checker for visualization
CN101719146B (zh) 地理信息应用分析模型的动态图形化方法和装置
CN113901231A (zh) 一种知识图谱的演进分析方法、装置及介质
CN108170855B (zh) 一种CityGML与IFC数据统一查询及数据抽取方法
CN113721823A (zh) 一种基于拖拽式的人机互动数据可视化方法
JP2001014166A (ja) オントロジー対応付け情報生成装置
WO2016165317A1 (zh) 一种高速列车需求数据实例构建方法和装置
CN115935915A (zh) 文档处理方法、计算机设备、存储介质
CN111581815B (zh) 一种基于xml的工艺模型本体构建方法
CN101149742A (zh) 基于图形与图象模式下的多态复合链接技术
US9128908B2 (en) Converting reports between disparate report formats
JPH0477869A (ja) データベースシステムのマルチメデイアデータ処理方法
Su et al. A multi-level visualization method for IT system structure
Denisovich Software support for annotation of visualized data using hand-drawn marks
CN113868322B (zh) 一种语义结构解析方法、装置、设备及虚拟化系统、介质
Gai et al. Overview of interactive visualization methods
Boutin et al. Multilevel compound tree–construction visualization and interaction

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination