TWI785380B

TWI785380B - 資料顯示方法、電腦可讀儲存介質、電子設備和晶片

Info

Publication number: TWI785380B
Application number: TW109131395A
Authority: TW
Inventors: 李冠亮; 郭枳彤; 李蔚琳
Original assignee: 大陸商深圳市商湯科技有限公司
Priority date: 2020-04-24
Filing date: 2020-09-11
Publication date: 2022-12-01
Also published as: WO2021212711A1; KR20210134940A; TW202141256A; JP2022533887A; CN111597249A

Abstract

本發明實施例公開了一種資料顯示方法、電腦可讀儲存介質、電子設備和晶片，該方法包括：根據第一待視覺化資料，生成第一圓環；所述第一待視覺化資料包括第一類型的資料，所述第一類型的資料包括N種狀態的資料；所述第一圓環包括N段圓弧，所述N段圓弧中每段圓弧對應所述第一類型的一種狀態的資料，所述N為大於0的整數；顯示所述第一圓環。

Description

資料顯示方法、電腦可讀儲存介質、電子設備和晶片

本發明關於資料視覺化領域，尤其關於一種資料顯示方法、電腦可讀儲存介質、電子設備和晶片。

大資料與人們生活息息相關，全球資料呈現爆發增長、海量集聚的特點。從國家到個人越來越意識到資料的重要性。因此，對於大資料的視覺化操作以及視覺化呈現，尤為重要。視覺化是指將相對抽象的數位等內容轉化為直觀的圖形、圖像等呈現出來，便於閱讀者和研究者觀察、模擬、分析。以視覺化為基礎，近年來，地形視覺化、大資料視覺化、語音視覺化等技術在相應領域蓬勃發展。因此，需要研究能夠展示資料之間的關聯性且資料模型簡單的資料顯示方案。

本發明實施例公開了一種資料顯示方法、電腦可讀儲存介質、電子設備和晶片，能夠展示資料之間的關聯性，並且資料模型簡單。

第一方面，本發明實施例提供了一種資料顯示方法，該方法包括：根據第一待視覺化資料，生成第一圓環；所述第一待視覺化資料包括第一類型的資料，所述第一類型的資料包括N種狀態的資料；所述第一圓環包括N段圓弧，所述N段圓弧中每段圓弧對應所述第一類型的一種狀態的資料，所述N為大於0的整數；顯示所述第一圓環。

本發明實施例中，用戶通過圓環的變化可以直觀的感受資料的變化，並且能夠較好的展示資料之間的關聯性。

在一個可選的實現方式中，所述顯示所述第一圓環包括：將當前顯示的第二圓環更新為所述第一圓環；所述第二圓環為在得到所述第一待視覺化資料之前，根據所述第一類型的第二資料生成的圓環。

在一個可選的實現方式中，所述方法還包括：顯示一個目標圖形，所述目標圖形內部具有描述資訊，所述描述資訊用於描述所述第一圓環中任一圓弧表示的內容。

在一個可選的實現方式中，所述第一圓環顯示於所述目標圖形的四周，所述目標圖形為表徵光暈星球的圓形。

本發明實施例中，將至少一個圓環顯示在發光圓球的周圍，並在該發光圓球的內部顯示相應的描述資訊，以便於使用者更直接的感受資料的變化以及各圓環表徵的資料。

在一個可選的實現方式中，所述顯示所述第一圓環之後，所述方法還包括：在接收到第一選擇指令之後，顯示第一圓弧對應的資料；所述第一選擇指令用於選擇所述第一圓環中的所述第一圓弧，所述第一圓弧為所述N段圓弧中的任一個。

本發明實施例中，用戶通過這種圓環交互可以清晰明瞭的知道每一份資料在系統中扮演的角色，以便於使用者可以根據這些資料做出實際判斷，交互性強。

在一個可選的實現方式中，在接收到第一選擇指令之後，所述方法還包括：通過高亮方式顯示所述第一圓弧。

本發明實施例中，通過高亮方式顯示第一圓環，以便於更直觀清楚地顯示使用者所關注的資料。

在一個可選的實現方式中，所述通過高亮方式顯示所述第一圓弧包括：通過高亮方式顯示所述第一圓環的同時，增大所述第一圓環的寬度。

