CN112506495A - 一种大数据可视化局部虚拟化进行快速上图的方法 - Google Patents
一种大数据可视化局部虚拟化进行快速上图的方法 Download PDFInfo
- Publication number
- CN112506495A CN112506495A CN202011240341.8A CN202011240341A CN112506495A CN 112506495 A CN112506495 A CN 112506495A CN 202011240341 A CN202011240341 A CN 202011240341A CN 112506495 A CN112506495 A CN 112506495A
- Authority
- CN
- China
- Prior art keywords
- rendering
- thread
- big data
- browser
- data visualization
- 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
- 238000000034 method Methods 0.000 title claims abstract description 25
- 238000012800 visualization Methods 0.000 title abstract description 4
- 238000009877 rendering Methods 0.000 claims abstract description 39
- 238000004364 calculation method Methods 0.000 claims abstract description 23
- 238000013079 data visualisation Methods 0.000 claims abstract description 19
- 230000003993 interaction Effects 0.000 claims abstract description 13
- 238000012545 processing Methods 0.000 claims abstract description 9
- 230000000007 visual effect Effects 0.000 claims abstract description 8
- 230000007246 mechanism Effects 0.000 claims abstract description 6
- 230000008569 process Effects 0.000 claims abstract description 6
- 238000013507 mapping Methods 0.000 claims 2
- 230000004044 response Effects 0.000 description 5
- 230000015556 catabolic process Effects 0.000 description 2
- 238000010586 diagram Methods 0.000 description 2
- VYZAMTAEIAYCRO-UHFFFAOYSA-N Chromium Chemical compound [Cr] VYZAMTAEIAYCRO-UHFFFAOYSA-N 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000008859 change Effects 0.000 description 1
- 238000011156 evaluation Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000003032 molecular docking Methods 0.000 description 1
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/34—Graphical or visual programming
-
- 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/95—Retrieval from the web
- G06F16/957—Browsing optimisation, e.g. caching or content distillation
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- General Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Databases & Information Systems (AREA)
- Data Mining & Analysis (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明涉及计算机技术领域，具体涉及一种大数据可视化局部虚拟化进行快速上图的方法；包括以下步骤：S1：在浏览器的用户视口区域发生视觉查询；S2：请求浏览器进程多线程处理机制进行计算和渲染，将计算部分和渲染部分进行拆分，通过大数据可视化的加载、Workers线程和Javascript线程之间的交互实现；S3：在浏览器的用户视口区域显示查询结果。本发明的目的在于提供一种大数据可视化局部虚拟化进行快速上图的方法，该方法通过大数据可视化加载，能够有效避免浏览器发生崩溃以及无响应的情况，还能够降低交互空白响应时间。
Description
技术领域
本发明涉及计算机技术领域，具体涉及一种大数据可视化局部虚拟化进行快速上图的方法。
背景技术
客户端B端浏览器内核内部存在多个线程，javascript线程属于其中一个线程，具体的计算部分和渲染部分都在javascript线程完成，因此在计算时间度复杂的情况下，页面交互可能会有空白期，甚至失去响应。
鉴于此，提出一种大数据可视化局部虚拟化进行快速上图的方法。
发明内容
本发明的目的在于提供一种大数据可视化局部虚拟化进行快速上图的方法，该方法通过大数据可视化加载，能够有效避免浏览器发生崩溃以及无响应的情况，还能够降低交互空白响应时间。
为了实现上述目的，本发明提供如下技术方案：
一种大数据可视化局部虚拟化进行快速上图的方法，包括以下步骤：
S1：在浏览器的用户视口区域发生视觉查询；
S2：请求浏览器进程多线程处理机制进行计算和渲染，将计算部分和渲染部分进行拆分，通过大数据可视化的加载、Workers线程和Javascript线程之间的交互实现；
S3：在浏览器的用户视口区域显示查询结果。
具体的，所述浏览器包括Chrome、IE、Firefox和ECMAscript。
具体的，所述大数据可视化的加载包含对两种数据集的加载，所述两种数据集分别为模型数据集和视口数据集，所述模型数据集为上图所有数据内容，所述视口数据集为用户可见区域数据集。
具体的，所述Workers线程用于进行密集型计算，所述密集型计算包括以节点布局坐标和以节点与节点连线布局坐标两种方式进行的。
具体的，所述Javascript线程用于进行处理渲染。
具体的，所述渲染的方式分为canvas渲染方式或svg渲染方式。
本发明的有益效果是：本发明通过将计算部分和渲染部分完全拆分，并合理利用浏览器进程多线程处理机制，其中，计算部分在Workers线程完成，渲染部分在Javascript线程完成，利用多线程之间的交互，渲染部分无需等待计算部分完成再进行，能够有效缩短用户视口区域显示查询结果的时间；通过进行大数据可视化的加载，可提高交互的流畅性，能够有效避免浏览器发生崩溃以及无响应的情况，还能够降低交互空白响应时间。
附图说明
图1为本发明实施例中大数据可视化局部虚拟化进行快速上图的方法的流程图；
图2为本发明实施例中Workers线程与Javascript线程之间进行交互实现数据对接的功能框图；
图3为本发明实施例中大数据可视化的加载的功能框图。
具体实施方式
下面将对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅是本发明的一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
参考附图1，一种大数据可视化局部虚拟化进行快速上图的方法，包括以下步骤：
S1：在浏览器的用户视口区域发生视觉查询；
S2：请求浏览器进程多线程处理机制进行计算和渲染，将计算部分和渲染部分进行拆分，通过大数据可视化的加载、Workers线程和Javascript线程之间的交互实现；
S3：在浏览器的用户视口区域显示查询结果。
具体的，所述浏览器包括Chrome、IE、Firefox和ECMAscript，其中Chrome具体指Chrome50以上版本的浏览器，IE具体指IE10以上版本的浏览器，Firefox具体指Firefox50以上版本的浏览器，ECMAscript具体指ECMAscript5浏览器。
具体的，所述大数据可视化的加载包含对两种数据集的加载，所述两种数据集分别为模型数据集和视口数据集，所述模型数据集为上图所有数据内容，所述视口数据集为用户可见区域数据集。
具体的，所述Workers线程用于进行密集型计算，所述密集型计算包括以节点布局坐标和以节点与节点连线布局坐标两种方式进行的。
具体的，所述Javascript线程用于进行处理渲染。
具体的，所述渲染的方式分为canvas渲染方式或svg渲染方式。
进一步的，本发明涉及的大数据可视化的加载，以关系图来说分为计算部分和渲染部分。
进一步的，本发明涉及的渲染是对节点的几何属性(例如面积、形状以及填充色等)以及对渲染边的几何属性(例如形状，粗细以及基准长度等)两方面进行的。
进一步的，参考附图2，本发明涉及的Workers线程与Javascript线程之间进行交互实现数据对接，其中，Workers线程可将密集型计算数据结果传输至Javascript线程，也可以对接Javascript线程处理的渲染结果，Javascript线程可对接Workers线程计算数据结果，也可对将渲染结果传输至Workers线程。
进一步的，本发明涉及的用户视口区域资源发生改变需要及时反馈，用户操作行为监听，渲染内容监听。
进一步的，参考附图3，本发明涉及的大数据可视化的加载在模型数据区域进行加载，并在模型数据区域中加载全部的数据量，当数据量超出一定范围(例如硬件设备以及资源等)用户视口区域数据参与布局，其他非视口区域不参与布局，当全部数据都出现在用户视口区域，那么需要降低算法维度以及渲染几何体的丰富性。
下面结合具体实施例对本发明进一步描述。
目前有10000个节点和10000边需要加载网络布局关系图，传统实现方式采取客户端实现计算部分和渲染部分拆分但不进行分离,需要渲染部分等待计算部分完成后再进行，实际上图需要3分钟；采用本发明涉及的将计算部分和渲染部分拆分后，理想状态下可缩短1/3时间，实际上图需要2分钟；再通过大数据可视化的加载，进而对视口数据集做计算量评估，用户可见1000个节点，即1000/10000×3/3×2，实际上图需要12秒。
本发明通过将计算部分和渲染部分完全拆分，并合理利用浏览器进程多线程处理机制，其中，计算部分在Workers线程完成，渲染部分在Javascript线程完成，利用多线程之间的交互，渲染部分无需等待计算部分完成再进行，能够有效缩短用户视口区域显示查询结果的时间；通过进行大数据可视化的加载，可提高交互的流畅性，能够有效避免浏览器发生崩溃以及无响应的情况，还能够降低交互空白响应时间。
以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所有的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。
Claims (6)
1.一种大数据可视化局部虚拟化进行快速上图的方法，其特征在于，包括以下步骤：
S1：在浏览器的用户视口区域发生视觉查询；
S2：请求浏览器进程多线程处理机制进行计算和渲染，将计算部分和渲染部分进行拆分，通过大数据可视化的加载、Workers线程和Javascript线程之间的交互实现；
S3：在浏览器的用户视口区域显示查询结果。
2.根据权利要求1所述的一种大数据可视化局部虚拟化进行快速上图的方法，其特征在于，所述浏览器包括Chrome、IE、Firefox和ECMAscript。
3.根据权利要求1所述的一种大数据可视化局部虚拟化进行快速上图的方法，其特征在于，所述大数据可视化的加载包含对两种数据集的加载，所述两种数据集分别为模型数据集和视口数据集，所述模型数据集为上图所有数据内容，所述视口数据集为用户可见区域数据集。
4.根据权利要求1所述的一种大数据可视化局部虚拟化进行快速上图的方法，其特征在于，所述Workers线程用于进行密集型计算，所述密集型计算包括以节点布局坐标和以节点与节点连线布局坐标两种方式进行的。
5.根据权利要求1所述的一种大数据可视化局部虚拟化进行快速上图的方法，其特征在于，所述Javascript线程用于进行处理渲染。
6.根据权利要求5所述的一种大数据可视化局部虚拟化进行快速上图的方法，其特征在于，所述渲染的方式分为canvas渲染方式或svg渲染方式。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011240341.8A CN112506495A (zh) | 2020-11-09 | 2020-11-09 | 一种大数据可视化局部虚拟化进行快速上图的方法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202011240341.8A CN112506495A (zh) | 2020-11-09 | 2020-11-09 | 一种大数据可视化局部虚拟化进行快速上图的方法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN112506495A true CN112506495A (zh) | 2021-03-16 |
Family
ID=74955789
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202011240341.8A Pending CN112506495A (zh) | 2020-11-09 | 2020-11-09 | 一种大数据可视化局部虚拟化进行快速上图的方法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN112506495A (zh) |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2014055890A2 (en) * | 2012-10-05 | 2014-04-10 | Google Inc. | Transcoding and serving resources |
| CN109271581A (zh) * | 2018-08-02 | 2019-01-25 | 北京天元创新科技有限公司 | 一种基于Dashboard的大数据快速呈现方法 |
| US20190302974A1 (en) * | 2018-04-03 | 2019-10-03 | Palantir Technologies Inc. | Multi-stage data page rendering |
| CN111488149A (zh) * | 2020-03-11 | 2020-08-04 | 平安健康保险股份有限公司 | 基于canvas元素的表格渲染方法、装置及计算机设备 |
-
2020
- 2020-11-09 CN CN202011240341.8A patent/CN112506495A/zh active Pending
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| WO2014055890A2 (en) * | 2012-10-05 | 2014-04-10 | Google Inc. | Transcoding and serving resources |
| US20190302974A1 (en) * | 2018-04-03 | 2019-10-03 | Palantir Technologies Inc. | Multi-stage data page rendering |
| CN109271581A (zh) * | 2018-08-02 | 2019-01-25 | 北京天元创新科技有限公司 | 一种基于Dashboard的大数据快速呈现方法 |
| CN111488149A (zh) * | 2020-03-11 | 2020-08-04 | 平安健康保险股份有限公司 | 基于canvas元素的表格渲染方法、装置及计算机设备 |
Non-Patent Citations (1)
| Title |
|---|
| LOMON6: "浏览器渲染机制（二）浏览器主进程-浏览器内核-浏览器渲染流程", pages 1 - 5, Retrieved from the Internet <URL:https://blog.csdn.net/qq_43952245/article/details/103437429> * |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| US10152560B2 (en) | Graph database querying and visualization | |
| US10620816B2 (en) | System for displaying elements of a scrollable list | |
| CN106021421B (zh) | 一种加速网页渲染的方法及装置 | |
| US10089957B2 (en) | Page display method and terminal | |
| WO2020034951A1 (zh) | 利用前端编程语言优化图片懒加载的方法以及电子设备 | |
| US11610563B2 (en) | Location-based display of pixel history | |
| US20230298237A1 (en) | Data processing method, apparatus, and device and storage medium | |
| US8881002B2 (en) | Trial based multi-column balancing | |
| CN111915705A (zh) | 图片可视化编辑方法、装置、设备和介质 | |
| CN114564630A (zh) | 一种图数据Web3D可视化的方法、系统和介质 | |
| US10042507B2 (en) | Context-aware application status indicators | |
| CN110413820B (zh) | 一种图片描述信息的获取方法及装置 | |
| WO2018053889A1 (zh) | 分布式计算框架和分布式计算方法 | |
| US20210303080A1 (en) | Input method for virtual keyboard, electronic device and storage medium | |
| CN112506495A (zh) | 一种大数据可视化局部虚拟化进行快速上图的方法 | |
| CN109800039B (zh) | 一种用户界面展示方法、装置、电子设备及存储介质 | |
| CN114547495B (zh) | 一种页面加载方法、装置、设备及可读存储介质 | |
| CN111243069B (zh) | 一种Unity3D引擎的场景切换方法和系统 | |
| US10366140B2 (en) | Method for replaying user activity by rebuilding a webpage capturing content at each web event | |
| CN104461476B (zh) | 基于Metro的界面元素的重绘方法及装置 | |
| US20190187960A1 (en) | Reducing memory usage in software applications | |
| Zhang | Enabling Effective Utilization of GPUs for Data Management Systems | |
| CN117472380B (zh) | 一种前端表单生成方法及系统 | |
| CN114926570A (zh) | 一种提高3d呈现速度的方法和系统 | |
| CN117194553A (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 |