【技術實現步驟摘要】
本專利技術涉及數據處理，尤其涉及一種基于react的動態高亮柱狀圖展示及分頁管理方法、裝置及電子設備。
技術介紹
1、在當今數字化信息時代，數據可視化在各個領域中扮演著至關重要的角色。動態高亮柱狀圖作為一種直觀、有效的數據可視化方式，被廣泛應用于數據分析、商業智能、科學研究等眾多場景，能夠幫助用戶快速理解和分析數據。然而，現有的基于react的動態高亮柱狀圖展示及分頁管理方案在實際應用中仍存在諸多問題，限制了其進一步的推廣和使用，主要表現為：
2、1.圖表庫學習成本高
3、目前市面上存在多種圖表庫，如d3.js、echarts等。d3.js功能強大，但其高度靈活性導致其api使用復雜，開發者需要深入理解其數據綁定和選擇機制，學習曲線陡峭，對于初學者而言，掌握其復雜的api及眾多概念（如選擇器、數據綁定、過渡動畫等）具有較大難度，這無疑增加了開發周期和成本。echarts雖然配置相對簡單，但對于復雜圖表的定制化需求，開發者仍需花費大量時間去理解其眾多的配置選項和回調函數，這也在一定程度上影響了開發效率。
4、2.性能問題突出
5、隨著數據量的不斷增長，現有方案在處理大數據量時面臨嚴峻挑戰。當處理數十萬甚至百萬級的數據時，圖表的渲染和交互性能會明顯下降。由于javascript單線程的特性，在處理大量數據時，計算和渲染操作容易阻塞ui線程，導致頁面卡頓，影響用戶體驗。此外，盡管canvas和svg是常用的圖形渲染技術，但在渲染大量元素或進行頻繁更新時，性能會顯著降低。而webgl雖然能
6、3.移動端適配不佳
7、在移動設備廣泛普及的今天，移動端的數據可視化需求日益增長。然而，現有的動態高亮柱狀圖展示方案在移動端存在諸多問題。一方面，某些交互效果（如拖動、縮放）在移動端的體驗不佳，由于很多圖表庫在設計時優先考慮桌面環境，對移動端的觸控事件（如滑動、縮放等）支持不足，導致用戶操作困難。另一方面，在小屏幕設備上，圖表元素可能過小或布局混亂，盡管很多庫支持響應式設計，但在實際顯示復雜圖表時，布局和交互設計仍然存在挑戰，嚴重影響用戶對數據的查看和分析。
8、4.跨瀏覽器兼容性差
9、不同瀏覽器對現代web技術的支持程度存在差異，這給動態高亮柱狀圖的展示帶來了兼容性問題。在舊版本瀏覽器上，某些圖表庫可能無法正常工作或性能大幅下降，需要額外處理兼容性問題。而且不同瀏覽器對圖形渲染的支持程度不一致，在實現跨瀏覽器兼容時，由于不同瀏覽器在實現圖形渲染標準（如svg、canvas）時存在差異，導致圖表顯示效果在不同瀏覽器間存在明顯差異，這使得開發者需要花費大量時間和精力進行調試和優化，以確保圖表在各種瀏覽器上都能正常顯示且效果一致。
10、5.定制化難度大
11、在實際應用中，用戶對動態高亮柱狀圖的定制化需求多種多樣。盡管現有的圖表庫提供了大量配置項，但要實現高度定制化的圖表，開發者仍需深入理解庫的內部機制并編寫大量代碼。許多圖表庫為了簡化使用，對內部機制進行了高度封裝，這使得開發者難以進行深度定制和擴展。此外，部分庫在功能擴展方面支持有限，缺乏完善的插件和擴展機制，開發者需要編寫自定義插件或擴展功能來滿足特定需求，這增加了開發的難度和工作量。
12、6.文檔和社區支持不足
13、文檔和社區支持對于開發者快速掌握和使用圖表庫至關重要。然而，某些圖表庫的文檔不夠詳細，示例代碼不足，開發者在遇到問題時難以找到解決方案。同時，社區活躍度不夠，缺乏及時的技術支持和問題解答，這增加了開發者的學習成本和使用難度，使得開發者在開發過程中遇到困難時無法及時獲得幫助，影響項目的進展。
14、上述問題成為需要解決的技術問題。
技術實現思路
1、有鑒于此，本專利技術實施例提供了一種基于react的動態高亮柱狀圖展示及分頁管理方法、裝置及電子設備，至少部分解決現有技術中存在的問題。
2、第一方面，本專利技術實施例提供了一種基于react的動態高亮柱狀圖展示及分頁管理方法，包括：
3、獲取需要展示的動態高亮柱狀圖集合p，對所述動態高亮柱狀圖集合p進行配置參數提取，得到配置參數集合c={c1,c2,...,cn}，設置與所述配置參數集合c對應的權重參數集合w={w1,w2,…,wn}以及執行所述配置參數集合c和權重參數集合w的柱狀圖生成函數fc；
4、接收用戶在操作界面針對柱狀圖輸入的設置參數cv，基于所述設置參數cv生成柱狀圖的匹配配置參數cp∈c以及匹配權重參數wp∈w，將所述匹配配置參數cp和匹配權重參數wp輸入到所述柱狀圖生成函數fc中，得到柱狀圖原始數據dy=fc(cp,wp)；
5、對所述柱狀圖原始數據dy進行解析，得到顯示所述柱狀圖所需的數據處理任務tk1以及數據渲染任務tk2，計算數據處理任務tk1的時間復雜度為o(tk1)和數據渲染任務的時間復雜度為o(tk2)，基于時間復雜度為o(tk1)和時間復雜度為o(tk2)，將柱狀圖原始數據dy轉換成在k個不同線程中同時執行的拆分數據dcf；
6、為運行拆分數據dcf的每個線程分別生成一個對應的執行插件，形成執行插件集合p={p1,p2,...,pk}，基于所述執行插件集合生成所述柱狀圖的顯示數據dp；
7、獲取柱狀圖在每一頁中顯示的數據量nd，基于數據量nd將所述顯示數據dp進行分割，得到分頁數據集合序列d’={d’1,d’2,…,d’m}，其中，表示對數值向上取整，|dp|表示顯示數據dp中包含的元素個數，在用戶對頁碼為p的當前頁面進行頁面切換時，如果用戶點擊上一頁，若p>1，則p=p-1，如果用戶點擊下一頁時，若p<m，則p=p+1，當用戶切換到第q頁時，根據頁碼從分頁數據集合序列d’中加載對應的數據d’p，并在第q頁的頁面上展示該頁數據對應的動態高亮柱狀圖。
8、根據本專利技術實施例的一種具體實現方式，所述獲取需要展示的動態高亮柱狀圖集合p，對所述動態高亮柱狀圖集合p進行配置參數提取，得到配置參數集合c={c1,c2,...,cn}，包括：
9、遍歷動態高亮柱狀圖集合p中的每一個柱狀圖實例，對每個實例進行初步結構分析，確定其包含的數據類型和展示需求；
10、提取與柱狀圖數據相關的數據值數組c1，該數組c1包含了柱狀圖中每個柱子所代表的數值信息，用于確定柱子的高度；
11、提取控制柱狀圖外觀樣式的柱子顏色參數c2，通過該參數c2設置每個柱子的顯示顏色；
12、獲取用于定義柱狀圖分類標簽的參數c3，標簽參數c3與數據值數組c1相對應，用于標識每個柱子所代表的類別；
13、提取與圖表交互功能相關的鼠標懸停提示信息參數c4，通過設置參數c4在用戶鼠標懸停在圓柱上時顯示數據說明。
14、根據本專利技術實施例的一種具體實現方式，所述將所述匹配配本文檔來自技高網...
【技術保護點】
1.一種基于React的動態高亮柱狀圖展示及分頁管理方法，其特征在于，包括：
2.根據權利要求1所述的方法，其特征在于，所述獲取需要展示的動態高亮柱狀圖集合P，對所述動態高亮柱狀圖集合P進行配置參數提取，得到配置參數集合C={C1,C2,...,Cn}，包括：
3.根據權利要求2所述的方法，其特征在于，所述將所述匹配配置參數Cp和匹配權重參數Wp輸入到所述柱狀圖生成函數Fc中，得到柱狀圖原始數據Dy=Fc(Cp,Wp)，包括：
4.根據權利要求3所述的方法，其特征在于，所述對所述柱狀圖原始數據Dy進行解析，得到顯示所述柱狀圖所需的數據處理任務Tk1以及數據渲染任務Tk2，包括：
5.根據權利要求4所述的方法，其特征在于，所述計算數據處理任務Tk01的時間復雜度為O(Tk01)和數據渲染任務的時間復雜度為O(Tk02)，基于時間復雜度為O(Tk01)和時間復雜度為O(Tk02)，將柱狀圖原始數據Dy轉換成在k0個不同線程中同時執行的拆分數據Dcf，包括：
6.根據權利要求5所述的方法，其特征在于，所述為運行拆分數據Dcf的
7.根據權利要求6所述的方法，其特征在于，所述獲取柱狀圖在每一頁中顯示的數據量Nd，基于數據量Nd將所述顯示數據DP進行分割，得到分頁數據集合序列D’={D’1,D’2,…,D’m}，包括：
8.根據權利要求7所述的方法，其特征在于，所述根據頁碼從分頁數據集合序列D’中加載對應的數據D’p，并在第q頁的頁面上展示該頁數據對應的動態高亮柱狀圖，包括：
9.一種基于React的動態高亮柱狀圖展示及分頁管理裝置，其特征在于，包括：
10.一種電子設備，其特征在于，所述電子設備包括：
...【技術特征摘要】
1.一種基于react的動態高亮柱狀圖展示及分頁管理方法，其特征在于，包括：
2.根據權利要求1所述的方法，其特征在于，所述獲取需要展示的動態高亮柱狀圖集合p，對所述動態高亮柱狀圖集合p進行配置參數提取，得到配置參數集合c={c1,c2,...,cn}，包括：
3.根據權利要求2所述的方法，其特征在于，所述將所述匹配配置參數cp和匹配權重參數wp輸入到所述柱狀圖生成函數fc中，得到柱狀圖原始數據dy=fc(cp,wp)，包括：
4.根據權利要求3所述的方法，其特征在于，所述對所述柱狀圖原始數據dy進行解析，得到顯示所述柱狀圖所需的數據處理任務tk1以及數據渲染任務tk2，包括：
5.根據權利要求4所述的方法，其特征在于，所述計算數據處理任務tk01的時間復雜度為o(tk01)和數據渲染任務的時間復雜度為o(tk02)，基于時間復雜度為o(tk01)和時...
【專利技術屬性】
技術研發人員：周少博，寇振芳，李蕾，苗宇，紀嘯崢，
申請(專利權)人：一網互通北京科技有限公司，
類型：發明
國別省市：
還沒有人留言評論。發表了對其他瀏覽者有用的留言會獲得科技券。