在一個可選的實現方式中，所述N段圓弧中的第二圓弧的長度與所述第二圓弧對應的資料在總資料中的占比正相關，所述總資料為所述第一待視覺化資料中的所述第一類型的資料，所述第二圓弧為所述N段圓弧中的任一個。

本發明實施例中，每個圓弧的長度能反映該圓弧對應的那種狀態的資料在總資料中的占比，這樣用於就能根據圓環的實際弧長以及其他輔助性的資料顯示來做簡單迅速的資料判斷。

在一個可選的實現方式中，所述N段圓弧中任意兩段圓弧的顏色不同。

在一個可選的實現方式中，所述將當前顯示的第二圓環更新為所述第一圓環包括：將所述第二圓環渲染到當前顯示的畫面中；所述畫面包括至少一個圓環，每個圓環對應一種類型的資料。

在一個可選的實現方式中，所述至少一個圓環以旋轉方式顯示，並且所述至少一個圓環中任意兩個圓環的旋轉速度不同。

在一個可選的實現方式中，所述根據第一待視覺化資料，生成第一圓環之前，所述方法還包括：根據第二待視覺化資料，生成M個圓環；所述M個圓環中每個圓環對應一種類型的資料，所述M個圓環包括所述第二圓環，所述M為大於1的整數，所述第二待視覺化資料包括至少一種類型的資料；將所述M個圓環渲染到當前顯示的畫面中。

本發明實施例中，每個圓環可反映一種類型的資料，視覺化模型簡單，使得使用者可直觀的看到資料的分佈，有助於使用者理解系統即時運行以及運營情況。

第二方面，本發明實施例提供了一種電子設備，包括：生成單元，配置為根據第一待視覺化資料，生成第一圓環；所述第一待視覺化資料包括第一類型的資料，所述第一類型的資料包括N種狀態的資料；所述第一圓環包括N段圓弧，所述N段圓弧中每段圓弧對應所述第一類型的一種狀態的資料，所述N為大於0的整數；顯示單元，配置為顯示所述第一圓環。

在一個可選的實現方式中，所述顯示單元，配置為將當前顯示的第二圓環更新為所述第一圓環；所述第二圓環為在得到所述第一待視覺化資料之前，根據所述第一類型的資料生成的圓環。

在一個可選的實現方式中，所述顯示單元，還配置為顯示一個目標圖形，所述目標圖形內部具有描述資訊，所述描述資訊用於描述所述第一圓環中任一圓弧表示的內容。

在一個可選的實現方式中，所述第一圓環顯示在一個表徵光暈星球的圓形的四周，所述圓形的內部顯示有描述資訊。

在一個可選的實現方式中，所述電子設備還包括：接收單元，配置為接收第一選擇指令；所述第一選擇指令用於選擇所述第一圓環中的所述第一圓弧，所述第一圓弧為所述N段圓弧中的任一個；所述顯示單元，還配置為顯示所述第一圓弧對應的資料。

在一個可選的實現方式中，所述顯示單元，配置為通過高亮方式顯示所述第一圓弧。

在一個可選的實現方式中，所述顯示單元，配置為通過高亮方式顯示所述第一圓環的同時，增大所述第一圓環的寬度。

在一個可選的實現方式中，所述顯示單元，配置為將所述第二圓環渲染到當前顯示的畫面中；所述畫面包括至少一個圓環，所述至少一個圓環中每個圓環對應一種類型的資料。

在一個可選的實現方式中，所述生成單元，還配置為根據第二待視覺化資料，生成M個圓環；所述M個圓環中每個圓環對應一種類型的資料，所述M個圓環包括所述第二圓環，所述M為大於1的整數，所述第二待視覺化資料包括至少一種類型的資料；所述顯示單元，還配置為將所述M個圓環渲染到當前顯示的畫面中。

第三方面，本發明實施例提供了一種電子設備，該電子設備包括：記憶體，用於儲存程式；處理器，用於執行所述記憶體儲存的所述程式，當所述程式被執行時，所述處理器用於執行如上述第一方面以及任一種可選的實現方式的方法。

第四方面，本發明實施例提供了一種晶片，該晶片包括處理器與資料介面，該處理器通過該資料介面讀取記憶體上儲存的指令，執行如上述第一方面以及任一種可選的實現方式的方法。

