[发明专利]一种页面元素的处理方法、设备及计算机可读存储介质

说明书

本申请提供一种页面元素的处理方法、设备及计算机可读存储介质，其中，方法包括：获得针对页面元素的操作事件；基于操作事件对应的操作坐标，计算操作事件对页面元素进行处理产生的属性参数；基于操作事件的事件类型，对属性参数进行层叠样式表三级转换处理，得到转换后的属性参数；基于转换后的属性参数，对页面元素进行变形处理。

技术领域

本申请实施例涉及金融科技(Fintech)的数据处理技术领域，涉及但不限于一种页面元素的处理方法、设备及计算机可读存储介质。

背景技术

随着计算机计算的发展，越来越多的技术应用在金融领域，传统金融业正在逐步向金融科技(Fintech)转变，但由于金融行业的安全性、实时性要求，也对技术提出了更高的要求。

金融科技领域下，目前适用于框架(Vue)的页面元素的处理器主要是官方推荐的v-viewer，它是用于查看图片的组件，除支持旋转、缩放、翻转等操作外，也支持缩略图和原图两种模式的图片浏览。V-viewer基于viewer.js进行了封装，底层核心是基于层叠样式表二级(Cascading Style Sheets Level 2，CSS2)的定位函数(position)的绝对定位和相对定位进行实现，图片呈现在画布上，通过改变图片的上(top)偏移量和左(left)偏移量实现如拖拽效果，通过改变图片宽度(width)和高度(height)实现缩放效果。

v-viewer仅在渲染时使用层叠样式表三级(Cascading Style Sheets Level 3，CSS3)的旋转函数(rotate)。Viewer.js在底层之上对各种事件如鼠标事件，键盘事件，触摸事件等进行了处理，通过配置可以自定义操作栏，但无法自定义算法对属性参数进行转换。

相关技术中，由于CSS3实现成本较高且计算复杂，故目前都是利用position来实现查看器，position方式一般是三个属性分别处理，比如先缩放，后位移，再旋转，当页面元素为图片时，在小图片下，由于上述几个操作的发生时间非常短，给人感觉是同时实现，但是实际上并不是，即无法同时对多个属性进行转换，针对大页面元素如大图片的处理时，由于几个操作的发生时间有明显间隔，会察觉明显不流畅、卡顿，并且发生掉帧现象。

发明内容

本申请实施例提供一种页面元素的处理方法、设备及计算机可读存储介质，以解决现有的position查看器查看图片的方式容易出现卡顿、掉帧的问题。

本申请实施例的技术方案是这样实现的：

本申请实施例提供一种页面元素的处理方法，包括：

获得针对页面元素的操作事件；

基于所述操作事件对应的操作坐标，计算所述操作事件对所述页面元素进行处理产生的属性参数；

基于所述操作事件的事件类型，对所述属性参数进行层叠样式表三级转换处理，得到转换后的属性参数；

基于所述转换后的属性参数，对所述页面元素进行变形处理。

本申请实施例提供一种页面元素的处理设备，包括：

存储器，用于存储可执行指令；处理器，用于执行存储器中存储的可执行指令时，实现上述的方法。

本申请实施例提供一种计算机可读存储介质，存储有可执行指令，用于引起处理器执行时，实现上述的方法。

本申请实施例具有以下有益效果：