CN111597249A - 数据显示方法和相关装置 - Google Patents
数据显示方法和相关装置 Download PDFInfo
- Publication number
- CN111597249A CN111597249A CN202010335227.7A CN202010335227A CN111597249A CN 111597249 A CN111597249 A CN 111597249A CN 202010335227 A CN202010335227 A CN 202010335227A CN 111597249 A CN111597249 A CN 111597249A
- Authority
- CN
- China
- Prior art keywords
- data
- ring
- circular
- visualized
- arc
- 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
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/26—Visual data mining; Browsing structured data
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/904—Browsing; Visualisation therefor
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction 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
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/20—Drawing from basic elements, e.g. lines or circles
- G06T11/206—Drawing of charts or graphs
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Human Computer Interaction (AREA)
- User Interface Of Digital Computer (AREA)
- Storage Device Security (AREA)
- Digital Computer Display Output (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
- Controls And Circuits For Display Device (AREA)
Abstract
本申请实施例公开了一种数据显示方法和相关装置,该方法包括:根据第一待可视化数据,生成第一圆环;所述第一待可视化数据包括第一类型的数据,所述第一类型的数据包括N种状态的数据;所述第一圆环包括N段圆弧,所述N段圆弧中每段圆弧对应所述第一类型的一种状态的数据,所述N为大于0的整数;显示所述第一圆环;用户通过圆环的变化可以直观的感受数据的变化,并且能够较好的展示数据之间的关联性。
Description
技术领域
本申请涉及数据可视化领域,尤其涉及一种数据显示方法和相关装置。
背景技术
大数据与人们生活息息相关,全球数据呈现爆发增长、海量集聚的特点。从国家到个人越来越意识到数据的重要性。因此,对于大数据的可视化操作以及可视化呈现,尤为重要。可视化是指将相对抽象的数字等内容转化为直观的图形、图像等呈现出来,便于阅读者和研究者观察、模拟、分析。以可视化为基础,近年来,地形可视化、大数据可视化、语音可视化等技术在相应领域蓬勃发展。然而,当前采用的可视化技术普遍存在采集或者统计后的数据缺乏关联性,数据模型复杂,缺乏交互等问题。因此,需要研究能够展示数据之间的关联性且数据模型简单的数据显示方案。
发明内容
本申请实施例公开了一种数据显示方法和相关装置,能够展示数据之间的关联性,并且数据模型简单。
第一方面,本申请实施例提供了一种数据显示方法,该方法包括:根据第一待可视化数据,生成第一圆环;所述第一待可视化数据包括第一类型的数据,所述第一类型的数据包括N种状态的数据;所述第一圆环包括N段圆弧,所述N段圆弧中每段圆弧对应所述第一类型的一种状态的数据,所述N为大于0的整数;显示所述第一圆环。
本申请实施例中,根据待可视化数据生成一个或者多个圆环,每个圆环表征一种类型的数据,每个圆环包括一个或者多个圆弧,每个圆弧对应的数据的状态不同。举例来说,第一圆环包括3段圆弧,每段圆弧对应一种状态的第一类型的数据。本申请实施例的执行主体可以是台式电脑、笔记本电脑、服务器等电子设备。可选的,所述第一待可视化数据为电子设备对实时采集的数据进行汇总得到的待可视化数据。本申请实施例中,电子设备当前显示有一个或者多个圆环(包括第二圆环);该电子设备可根据得到的待可视化数据,生成新的圆环,并更新当前显示的圆环。举例来说,当前显示有圆环1至圆环3,其中,圆环1为根据类型1的数据生成的,圆环2为根据类型2的数据生成的,圆环3为根据类型3的数据生成的;在第一待可视化数据包括的类型2和类型3的数据与第二待可视化数据包括的类型2和类型3的数据不同时,更新圆环2和圆环3。也就是说,电子设备可根据获取的待可视化数据实时更新显示的圆环,圆环能实时放映当前的数据。在实际应用中,每次待可视化数据发生变化,都会触发电子设备自动渲染成为新的比例的圆环。另外,每段圆弧对应所述第一类型的一种状态的数据,能体现数据之间的关联性。
本申请实施例中,用户通过圆环的变化可以直观的感受数据的变化,并且能够较好的展示数据之间的关联性。
在一个可选的实现方式中,所述显示所述第一圆环包括:将当前显示的第二圆环更新为所述第一圆环;所述第二圆环为在得到所述第一待可视化数据之前,根据所述第一类型的第二数据生成的圆环。
在一个可选的实现方式中,所述方法还包括:显示一个目标图形,所述目标图形内部具有描述信息,所述描述信息用于描述所述第一圆环中任一圆弧表示的内容。
在一个可选的实现方式中,所述第一圆环显示于所述目标图形的四周,所述目标图形为表征光晕星球的圆形。
在一个可选的实现方式中,所述第一圆环显示在一个表征光晕星球的圆形(即一个发光圆球)的四周,所述圆形的内部显示有描述信息。
电子设备当前显示的内容可视为一个可视化模型,该可视化模型包括至少一个圆环。示例性的,在当前显示的圆环均未被选中的情况下,显示第一描述信息,所述第一描述信息用于描述可视化模型(即)的信息,例如运行天数;在所述第一圆环被选中的情况下,显示第二描述信息,所述第二描述信息用于描述所述第一类型的数据。
在该实现方式中,将至少一个圆环显示在发光圆球的周围,并在该发光圆球的内部显示相应的描述信息,以便于用户更直接的感受数据的变化以及各圆环表征的数据。
在一个可选的实现方式中,所述将当前显示的第二圆环更新为所述第一圆环之后,所述方法还包括:在接收到第一选择指令之后,显示第一圆弧对应的数据;所述第一选择指令用于选择所述第一圆环中的所述第一圆弧,所述第一圆弧为所述N段圆弧中的任一个。
接收到第一选择指令可以是接收到用户通过输入设备(例如鼠标)针对所述第一圆弧的点击操作;还可以是将鼠标移动至所述第一圆弧的操作;还可以是其他选择所述第一圆弧的操作,本申请实施例不作限定。举例来说,用户可以使用鼠标点击和移动到对应的圆弧上操作圆环,来达到切换数据等目的,进而实现用户的实际需求。
在该实现方式中,用户通过这种圆环交互可以清晰明了的知道每一份数据在系统中扮演的角色,以便于用户可以根据这些数据做出实际判断,交互性强。
在一个可选的实现方式中,在接收到第一选择指令之后,所述方法还包括:通过高亮方式显示所述第一圆弧。
在该实现方式中,通过高亮方式显示第一圆环,以便于更直观清楚地显示用户所关注的数据。
在一个可选的实现方式中,所述通过高亮方式显示所述第一圆弧包括:通过高亮方式显示所述第一圆环的同时,增大所述第一圆环的宽度。
在一个可选的实现方式中,所述N段圆弧中的第二圆弧的长度与所述第二圆弧对应的数据在总数据中的占比正相关,所述总数据为所述第一待可视化数据中的所述第一类型的数据,所述第二圆弧为所述N段圆弧中的任一个。
每一段圆弧的长取决于其对应的数据在总数据中的占比。例如,第二圆弧表征的数值为100,总数据表征的数值为500,则该第二圆弧的弧长与第一圆环的长度的比值为20%,即第二圆弧的占比为20%。
在该实现方式中,每个圆弧的长度能反映该圆弧对应的那种状态的数据在总数据中的占比,这样用于就能根据圆环的实际弧长以及其他辅助性的数据显示来做简单迅速的数据判断。
在一个可选的实现方式中,所述N段圆弧中任意两段圆弧的颜色不同。
在一个可选的实现方式中,所述将当前显示的第二圆环更新为所述第一圆环包括:将所述第二圆环渲染到当前显示的画面中;所述画面包括至少一个圆环,每个圆环对应一种类型的数据。
示例性的,电子设备基于前端SVG以及Canvas前端渲染技术动态渲染光环效果,即将所述第二圆环渲染到当前显示的画面中。
在一个可选的实现方式中,所述至少一个圆环以旋转方式显示,并且所述至少一个圆环中任意两个圆环的旋转速度不同。
示例性的,电子设备在做动画渲染时使用CSS3 animate对各圆环的转动参数做调整,例如对不同的圆环的旋转速率进行差速调整,以达到不同圆环不同速率的效果。另外,实现进场动画由快到慢的变化以及旋转动画的控制。举例来说,第一圆环每隔10秒旋转360度。
在一个可选的实现方式中,所述根据第一待可视化数据,生成第一圆环之前,所述方法还包括:根据第二待可视化数据,生成M个圆环;所述M个圆环中每个圆环对应一种类型的数据,所述M个圆环包括所述第二圆环,所述M为大于1的整数,所述第二待可视化数据包括至少一种类型的数据;将所述M个圆环渲染到当前显示的画面中。
在该实现方式中,每个圆环可反映一种类型的数据,可视化模型简单,使得用户可直观的看到数据的分布,有助于用户理解系统实时运行以及运营情况。
第二方面,本申请实施例提供了一种电子设备,包括:生成单元,用于根据第一待可视化数据,生成第一圆环;所述第一待可视化数据包括第一类型的数据,所述第一类型的数据包括N种状态的数据;所述第一圆环包括N段圆弧,所述N段圆弧中每段圆弧对应所述第一类型的一种状态的数据,所述N为大于0的整数;显示单元,用于显示所述第一圆环。
在一个可选的实现方式中,所述显示单元,具体用于将当前显示的第二圆环更新为所述第一圆环;所述第二圆环为在得到所述第一待可视化数据之前,根据所述第一类型的数据生成的圆环。
在一个可选的实现方式中,所述显示单元,还用于显示一个目标图形,所述目标图形内部具有描述信息,所述描述信息用于描述所述第一圆环中任一圆弧表示的内容。
在一个可选的实现方式中,所述第一圆环显示于所述目标图形的四周,所述目标图形为表征光晕星球的圆形。
在一个可选的实现方式中,所述第一圆环显示在一个表征光晕星球的圆形的四周,所述圆形的内部显示有描述信息。
在一个可选的实现方式中,所述电子设备还包括:接收单元,用于接收第一选择指令;所述第一选择指令用于选择所述第一圆环中的所述第一圆弧,所述第一圆弧为所述N段圆弧中的任一个;所述显示单元,还用于显示第一圆弧对应的数据。
在一个可选的实现方式中,所述显示单元,具体用于通过高亮方式显示所述第一圆弧。
在一个可选的实现方式中,所述显示单元,具体用于通过高亮方式显示所述第一圆环的同时,增大所述第一圆环的宽度。
在一个可选的实现方式中,所述N段圆弧中的第二圆弧的长度与所述第二圆弧对应的数据在总数据中的占比正相关,所述总数据为所述第一待可视化数据中的所述第一类型的数据,所述第二圆弧为所述N段圆弧中的任一个。
在一个可选的实现方式中,所述N段圆弧中任意两段圆弧的颜色不同。
在一个可选的实现方式中,所述显示单元,具体用于将所述第二圆环渲染到当前显示的画面中;所述画面包括至少一个圆环,所述至少一个圆环中每个圆环对应一种类型的数据。
在一个可选的实现方式中,所述至少一个圆环以旋转方式显示,并且所述至少一个圆环中任意两个圆环的旋转速度不同。
在一个可选的实现方式中,所述生成单元,还用于根据第二待可视化数据,生成M个圆环;所述M个圆环中每个圆环对应一种类型的数据,所述M个圆环包括所述第二圆环,所述M为大于1的整数,所述第二待可视化数据包括至少一种类型的数据;所述显示单元,还用于将所述M个圆环渲染到当前显示的画面中。
第三方面,本申请实施例提供了一种电子设备,该电子设备包括:存储器,用于存储程序;处理器,用于执行所述存储器存储的所述程序,当所述程序被执行时,所述处理器用于执行如上述第一方面以及任一种可选的实现方式的方法。
第四方面,本申请实施例提供了一种芯片,该芯片包括处理器与数据接口,该处理器通过该数据接口读取存储器上存储的指令,执行如上述第一方面以及任一种可选的实现方式的方法。
第五方面,本申请实施例提供了一种计算机可读存储介质,该计算机存储介质存储有计算机程序,该计算机程序包括程序指令,该程序指令当被处理器执行时使该处理器执行上述第一方面及任一种可选的实现方式的方法。
第六方面,本申请实施例提供了一种计算机程序产品,该计算机程序产品包括程序指令,所述程序指令当被处理器执行时使所述处理器执行上述第一方面以及任一种可选的实现方式的方法。
附图说明
为了更清楚地说明本申请实施例或背景技术中的技术方案,下面将对本申请实施例或背景技术中所需要使用的附图进行说明。
图1为本申请实施例提供的一种数据显示方法流程图;
图2为本申请实施例提供的一种可视化界面的对比示意图;
图3为本申请实施例提供的另一种可视化界面的对比示意图;
图4为本申请实施例提供的又一种可视化界面的对比示意图;
图5为本申请实施例提供的另一种数据显示方法流程图;
图6为本申请实施例提供的一种电子设备的结构示意图;
图7为本申请实施例提供的另一种电子设备的结构示意图;
图8为本申请实施例提供的一种服务器的结构示意图。
具体实施方式
本申请的说明书实施例和权利要求书及上述附图中的术语“第一”、“第二”、和“第三”等是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元。方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
本申请实施例提供一种数据显示方法和相关装置,能够展示数据之间的关联性,并且数据模型简单。本申请实施例提供的数据显示方法(即数据可视化方法)适用于数据可视化场景中,使得用户可以直观的感受数据的变化,并且通过与可视化数据交互可以清晰明了的知道每一份数据在在系统中扮演的角色。
图1为本申请实施例提供的一种数据显示方法流程图。如图1所示,该方法可包括:
101、电子设备根据第一待可视化数据,生成第一圆环。
上述第一待可视化数据包括第一类型的数据,上述第一类型的数据包括N种不同状态的数据;上述第一圆环包括N段圆弧,每段圆弧对应上述第一类型的一种状态的数据,上述N为大于0的整数。本申请实施例的执行主体可以是台式电脑、笔记本电脑、服务器等电子设备。
可选的,电子设备根据第一待可视化数据,生成第一圆环可以是:根据第一待可视化数据包括的至少一种类型的数据以及每种类型的数据对应的状态,换算圆环的大小以及圆环的弧;其中,每个圆环表征一种类型的数据,同一个圆环中不同圆弧表征不同状态的数据。示例性的,上述N段圆弧中的第二圆弧的长度与上述第二圆弧对应的数据在总数据中的占比正相关,上述总数据为上述第一待可视化数据中的上述第一类型的数据,上述第二圆弧为上述N段圆弧中的任一个。
102、电子设备显示上述第一圆环。
在一些实施例中,上述第一圆环可以是首次根据上述第一待可视化数据,生成的圆环。在一些实施例中,上述第一圆环可以是非首次根据上述第一待可视化数据,生成的圆环;电子设备显示上述第一圆环可以是将当前显示的第二圆环更新为上述第一圆环。可选的,上述第一待可视化数据为电子设备对实时采集的数据进行汇总得到的待可视化数据。可选的,上述第一待可视化数据为服务端(例如服务器)对实时采集到的数据进行汇总之后,发送给上述电子设备(对应前端)的。也就是说,电子设备从服务端(对应于后台服务器)获得上述第一待可视化数据。可选的,上述第一待可视化数据为用户通过移动存储装置,例如优盘、移动硬盘等,拷贝至上述电子设备的。在一些实施例中,电子设备(即前端)可根据实际数据(即待可视化数据)换算圆环的大小以及圆环的弧长(例如生成第一圆环)。举例来说,电子设备根据待可视化数据,生成多个由内到外分布的圆环,每个圆环代表一种类型的数据,每个圆环包括至少一段圆弧,每段圆弧表征一种状态的数据。举例来说,某个系统中产生了多种状态不同但类型相同的数据,其中一种状态的数据新增15份,那么这个状态相对应的弧长会变长。本申请实施例中,电子设备当前显示有一个或者多个圆环(包括第二圆环);该电子设备可根据最近得到的待可视化数据,生成新的圆环,并更新当前显示的圆环。电子设备具备或者连接有显示装置,例如显示器,该显示装置用于显示生成的圆环。
下面结合附图来描述如何将当前显示的第二圆环更新为第一圆环。
图2为本申请实施例提供的一种可视化界面的对比示意图。如图2所示,左半图中的3个圆环为当前显示的圆环,其中,202表示第二圆环;右半图中的3个圆环为更新后的圆环,其中,205表示第一圆环。对比图2的左半图和右半图可知,第二圆环202和第一圆环205相比,各圆弧的占比发生改变。示例性的,图2左半图中的圆环201、圆环202(即第二圆环)以及圆环203分别为根据第二待可视化数据中的第一类型数据、第二类型数据以及第三类型数据生成的;图2右半图中的圆环204、圆环205(即第一圆环)以及圆环206分别为根据第一待可视化数据中的第一类型数据、第二类型数据以及第三类型数据生成的;该第一待可视化数据为最近获得的待可视化数据,该第二待可视化数据为在获得该第一待可视化数据之前获得的待可视化数据。又举例来说,电子设备当前显示有圆环1至圆环3,其中,圆环1为根据类型1的数据生成的,圆环2为根据类型2的数据生成的,圆环3为根据类型3的数据生成的;在第一待可视化数据包括的类型2和类型3的数据与第二待可视化数据包括的类型2和类型3的数据不同时,更新圆环2和圆环3。应理解,电子设备可根据实时获得的待可视化数据,生成相应的圆环,并显示。也就是说,电子设备可根据获取的待可视化数据实时更新显示的圆环,圆环能实时反映当前的数据。在实际应用中,每次待可视化数据发生变化时,都会触发电子设备自动渲染成为新的比例的圆环。另外,同一圆环上的不同圆弧表征类型相同状态不同的数据,能体现数据之间的关联性。
在一些实施例中,电子设备除了显示上述第一圆环之外,还显示一个目标图形,上述目标图形内部具有描述信息,上述描述信息用于描述上述第一圆环中任一圆弧表示的内容。示例性的,上述第一圆环显示于上述目标图形的四周,上述目标图形为表征光晕星球的圆形。在一些实施例中,上述第一圆环显示在一个表征光晕星球的圆形(对应于目标图形)的四周,上述圆形的内部显示有描述信息。图3为本申请实施例提供的另一种可视化界面的对比示意图。图3中,304和308均表征发光圆球(即光晕星球),301至303分别表示一个圆环,305至307分别表示一个圆环,发光圆球304内部显示的信息为发光圆球304在各圆环均未被选中时显示的描述信息,发光圆球308内部显示的信息为发光圆球308在第一圆环(例如圆环306)上的第一圆弧被选中时显示的描述信息(即第一描述信息),该第一描述信息用于描述第一圆弧表示的内容。当鼠标移动至某段圆环或者某段圆环被点击时,该圆弧被选中。举例来说,图3左半图为电子设备当前显示的画面,其中,当前显示的各圆环(即圆环301至圆环303)均未被选中,发光圆球304内部显示的信息为用于描述可视化模型的信息,例如运行天数;图3的右半图为鼠标移动至圆环302上的某一段圆弧或者通过鼠标点击圆环302上的某一段圆弧之后,显示的画面,其中,发光圆球308内部显示的信息为用于描述圆环306(对应于圆环302)上被选中的一段圆弧的信息。通过将至少一个圆环显示在发光圆球的周围,并在该发光圆球的内部显示相应的描述信息,使得用户更直接的感受数据的变化以及各圆环表征的数据。
本申请实施例中,用户通过圆环的变化可以直观的感受数据的变化,并且能够较好的展示数据之间的关联性。
图1描述的是如何根据当前获得的待可视化数据,更新当前显示的圆环的方法流程。下面来描述如何生成并显示原始的圆环。
可选的,电子设备在执行步骤101之前,可执行如下操作:根据第二待可视化数据,生成M个圆环(对应于原始的圆环);上述M个圆环中每个圆环对应一种类型的数据,上述M个圆环包括上述第二圆环,上述M为大于1的整数;将上述M个圆环(对应于图2左半图中的圆环)渲染到当前显示的画面中。上述第二待可视化数据可以理解为启动数据可视化显示任务之后,最先被显示的待可视化数据。在一些实施例中,启动数据可视化显示任务之后,根据第二待可视化数据,生成M个圆环;通过进场动画(例如各圆环的旋转速度由快变慢)显示上述M个圆环。进场动画播放完毕之后,各圆环的旋转速度不再改变。可选的,电子设备在将上述M个圆环渲染到当前显示的画面中的同时,可使用CSS3 animate对圆环的转动参数做调整(即动画渲染),对不同的圆环的旋转速率进行差速调整,以达到不同圆环不同速率的效果。后续电子设备可根据实时待可视化数据来更新显示的画面,以便于用户理解通过显示的圆环和圆弧了解实时数据。
前述实施例描述了如何显示圆环以及根据更新后的数据更新显示的圆环的方式。下面介绍用户如何与圆环进行交互以了解所需数据的方式。
示例性的,电子设备在执行步骤201之后,可实现如下操作:在接收到第一选择指令之后,显示第一圆弧对应的数据;上述第一选择指令用于选择上述第一圆环中的上述第一圆弧,上述第一圆弧为上述N段圆弧中的任一个。在一些实施例中,接收到第一选择指令可以是接收到用户通过输入设备(例如鼠标)针对上述第一圆弧的点击操作;还可以是将鼠标移动至上述第一圆弧的操作;还可以是其他选择上述第一圆弧的操作,本申请实施例不作限定。上述显示第一圆弧对应的数据可以是在表征光晕星球的圆形的内部显示第一圆弧对应的数据的描述信息和/或上述第一圆弧对应的数据;也可以是在表征光晕星球的圆形的内部显示第一圆弧对应的数据的描述信息,并且在画面中的其他位置显示第一圆弧对应的数据。举例来说,每个圆环反映一个区域(省级区域、市级区域、县级区域)的某种传染病的疫情数据,疫情数据分为确诊人数、疑似病例数、死亡人数以及治愈人数(即对应4种状态),其中,每个圆环中的圆弧分别反映确诊人数、疑似病例数、死亡人数以及治愈人数中的一种;如果用户点击或者将鼠标移动至表征某个区域的疑似病例的圆弧上,那么在表征光晕星球的圆形的内部显示疑似病例以及疑似病例数,并在其他位置显示该区域的名称。例如某个区域的确诊人数、疑似病例、死亡人数均不为零,治愈人数为0,反映该区域的疫情的圆环包括3个圆弧,分别反映确诊人数、疑似病例、死亡人数。又例如某个区域的确诊人数、死亡人数以及治愈人数均为零,疑似病例不为0,反映该区域的疫情的圆环包括1个圆弧(即圆环),该圆环反映疑似病例。
可选的,在接收到第一选择指令之后,上述方法还包括:通过高亮方式显示上述第一圆弧;其中,上述第一圆环的宽度增大。通过高亮方式显示上述第一圆弧可以是:上述第一圆环的亮度增高,上述第一圆环中除上述第一圆弧之外的圆弧的亮度均降低或者保持不变,以便于上述第一圆环中除上述第一圆弧之外的圆弧的亮度均低于上述第一圆弧的亮度。可选的,通过高亮方式显示上述第一圆弧的同时,同比例增大上述第一圆环中的各圆弧。也就是说,通过高亮方式显示的上述第一圆弧的宽度大于非高亮方式显示的上述第一圆弧的宽度。图4为本申请实施例提供的又一种可视化界面的对比示意图。图4中,44和48均表征发光圆球(即光晕星球),圆环41至圆弧43依次表征第一类型至第三类型的数据,圆环45至圆弧47依次表征第一类型至第三类型的数据,圆环421至圆弧423表征3种类型(对应于圆环42)相同状态不同的数据(例如同一区域的确诊人数、疑似病例以及死亡人数),圆弧424(对应于第一圆弧)至圆弧426依次对应高亮方式显示的圆环421至圆弧423,其中,圆环424的亮度高于圆环421的亮度,圆弧424(对应于第一圆弧)至圆弧426的宽度大于圆环421至圆弧423的宽度。举例来说,电子设备当前显示的画面为图4中的左半图,当用户点击或者将鼠标移动至圆弧421时,显示图4中的右半图;其中,圆环421可视为第一圆弧。对比图4的左半图和右半图可知,当某段圆弧被选中之后,通过高亮方式显示该段圆弧,以便于用户更直观清晰地看到选中的圆环所表征的数据。
本申请实施例中,用户可以使用鼠标点击和移动到对应的圆弧上操作圆环,来达到切换数据等目的,交互性强、操作简单。
图5为本申请实施例提供的另一种数据显示方法流程图。图5中的方法流程是对图1中的方法流程的进一步细化和完善。如图5所示,该方法可包括:
501、服务端(对应于后台服务器)实时或者周期性采集数据,并汇总得到二待可视化数据。
502、服务端将第二待可视化数据发送给电子设备(对应于前端)。
503、电子设备根据第二待可视化数据,生成M个圆环。
上述M个圆环中每个圆环对应一种类型的数据,上述M个圆环包括第二圆环,上述M为大于1的整数。可选的,上述M个圆环的大小不同。
504、电子设备将上述M个圆环渲染到当前显示的画面中。
电子设备将上述M个圆环渲染到当前显示的画面中可以是通过进场动画(例如各圆环的旋转速度由快变慢)显示上述M个圆环。进场动画播放完毕之后,各圆环的旋转速度不再改变。可选的,电子设备在将上述M个圆环渲染到当前显示的画面中的同时,可使用CSS3 animate对圆环的转动参数做调整(即动画渲染),对不同的圆环的旋转速率进行差速调整,以达到不同圆环不同速率的效果。可选的,上述M个圆环均分布在一个表征光晕星球的圆球的四周,且上述M个圆环中任意两个圆环不重叠。可选的,上述M个圆环中各圆环的旋转速度不同。上述M个圆环均以旋转方式显示,并且上述M个圆环中任意两个圆环的旋转速度不同。
505、服务端将对采集的数据汇总得到的第一待可视化数据发送给电子设备(对应于前端)。
506、电子设备根据第一待可视化数据,生成第一圆环。
上述第一待可视化数据包括第一类型的数据,上述第一类型的数据包括N种状态的数据;上述第一圆环包括N段圆弧,每段圆弧对应上述第一类型的一种状态的数据,上述N为大于0的整数。可选的,上述N段圆弧中的第二圆弧的长度与上述第二圆弧对应的数据在总数据中的占比正相关,上述总数据为上述第一待可视化数据中的上述第一类型的数据,上述第二圆弧为上述N段圆弧中的任一个。
步骤506的实现方式可与步骤101的实现方式相同。示例性的,根据第一待可视化数据,生成M个圆环(包括第一圆环)。
507、电子设备将当前显示的第二圆环更新为上述第一圆环。
步骤507的实现方式可与步骤102的实现方式相同。示例性的,电子设备利用根据第一待可视化数据生成的多个圆环,替换根据第二待可视化数据生成的多个圆环。应理解,当服务器(即后端)传递的数据或者外界有数据变化,都会触发电子设备生成新的圆环,并显示。也就是说,电子设备显示的圆环可以是根据最近得到的待可视化数据生成的,即显示的圆环可以是实时更新的。
508、在接收到第一选择指令之后,显示第一圆弧对应的数据,并通过高亮方式显示上述第一圆弧。
上述第一选择指令用于选择上述第一圆环中的上述第一圆弧,上述第一圆弧为上述N段圆弧中的任一个。可选的,在通过高亮方式显示上述第一圆弧时,上述第一圆环的宽度增大。可选的,第一圆环中的任一段圆弧被选中时,被选中的一段圆弧的亮度增高,该第一圆环的大小不变且宽度变大,除该第一圆环之外的至少一个圆环的宽度变小。
509、在检测到上述第一圆弧未被选中之后,通过非高亮方式显示上述第一圆弧。
示例性的,检测到上述第一圆弧未被选中可以是检测到其他圆弧被选中或者检测到鼠标从上述第一圆环上离开。通过非高亮方式显示上述第一圆弧可以是上述第一圆环的亮度降低,并且上述第一圆环的宽度减小。
本申请实施例中,用户通过圆环的变化可以直观的感受数据的变化,用户通过这种圆环交互可以清晰明了的知道每一份数据在系统中扮演的角色,以便于用户可以根据这些数据做出实际判断,交互性强。
图6为本申请实施例提供的一种电子设备的结构示意图。如图6所示,该电子设备包括:
生成单元601,用于根据第一待可视化数据,生成第一圆环;上述第一待可视化数据包括第一类型的数据,上述第一类型的数据包括N种状态的数据;上述第一圆环包括N段圆弧,每段圆弧对应上述第一类型的一种状态的数据,上述N为大于0的整数;
显示单元602,用于显示上述第一圆环。
在一个可选的实现方式中,显示单元602,具体用于将当前显示的第二圆环更新为上述第一圆环;上述第二圆环为在得到上述第一待可视化数据之前,根据上述第一类型的数据生成的圆环。
在一个可选的实现方式中,显示单元602,还用于显示一个目标图形,上述目标图形内部具有描述信息,上述描述信息用于描述当前显示的内容。
在一个可选的实现方式中,上述第一圆环显示于上述目标图形的四周,上述目标图形为表征光晕星球的圆形。
在一个可选的实现方式中,上述第一圆环显示在一个表征光晕星球的圆形的四周,上述圆形的内部显示有描述信息。
在一个可选的实现方式中,上述电子设备还包括:
接收单元603,用于接收第一选择指令;上述第一选择指令用于选择上述第一圆环中的上述第一圆弧,上述第一圆弧为上述N段圆弧中的任一个;
显示单元602,还用于显示第一圆弧对应的数据。
在一个可选的实现方式中,显示单元602,具体用于通过高亮方式显示上述第一圆弧。
在一个可选的实现方式中,显示单元602,具体用于通过高亮方式显示上述第一圆环的同时,增大上述第一圆环的宽度。
在一个可选的实现方式中,上述N段圆弧中的第二圆弧的长度与上述第二圆弧对应的数据在总数据中的占比正相关,上述总数据为上述第一待可视化数据中的上述第一类型的数据,上述第二圆弧为上述N段圆弧中的任一个。
在一个可选的实现方式中,上述N段圆弧中任意两段圆弧的颜色不同。
在一个可选的实现方式中,显示单元602,具体用于将上述第二圆环渲染到当前显示的画面中;上述画面包括至少一个圆环,每个圆环对应一种类型的数据。
在一个可选的实现方式中,上述至少一个圆环以旋转方式显示,并且上述至少一个圆环中任意两个圆环的旋转速度不同。
在一个可选的实现方式中,生成单元601,还用于根据第二待可视化数据,生成M个圆环;上述M个圆环中每个圆环对应一种类型的数据,上述M个圆环包括上述第二圆环,上述M为大于1的整数;
显示单元602,还用于将上述M个圆环渲染到当前显示的画面中。
应理解以上电子设备的各个单元的划分仅仅是一种逻辑功能的划分,实际实现时可以全部或部分集成到一个物理实体上,也可以物理上分开。例如,以上各个单元可以为单独设立的处理元件,也可以集成同一个芯片中实现,此外,也可以以程序代码的形式存储于控制器的存储元件中,由处理器的某一个处理元件调用并执行以上各个单元的功能。此外各个单元可以集成在一起,也可以独立实现。这里的处理元件可以是一种集成电路芯片,具有信号的处理能力。在实现过程中,上述方法的各步骤或以上各个单元可以通过处理器元件中的硬件的集成逻辑电路或者软件形式的指令完成。该处理元件可以是通用处理器,例如中央处理器(英文:central processing unit,简称:CPU),还可以是被配置成实施以上方法的一个或多个集成电路,例如:一个或多个特定集成电路(英文:application-specific integrated circuit,简称:ASIC),或,一个或多个微处理器(英文:digitalsignal processor,简称:DSP),或,一个或者多个现场可编程门阵列(英文:field-programmable gate array,简称:FPGA)等。
图7为本申请实施例提供的一种电子设备的结构示意图。如图7所示,该电子设备70包括处理器701、存储器702、通信接口703以及显示装置704;该处理器701、存储器702、通信接口703以及显示装置704通过总线相互连接。
存储器702包括但不限于是随机存储记忆体(random access memory,RAM)、只读存储器(read-only memory,ROM)、可擦除可编程只读存储器(erasable programmablereadonly memory,EPROM)、或便携式只读存储器(compact disc read-only memory,CDROM),该存储器1002用于相关指令及数据。通信接口1003用于接收和发送数据。
处理器701可以是一个或多个中央处理器(central processing unit,CPU),在处理器701是一个CPU的情况下,该CPU可以是单核CPU,也可以是多核CPU。上述实施例中由电子设备所执行的步骤可以基于该图7所示的电子设备的结构。具体的,处理器1001可实现图6中生成单元的功能。通信接口703可实现图6中接收单元603的功能。显示装置704可以是显示屏,可实现图6中显示单元602的功能。
该电子设备70中的处理器701用于读取该存储器702中存储的程序代码,执行前述实施例中的数据显示方法。
图8是本申请实施例提供的一种服务器的结构示意图,该服务器800可因配置或性能不同而产生比较大的差异,可以包括一个或一个以上中央处理器(central processingunits,CPU)822(例如,一个或一个以上处理器)和存储器832,一个或一个以上存储应用程序842或数据844的存储介质830(例如一个或一个以上海量存储设备)。其中,存储器832和存储介质830可以是短暂存储或持久存储。存储在存储介质830的程序可以包括一个或一个以上模块(图示没标出),每个模块可以包括对服务器中的一系列指令操作。更进一步地,中央处理器822可以设置为与存储介质830通信,在服务器800上执行存储介质830中的一系列指令操作。服务器800可以为本申请提供的电子设备。
服务器800还可以包括一个或一个以上电源826,一个或一个以上有线或无线网络接口850,一个或一个以上输入输出接口858,和/或,一个或一个以上操作系统841,例如Windows ServerTM,Mac OS XTM,UnixTM,LinuxTM,FreeBSDTM等等。
上述实施例中由服务端所执行的步骤可以基于该图8所示的服务器结构。
在本申请的实施例中提供一种计算机可读存储介质,上述计算机可读存储介质存储有计算机程序,上述计算机程序被处理器执行时实现:根据第一待可视化数据,生成第一圆环;上述第一待可视化数据包括第一类型的数据,上述第一类型的数据包括N种状态的数据;上述第一圆环包括N段圆弧,每段圆弧对应上述第一类型的一种状态的数据,上述N为大于0的整数;将当前显示的第二圆环更新为上述第一圆环;上述第二圆环为在得到上述第一待可视化数据之前,根据上述第一类型的数据生成的圆环。
本申请实施例提供了一种包含指令的计算机程序产品,当其在计算机上运行时,使得计算机执行前述实施例所提供的数据显示方法。
以上所述,仅为本申请的具体实施方式,但本申请的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本申请揭露的技术范围内,可轻易想到各种等效的修改或替换,这些修改或替换都应涵盖在本申请的保护范围之内。因此,本申请的保护范围应以权利要求的保护范围为准。
Claims (15)
1.一种数据显示方法,其特征在于,包括:
根据第一待可视化数据,生成第一圆环;所述第一待可视化数据包括第一类型的第一数据,所述第一类型的数据包括N种状态的数据;所述第一圆环包括N段圆弧,所述N段圆弧中每段圆弧对应所述第一类型的一种状态的数据,所述N为大于0的整数;
显示所述第一圆环。
2.根据权利要求1所述的方法,其特征在于,所述显示所述第一圆环包括:
将当前显示的第二圆环更新为所述第一圆环;所述第二圆环为在得到所述第一待可视化数据之前,根据所述第一类型的第二数据生成的圆环。
3.根据权利要求1或2所述的方法,其特征在于,所述方法还包括:
显示一个目标图形,所述目标图形内部具有描述信息,所述描述信息用于描述所述第一圆环中任一圆弧表示的内容。
4.根据权利要求3所述的方法,其特征在于,所述第一圆环显示于所述目标图形的四周,所述目标图形为表征光晕星球的圆形。
5.根据权利要求2至4任一项所述的方法,其特征在于,所述将当前显示的第二圆环更新为所述第一圆环之后,所述方法还包括:
在接收到第一选择指令之后,显示第一圆弧对应的数据;所述第一选择指令用于选择所述第一圆环中的所述第一圆弧,所述第一圆弧为所述N段圆弧中的任一个。
6.根据权利要求5所述的方法,其特征在于,在接收到第一选择指令之后,所述方法还包括:
通过高亮方式显示所述第一圆弧。
7.根据权利要求6所述的方法,其特征在于,所述通过高亮方式显示所述第一圆弧包括:
通过高亮方式显示所述第一圆环的同时,增大所述第一圆环的宽度。
8.根据权利要求1至7任一项所述的方法,其特征在于,所述N段圆弧中的第二圆弧的长度与所述第二圆弧对应的数据在总数据中的占比正相关,所述总数据为所述第一待可视化数据中的所述第一类型的数据,所述第二圆弧为所述N段圆弧中的任一个。
9.根据权利要求8所述的方法,其特征在于,所述N段圆弧中任意两段圆弧的颜色不同。
10.根据权利要求2至9任一项所述的方法,其特征在于,所述将当前显示的第二圆环更新为所述第一圆环包括:
将所述第二圆环渲染到当前显示的画面中;所述画面包括至少一个圆环,所述至少一个圆环中每个圆环对应一种类型的数据。
11.根据权利要求10所述的方法,其特征在于,所述至少一个圆环以旋转方式显示,并且所述至少一个圆环中任意两个圆环的旋转速度不同。
12.根据权利要求1至11任一项所述的方法,其特征在于,所述根据第一待可视化数据,生成第一圆环之前,所述方法还包括:
根据第二待可视化数据,生成M个圆环;所述M个圆环中每个圆环对应一种类型的数据,所述M个圆环包括所述第二圆环,所述M为大于1的整数,所述第二待可视化数据包括至少一种类型的数据;
将所述M个圆环渲染到当前显示的画面中。
13.一种电子设备,其特征在于,包括:
生成单元,用于根据第一待可视化数据,生成第一圆环;所述第一待可视化数据包括第一类型的数据,所述第一类型的数据包括N种状态的数据;所述第一圆环包括N段圆弧,每段圆弧对应所述第一类型的一种状态的数据,所述N为大于0的整数;
显示单元,用于显示所述第一圆环。
14.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中存储有计算机程序,所述计算机程序包括程序指令,所述程序指令当被处理器执行时,使所述处理器执行权利要求1至12任意一项所述的方法。
15.一种电子设备,其特征在于,包括:存储器,用于存储程序;处理器,用于执行所述存储器存储的所述程序,当所述程序被执行时,所述处理器用于执行如权利要求1至12中任一项所述的方法。
Priority Applications (5)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010335227.7A CN111597249A (zh) | 2020-04-24 | 2020-04-24 | 数据显示方法和相关装置 |
JP2021557459A JP2022533887A (ja) | 2020-04-24 | 2020-08-24 | データ表示方法及び関連装置 |
PCT/CN2020/110876 WO2021212711A1 (zh) | 2020-04-24 | 2020-08-24 | 数据显示方法和相关装置 |
KR1020217031284A KR20210134940A (ko) | 2020-04-24 | 2020-08-24 | 데이터 디스플레이 방법 및 관련 장치 |
TW109131395A TWI785380B (zh) | 2020-04-24 | 2020-09-11 | 資料顯示方法、電腦可讀儲存介質、電子設備和晶片 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202010335227.7A CN111597249A (zh) | 2020-04-24 | 2020-04-24 | 数据显示方法和相关装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN111597249A true CN111597249A (zh) | 2020-08-28 |
Family
ID=72187651
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202010335227.7A Pending CN111597249A (zh) | 2020-04-24 | 2020-04-24 | 数据显示方法和相关装置 |
Country Status (5)
Country | Link |
---|---|
JP (1) | JP2022533887A (zh) |
KR (1) | KR20210134940A (zh) |
CN (1) | CN111597249A (zh) |
TW (1) | TWI785380B (zh) |
WO (1) | WO2021212711A1 (zh) |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101470711A (zh) * | 2007-12-25 | 2009-07-01 | 国际商业机器公司 | 层次化图结构数据可视化的方法、装置 |
US20100162152A1 (en) * | 2008-12-18 | 2010-06-24 | Microsoft Corporation | Data Visualization Interactivity Architecture |
CN107016617A (zh) * | 2016-01-28 | 2017-08-04 | 北京工商大学 | 一种基于多重放射环的农产品农残检测数据的可视化方法 |
CN107067427A (zh) * | 2017-05-18 | 2017-08-18 | 北京工商大学 | 一种针对农残检测数据的极坐标布局可视化方法 |
CN107798483A (zh) * | 2017-11-16 | 2018-03-13 | 顺丰科技有限公司 | 一种收派任务管理方法 |
Family Cites Families (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
JP2007116249A (ja) * | 2005-10-18 | 2007-05-10 | System Solution株式会社 | 画像記録装置 |
US8810574B2 (en) * | 2009-04-02 | 2014-08-19 | Mellmo Inc. | Displaying pie charts in a limited display area |
US9773288B2 (en) * | 2009-11-17 | 2017-09-26 | Endera Systems, Llc | Radial data visualization system |
CN103049580B (zh) * | 2013-01-17 | 2016-02-10 | 北京工商大学 | 一种层次数据的可视化方法和设备 |
US9921732B2 (en) * | 2013-07-31 | 2018-03-20 | Splunk Inc. | Radial graphs for visualizing data in real-time |
CN104951446A (zh) * | 2014-03-25 | 2015-09-30 | 阿里巴巴集团控股有限公司 | 大数据处理方法及平台 |
US20150356160A1 (en) * | 2014-06-05 | 2015-12-10 | Deutsche Bank Ag | System and method for facilitating interactive data visualization and manipulation |
CN105243070B (zh) * | 2014-07-11 | 2020-02-14 | 华为技术有限公司 | 数据的可视化方法和装置 |
CN206594274U (zh) * | 2016-09-08 | 2017-10-27 | 小牛动力(武汉)新能源技术有限公司 | 一种具有电池状态指示的btu装置 |
-
2020
- 2020-04-24 CN CN202010335227.7A patent/CN111597249A/zh active Pending
- 2020-08-24 JP JP2021557459A patent/JP2022533887A/ja active Pending
- 2020-08-24 KR KR1020217031284A patent/KR20210134940A/ko active Search and Examination
- 2020-08-24 WO PCT/CN2020/110876 patent/WO2021212711A1/zh active Application Filing
- 2020-09-11 TW TW109131395A patent/TWI785380B/zh active
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101470711A (zh) * | 2007-12-25 | 2009-07-01 | 国际商业机器公司 | 层次化图结构数据可视化的方法、装置 |
US20100162152A1 (en) * | 2008-12-18 | 2010-06-24 | Microsoft Corporation | Data Visualization Interactivity Architecture |
CN107016617A (zh) * | 2016-01-28 | 2017-08-04 | 北京工商大学 | 一种基于多重放射环的农产品农残检测数据的可视化方法 |
CN107067427A (zh) * | 2017-05-18 | 2017-08-18 | 北京工商大学 | 一种针对农残检测数据的极坐标布局可视化方法 |
CN107798483A (zh) * | 2017-11-16 | 2018-03-13 | 顺丰科技有限公司 | 一种收派任务管理方法 |
Also Published As
Publication number | Publication date |
---|---|
WO2021212711A1 (zh) | 2021-10-28 |
KR20210134940A (ko) | 2021-11-11 |
TW202141256A (zh) | 2021-11-01 |
JP2022533887A (ja) | 2022-07-27 |
TWI785380B (zh) | 2022-12-01 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US8510680B2 (en) | Three-dimensional motion graphic user interface and method and apparatus for providing the same | |
RU2393525C2 (ru) | Усовершенствованные средства навигации на основе клавиш | |
US8610714B2 (en) | Systems, methods, and computer-readable media for manipulating graphical objects | |
US9552129B2 (en) | Interactive visual representation of points of interest data | |
WO2022048506A1 (zh) | 壁纸显示方法、装置和电子设备 | |
US20150309678A1 (en) | Methods and apparatus for rendering a collection of widgets on a mobile device display | |
US9411482B2 (en) | Visualizing user interfaces | |
JP2005316955A (ja) | ポータブル装置用の高度なナビゲーション技術 | |
CN109939440A (zh) | 三维游戏地图的生成方法、装置、处理器及终端 | |
US20140359508A1 (en) | Graphical user interface with dial control for a parameter | |
CN107426272A (zh) | 一种小程序推送方法、装置及计算机存储介质 | |
US20030132944A1 (en) | User control of generalized semantic zooming | |
CN105549847B (zh) | 一种歌曲播放界面的图片显示方法及用户终端 | |
US9489759B1 (en) | File path translation for animation variables in an animation system | |
CN112965780B (zh) | 图像显示方法、装置、设备及介质 | |
US20230400955A1 (en) | Systems and Methods for Interacting with Three-Dimensional Graphical User Interface Elements to Control Computer Operation | |
CN111597249A (zh) | 数据显示方法和相关装置 | |
CN111325348A (zh) | 一种量子线路的显示方法、装置、存储介质和电子装置 | |
CN115129224B (zh) | 移动控制的方法、装置、存储介质及电子设备 | |
US20240100429A1 (en) | Method for display control in game, computer-readable storage medium, and electronic device | |
CN113723411B (zh) | 一种用于遥感图像语义分割的特征提取方法和分割系统 | |
CN114625472A (zh) | 一种页面展示方法、装置、电子设备及存储介质 | |
CN113688345A (zh) | 一种页面切换方法、装置及计算设备 | |
CN113360154A (zh) | 一种页面构建方法、装置、设备和可读介质 | |
CN114153363B (zh) | 地图的显示控制方法、装置和电子设备 |
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 | ||
REG | Reference to a national code |
Ref country code: HK Ref legal event code: DE Ref document number: 40026879 Country of ref document: HK |
|
RJ01 | Rejection of invention patent application after publication | ||
RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200828 |