第五方面，本發明實施例提供了一種電腦可讀儲存介質，該電腦儲存介質儲存有電腦程式，該電腦程式包括程式指令，該程式指令當被處理器執行時使該處理器執行上述第一方面及任一種可選的實現方式的方法。

第六方面，本發明實施例提供了一種電腦程式產品，該電腦程式產品包括程式指令，所述程式指令當被處理器執行時使所述處理器執行上述第一方面以及任一種可選的實現方式的方法。

本發明的說明書實施例和申請專利範圍及上述附圖中的術語“第一”、“第二”、和“第三”等是用於區別類似的物件，而不必用於描述特定的順序或先後次序。此外，術語“包括”和“具有”以及他們的任何變形，意圖在於覆蓋不排他的包含，例如，包含了一系列步驟或單元。方法、系統、產品或設備不必限於清楚地列出的那些步驟或單元，而是可包括沒有清楚地列出的或對於這些過程、方法、產品或設備固有的其它步驟或單元。

本發明實施例提供一種資料顯示方法、電腦可讀儲存介質、電子設備和晶片，能夠展示資料之間的關聯性，並且資料模型簡單。本發明實施例提供的資料顯示方法（即資料視覺化方法）適用於資料視覺化場景中，使得使用者可以直觀的感受資料的變化，並且通過與視覺化資料交互可以清晰明瞭的知道每一份資料在系統中扮演的角色。

圖1為本發明實施例提供的一種資料顯示方法流程圖。如圖1所示，該方法可包括如下。

101、電子設備根據第一待視覺化資料，生成第一圓環。

上述第一待視覺化資料包括第一類型的資料，上述第一類型的資料包括N種不同狀態的資料；上述第一圓環包括N段圓弧，每段圓弧對應上述第一類型的一種狀態的資料，上述N為大於0的整數。本發明實施例的執行主體可以是臺式電腦、筆記型電腦、伺服器等電子設備。

可選的，電子設備根據第一待視覺化資料，生成第一圓環可以是：根據第一待視覺化資料包括的至少一種類型的資料以及每種類型的資料對應的狀態，換算圓環的大小以及圓環的弧；其中，每個圓環表徵一種類型的資料，同一個圓環中不同圓弧表徵不同狀態的資料。舉例來說，第一圓環包括3段圓弧，每段圓弧對應一種狀態的第一類型的資料。

示例性的，上述N段圓弧中的第二圓弧的長度與上述第二圓弧對應的資料在總資料中的占比正相關，上述總資料為上述第一待視覺化資料中的上述第一類型的資料，上述第二圓弧為上述N段圓弧中的任一個。

本實施例中，每一段圓弧的長取決於其對應的資料在總資料中的占比。例如，第二圓弧表徵的數值為100，總資料表征的數值為500，則該第二圓弧的弧長與第一圓環的長度的比值為20%，即第二圓弧的占比為20%。

在該實現方式中，每個圓弧的長度能反映該圓弧對應的那種狀態的資料在總資料中的占比，這樣用於就能根據圓環的實際弧長以及其他輔助性的資料顯示來做簡單迅速的資料判斷。

可選地，上述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。應理解，電子設備可根據即時獲得的待視覺化資料，生成相應的圓環，並顯示。也就是說，電子設備可根據獲取的待視覺化資料即時更新顯示的圓環，圓環能即時反映當前的資料。在實際應用中，每次待視覺化資料發生變化時，都會觸發電子設備自動渲染成為新的比例的圓環。另外，同一圓環上的不同圓弧表徵類型相同狀態不同的資料，能體現資料之間的關聯性。

則在一些實施例中，上述將當前顯示的第二圓環更新為上述第一圓環包括：將上述第二圓環渲染到當前顯示的畫面中；上述畫面包括至少一個圓環，所述至少一個圓環中每個圓環對應一種類型的資料。

示例性的，電子設備基於前端可縮放的向量圖形（Scalable Vector Graphics，SVG）以及畫布（Canvas）前端渲染技術動態渲染光環效果，即將所述第二圓環渲染到當前顯示的畫面中。

可選地，上述至少一個圓環以旋轉方式顯示，並且上述至少一個圓環中任意兩個圓環的旋轉速度不同。

