数据渲染方法、装置、电子设备及存储介质制造方法及图纸

本发明专利技术涉及人工智能技术领域，提供一种数据渲染方法、装置、电子设备及存储介质，所述方法包括：获取浏览器显示的待渲染页面及渲染条件；获取浏览器显示的待渲染页面对应的滑动条的当前起始滑动位置坐标；基于渲染条件及滑动条的当前起始滑动位置坐标，创建可视区；响应于待渲染页面中的滑动条的滑动，获取滑动条的滑动列表的高度；根据创建的可视区及滑动列表的高度，确定待渲染列表；将待渲染列表加载至可视区进行渲染。本发明专利技术通过将所述待渲染列表加载至所述可视区进行渲染，无需渲染可视区外的数据，提高了渲染效率。提高了渲染效率。提高了渲染效率。

【技术实现步骤摘要】
数据渲染方法、装置、电子设备及存储介质


[0001]本专利技术涉及人工智能
，具体涉及一种数据渲染方法、装置、电子设备及存储介质。

技术介绍

[0002]前端发展至今，如今的前端越来越复杂，知识点越来越丰富，从最早的html,css与Javascript三剑客到现在演变出了无数的库和框架，其中主流的UI框架有基于vue的element UI,vant UI，基于react的ant design等等，主要是基于轻量化的各种场景，缺少对于大数据场景下支持，随着大数据愈发蓬勃发展，对于大数据场景下的渲染需求越来越大。
[0003]目前的数据渲染方式不适用对数量级别比较大的数据量进行渲染，仅仅支持数据量级别比较低的数据进行渲染，数据渲染效率低。

技术实现思路

[0004]鉴于以上内容，有必要提出一种数据渲染方法、装置、电子设备及存储介质，通过将所述待渲染列表加载至所述可视区进行渲染，无需渲染可视区外的数据，提高了渲染效率。
[0005]本专利技术的第一方面提供一种数据渲染方法，所述方法包括：r/>[0006]响本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种数据渲染方法，其特征在于，所述方法包括：响应于用户的数据渲染请求，获取浏览器显示的待渲染页面及渲染条件；获取所述浏览器显示的待渲染页面对应的滑动条的当前起始滑动位置坐标；基于所述渲染条件及所述滑动条的当前起始滑动位置坐标，创建可视区；响应于所述待渲染页面中的滑动条的滑动，获取所述滑动条的滑动列表的高度；根据创建的可视区及所述滑动列表的高度，确定待渲染列表；将所述待渲染列表加载至所述可视区进行渲染。2.如权利要求1所述的数据渲染方法，其特征在于，所述获取所述浏览器显示的待渲染页面对应的滑动条的当前起始滑动位置坐标包括：识别所述浏览器显示的待渲染页面的外层容器；从所述外层容器中获取对应的滑动条的当前起始滑动位置坐标。3.如权利要求1所述的数据渲染方法，其特征在于，所述基于所述渲染条件及所述滑动条的当前起始滑动位置坐标，创建可视区包括：解析所述渲染条件，获取可视区渲染行数、可视区渲染行数列表及对应的每行渲染数据的高度；将所述当前起始滑动位置坐标及所述可视区渲染行数列表的起始行的行编码，确定为所述可视区的起始索引；将所述可视区渲染行数、对应的每行渲染的高度及所述可视区渲染行数列表的结束行的行编码，确定为所述可视区的结束索引；基于所述可视区的起始索引和结束索引创建可视区。4.如权利要求3所述的数据渲染方法，其特征在于，所述基于所述可视区的起始索引和结束索引创建可视区包括：将所述滑动条的当前起始滑动位置坐标确定为所述可视区的初始位置坐标；计算所述可视区渲染行数与对应的每行渲染的高度乘积之和，得到可视区的高度；计算所述可视区的高度与所述可视区的初始位置坐标之和，得到可视区的结束位置坐标；基于所述可视区的初始位置坐标和结束位置坐标创建可视区。5.如权利要求1所述的数据渲染方法，其特征在于，所述响应于所述待渲染页面中的滑动条的滑动，获取所述滑动条的滑动列表的高度包括：响应于所述滑动条从当前起始滑动位置开始滑动，记录滑动列表的每行滑动数据的高度；累加所述滑动列表中的每行滑动数据的高度之和，得到所述滑动条的当前...

【专利技术属性】
技术研发人员：董蕊，
申请(专利权)人：平安国际智慧城市科技股份有限公司，
类型：发明
国别省市：