示例性的，電子設備在做動畫渲染時使用層疊樣式表3級（Cascading Style Sheets Level 3，CSS3）animate工具對各圓環的轉動參數做調整,例如對不同的圓環的旋轉速率進行差速調整，以達到不同圓環不同速率的效果。另外，實現進場動畫由快到慢的變化以及旋轉動畫的控制。舉例來說，第一圓環每隔10秒旋轉360度。

在一些實施例中，電子設備除了顯示上述第一圓環之外，還顯示一個目標圖形，上述目標圖形內部具有描述資訊，上述描述資訊用於描述上述第一圓環中任一圓弧表示的內容。示例性的，上述第一圓環顯示於上述目標圖形的四周，上述目標圖形為表徵發光圓球（即光暈星球）的圓形。在一些實施例中，上述第一圓環顯示在一個表徵光暈星球的圓形（對應於目標圖形）的四周，上述圓形的內部顯示有描述資訊。電子設備當前顯示的內容可視為一個視覺化模型，該視覺化模型包括至少一個圓環。示例性的，在當前顯示的圓環均未被選中的情況下，顯示第一描述資訊，所述第一描述資訊用於描述視覺化模型的資訊；在所述第一圓環被選中的情況下，顯示第二描述資訊，所述第二描述資訊用於描述所述第一類型的資料。

圖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 對圓環的轉動參數做調整（即動畫渲染），對不同的圓環的旋轉速率進行差速調整，以達到不同圓環不同速率的效果。後續電子設備可根據即時待視覺化資料來更新顯示的畫面，以便於使用者理解通過顯示的圓環和圓弧瞭解即時資料。

前述實施例描述了如何顯示圓環以及根據更新後的資料更新顯示的圓環的方式。下面介紹用戶如何與圓環進行交互以瞭解所需資料的方式。

示例性的，電子設備在執行步驟102之後，可實現如下操作：在接收到第一選擇指令之後，顯示第一圓弧對應的資料；上述第一選擇指令用於選擇上述第一圓環中的上述第一圓弧，上述第一圓弧為上述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），或，一個或多個微處理器（Digital Signal 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 Programmable Read Only Memory，EPROM）、或可擕式唯讀記憶體（Compact Disc Read-Only Memory，CDROM），該記憶體1002用於相關指令及資料。通信介面1003用於接收和發送資料。

處理器701可以是一個或多個CPU，在處理器701是一個CPU的情況下，該CPU可以是單核CPU，也可以是多核CPU。上述實施例中由電子設備所執行的步驟可以基於該圖7所示的電子設備的結構。具體的，處理器1001可實現圖6中生成單元的功能。通信介面703可實現圖6中接收單元603的功能。顯示裝置704可以是顯示幕，可實現圖6中顯示單元602的功能。

該電子設備70中的處理器701用於讀取該記憶體702中儲存的程式碼，執行前述實施例中的資料顯示方法。

圖8是本發明實施例提供的一種伺服器的結構示意圖，該伺服器800可因配置或性能不同而產生比較大的差異，可以包括一個或一個以上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所示的伺服器結構。

在本發明的實施例中提供一種電腦可讀儲存介質，上述電腦可讀儲存介質儲存有電腦程式，上述電腦程式被處理器執行時實現前述實施例中的資料顯示方法。

本發明實施例提供了一種包含指令的電腦程式產品，當其在電腦上運行時，使得電腦執行前述實施例所提供的資料顯示方法。

以上所述，僅為本發明的具體實施方式，但本發明的保護範圍並不局限於此，任何熟悉本技術領域的技術人員在本發明揭露的技術範圍內，可輕易想到各種等效的修改或替換，這些修改或替換都應涵蓋在本發明的保護範圍之內。因此，本發明的保護範圍應以申請專利範圍的保護範圍為準。

101,102:步驟 201~206:圓環 301~303:圓環 304:發光圓球 305~307:圓環 308:發光圓球 41~43:圓環 44:發光圓球 45~47:圓環 48:發光圓球 421~426:圓弧 501~509:步驟 601:生成單元 602:顯示單元 603:接收單元 70:電子設備 701:處理器 702:記憶體 703:通信介面 704:顯示裝置 800:伺服器 822:中央處理器 826:電源 830:儲存介質 832:記憶體 841:操作系統 842:應用程式 844:資料 850:有線或無線網路介面 858:輸入輸出介面

為了更清楚地說明本發明實施例或背景技術中的技術方案，下面將對本發明實施例或背景技術中所需要使用的附圖進行說明。圖1為本發明實施例提供的一種資料顯示方法流程圖；圖2為本發明實施例提供的一種視覺化介面的對比示意圖；圖3為本發明實施例提供的另一種視覺化介面的對比示意圖；圖4為本發明實施例提供的又一種視覺化介面的對比示意圖；圖5為本發明實施例提供的另一種資料顯示方法流程圖；圖6為本發明實施例提供的一種電子設備的結構示意圖；圖7為本發明實施例提供的另一種電子設備的結構示意圖；圖8為本發明實施例提供的一種伺服器的結構示意圖。

101,102:步驟

Claims

一種資料顯示方法，包括：根據第一待視覺化資料，生成第一圓環；所述第一待視覺化資料包括第一類型的資料，所述第一類型的資料包括N種狀態的資料；所述第一圓環包括N段圓弧，所述N段圓弧中每段圓弧對應所述第一類型的一種狀態的資料，所述N為大於0的整數；顯示所述第一圓環；其中，所述N段圓弧中的第二圓弧的長度與所述第二圓弧對應的資料在總資料中的占比正相關，所述總資料為所述第一待視覺化資料中的所述第一類型的資料，所述第二圓弧為所述N段圓弧中的任一個；其他類型的視覺化資料對應的圓環與所述第一圓環，由內到外分佈且所述第一圓環與所述圓環之間存在間隔，所述第一類型與所述其他類型不同。
根據請求項1所述的方法，其中，所述顯示所述第一圓環包括：將當前顯示的第二圓環更新為所述第一圓環；所述第二圓環為在得到所述第一待視覺化資料之前，根據所述第一類型的第二資料生成的圓環。
根據請求項1或2所述的方法，還包括：顯示一個目標圖形，所述目標圖形內部具有描述資訊，所述描述資訊用於描述所述第一圓環中任一圓弧表示的內容。
根據請求項3所述的方法，其中，所述第一圓環顯示於所述目標圖形的四周，所述目標圖形為表徵光暈星球的圓形。
根據請求項1或2所述的方法，其中，所述顯示所述第一圓環之後，所述方法還包括：在接收到第一選擇指令之後，顯示第一圓弧對應的資料；所述第一選擇指令用於選擇所述第一圓環中的所述第一圓弧，所述第一圓弧為所述N段圓弧中的任一個。
根據請求項5所述的方法，其中，在接收到第一選擇指令之後，所述方法還包括：通過高亮方式顯示所述第一圓弧。
根據請求項6所述的方法，其中，所述通過高亮方式顯示所述第一圓弧包括：通過高亮方式顯示所述第一圓環的同時，增大所述第一圓環的寬度。
根據請求項1所述的方法，其中，所述N段圓弧中任意兩段圓弧的顏色不同。
根據請求項2所述的方法，其中，所述將當前顯示的第二圓環更新為所述第一圓環包括：將所述第二圓環渲染到當前顯示的畫面中；所述畫面包括至少一個圓環，所述至少一個圓環中每個圓環對應一種類型的資料。
根據請求項9所述的方法，其中，所述至少一個圓環以旋轉方式顯示，並且所述至少一個圓環中任意兩個圓環的旋轉速度不同。
根據請求項2所述的方法，其中，所述根據第一待視覺化資料，生成第一圓環之前，所述方法還包括：根據第二待視覺化資料，生成M個圓環；所述M個圓環中每個圓環對應一種類型的資料，所述M個圓環包括所述第二圓環，所述M為大於1的整數，所述第二待視覺化資料包括至少一種類型的資料；將所述M個圓環渲染到當前顯示的畫面中。
一種電腦可讀儲存介質，所述電腦可讀儲存介質中儲存有電腦程式，所述電腦程式包括程式指令，所述程式指令當被處理器執行時，使所述處理器執行請求項1至11任意一項所述的方法。
一種電子設備，包括：記憶體，用於儲存程式；處理器，用於執行所述記憶體儲存的所述程式，當所述程式被執行時，所述處理器用於執行如請求項1至11中任一項所述的方法。
一種晶片，該晶片包括處理器與資料介面，該處理器通過該資料介面讀取記憶體上儲存的指令，執行如請求項1至11中任一項所述的方法。