一种构建表盘对象的方法及系统技术方案

本发明专利技术公开了一种构建表盘对象的方法及系统，该方法包括：根据预设的关联原则更新预设指针控件的值，预设指针控件至少包括：表盘元素、表盘元素属性、指针元素、指针元素属性及指针元素CSS属性；根据指针元素CSS属性及伪元素，对指针控件进行颜色渲染，得到渲染后的指针控件颜色；根据表盘元素的预设事件属性对当前指针的各指针控件值进行更新，确定各指针之间的逻辑变化；根据各指针之间的逻辑变化、指针控件及渲染后的指针控件颜色，构建目标表盘对象。本发明专利技术通过增加新的控件元素、属性及伪元素，根据预设事件属性对各控件值进行更新，构建目标表盘对象，实现可扩展的复杂控件支持，且具有接口简单，性能好，方便扩展，安全性好等优点。

A method and system of constructing dial object

【技术实现步骤摘要】
一种构建表盘对象的方法及系统
本专利技术涉及计算机信息处理
，具体涉及一种构建表盘对象的方法及系统。
技术介绍
目前，超文本标记语言(HypertextMarkedLanguage,HTML)页面主要用于文字和图片混排的文档内容，以及用于网页的布局排版和渲染的层叠样式表(CascadingStyleSheets,CSS)相关规范，其中，主要是基于矩形区域进行的，比如用来控制其宽度和高度的属性(width和height)及用于控制HTML元素布局的属性等。随着HTML5及CSS3技术的发展，很多运行在PC、智能手机上的应用(App)，开始使用Web技术来为用户呈现内容，并作为人机交互的界面，但是，将网页前端技术用于客户端应用的开发时，基于矩形块的CSS样式表，需要多个标签元素，并且每个标签元素又对应多个CSS属性，增加了系统内存的开销，甚至画面会出现停顿和抖动的现象，无法简单有效地为各种复杂的控件提供有效支持，并且执行效率低，占用内存大。
技术实现思路
有鉴于此，本专利技术实施例提供了一种构建表盘对象的方法及系统，以解决现有技术无法为各种复杂的控件提供有效支持，并且执行效率低，占用内存大的技术问题。为达到上述目的，本专利技术提供如下技术方案：第一方面，本专利技术实施例提供一种构建表盘对象的方法，包括如下步骤：根据预设的关联原则更新预设指针控件的值，所述预设指针控件至少包括：表盘元素、表盘元素属性、指针元素、指针元素属性及指针元素CSS属性；根据所述指针元素CSS属性及伪元素，对所述指针控件进行颜色渲染，得到渲染后的指针控件颜色；根据所述表盘元素的预设事件属性对当前指针的各指针控件值进行更新，确定各所述指针之间的逻辑变化；根据各所述指针之间的逻辑变化、指针控件及渲染后的指针控件颜色，构建目标表盘对象。在一实施例中，当未设置所述指针元素CSS属性的初始值时，将指针元素属性值定义为相应的指针元素CSS属性值；根据指针控件值及指针元素CSS属性值，实现对指针控件值的更新。在一实施例中，监听指针控件值的响应变化，当指针控件值发生变化时获取响应请求数据；根据所述响应请求数据对应的指针控件值、当前指针的各指针控件值及表盘元素的预设事件属性对应的响应函数，得到响应结果；根据所述响应结果，对各指针控件值进行更新，确定各所述指针之间的逻辑变化。在一实施例中，根据各所述指针之间的逻辑变化及指针控件，对指针控件值进行识别与解析，得到对应的解析控件值；获取预设渲染节点的成员变量；根据预设函数，将各所述解析控件值配置到各所述成员变量中，得到当前成员变量；根据各所述当前成员变量及预设的相应函数，对指针控件进行布局及渲染，得到目标表盘对象。在一实施例中，将属性名称及标签名称保存至相应文件；根据指针控件属性名称及标签名称生成对应的哈希值；根据所述哈希值，获取各预设类的成员函数；根据各指针控件对应的所述成员函数对各指针控件值进行解析，得到对应的解析控件值。在一实施例中，获取表盘元素的逻辑坐标，根据表盘元素属性值、预设缩放比例及所述表盘元素的逻辑坐标，将表盘元素的逻辑坐标变换为设备坐标，确定画布尺寸及旋转中心点坐标；根据预设旋转方向判别规则，确定指针旋转方向；根据所述指针旋转方向及各指针元素CSS属性值，确定指针角度及指针端点坐标；根据所述指针角度及指针端点坐标，确定指针控件渐变颜色取值；根据预设绘图函数、所述表盘元素的中心点坐标、所述指针角度及所述指针端点坐标绘制指针，对指针控件进行布局及渲染，得到所述目标表盘对象。在一实施例中，获取所述指针元素CSS属性中的初始旋转角度值及终止旋转角度值；当终止旋转角度值大于初始旋转角度值时，确定顺时针方向为指针旋转方向；当终止旋转角度值小于初始旋转角度值时，确定逆时针方向为指针旋转方向。在一实施例中，根据所述指针元素CSS属性值中的最小量程属性值、最大量程属性值及所述初始旋转角度值与所述终止旋转角度值的差值，确定指针的每个旋转角度对应的量程值；根据获取的所述指针元素CSS属性中的指针实际值及预设方法，确定指针当前值；根据所述指针当前值、最小量程属性值、指针旋转方向及每个旋转角度对应的量程值，确定当前指针的角度；根据获取的指针针眼坐标及所述旋转中心点坐标，得到指针针眼相对于旋转中心点的偏移量，确定指针针尾坐标；获取指针元素属性中的指针量程区域宽度值及高度值中的最小值，根据所述最小值及预设缩放比例对所述指针针尾坐标进行缩放，确定指针端点坐标。在一实施例中，如果所述指针实际值小于所述最小量程属性值，则将所述最小量程属性值确定为指针当前值；如果所述指针实际值大于所述最大量程属性值，则将所述最大量程属性值确定为指针当前值。在一实施例中，根据所述指针元素CSS属性值中的旋转角度值，确定指针控件渐变角度范围；根据所述指针当前值、所述最小量程属性值、所述指针旋转方向、每个旋转角度对应的量程值及指针控件渐变角度范围，确定指针控件渐变颜色取值。第二方面，本专利技术实施例提供一种构建表盘对象的系统，包括，更新模块，用于根据预设的关联原则更新预设指针控件值，所述预设指针控件至少包括：表盘元素、表盘元素属性、指针元素、指针元素属性及指针元素CSS属性；指针控件颜色渲染模块，用于根据所述指针元素CSS属性及伪元素，对所述指针控件颜色进行渲染，得到渲染后的指针控件颜色；逻辑变化确定模块，用于根据所述表盘元素的预设事件属性对当前指针的各指针控件值进行更新，确定各所述指针之间的逻辑变化；目标表盘对象构建模块，用于根据各所述指针之间的逻辑变化及指针控件，构建目标表盘对象。第三方面，本专利技术实施例提供一种计算机可读存储介质，所述计算机可读存储介质存储计算机指令，所述计算机指令被处理器执行时实现本专利技术实施例第一方面的构建表盘对象的方法。以使至少一个处理器执行本专利技术实施例第一方面的多设备的自适应控制方法。第四方面，本专利技术实施例提供一种存储器和处理器，所述存储器和所述处理器之间互相通信连接，所述存储器中存储有计算机指令，所述处理器通过执行所述计算机指令，从而执行本专利技术实施例第一方面的构建表盘对象的方法。本专利技术技术方案，具有如下优点：1.本专利技术提供的构建表盘对象的方法及系统，通过增加新的控件元素及相应属性，根据预设事件属性对各控件值进行更新，确定各指针之间的逻辑变化关系，然后构建目标表盘对象，实现可扩展的复杂控件支持，并且可直接内嵌到HTML页面中，和其他HTML元素及CSS属性完全兼容，且具有接口简单，性能好，方便扩展，安全性好等优点。2.本专利技术提供的构建表盘对象的方法及系统，通过对各指针控件的识别与解析，实现对各元素的布局与渲染，简化了指针控件的定义和应用，降低了页面的内存占用，提高了交互性能和用户体验，避免了使用大量div元素来组成指针图形，从而降低了页面的内存占用，同时避免了在指针值变化时的大量重新布局的计算，提高了系统的性能；将指针的内部处理交由用户代理实现，故而可获得更好的性能以及交互体验；通过引入新的CSS属性，可让HTML文档作者定义指针控本文档来自技高网...

【技术保护点】
1.一种构建表盘对象的方法，其特征在于，包括，/n根据预设的关联原则更新预设指针控件的值，所述预设指针控件至少包括：表盘元素、表盘元素属性、指针元素、指针元素属性及指针元素CSS属性；/n根据所述指针元素CSS属性及伪元素，对所述指针控件进行颜色渲染，得到渲染后的指针控件颜色；/n根据所述表盘元素的预设事件属性对当前指针的各指针控件值进行更新，确定各所述指针之间的逻辑变化；/n根据各所述指针之间的逻辑变化、指针控件及渲染后的指针控件颜色，构建目标表盘对象。/n

【技术特征摘要】
1.一种构建表盘对象的方法，其特征在于，包括，
根据预设的关联原则更新预设指针控件的值，所述预设指针控件至少包括：表盘元素、表盘元素属性、指针元素、指针元素属性及指针元素CSS属性；
根据所述指针元素CSS属性及伪元素，对所述指针控件进行颜色渲染，得到渲染后的指针控件颜色；
根据所述表盘元素的预设事件属性对当前指针的各指针控件值进行更新，确定各所述指针之间的逻辑变化；
根据各所述指针之间的逻辑变化、指针控件及渲染后的指针控件颜色，构建目标表盘对象。


2.根据权利要求1所述的构建表盘对象的方法，其特征在于，所述根据预设的关联原则更新预设指针控件值的步骤，包括：
当未设置所述指针元素CSS属性的初始值时，将指针元素属性值定义为相应的指针元素CSS属性值；
根据指针控件值及指针元素CSS属性值，实现对指针控件值的更新。


3.根据权利要求1所述的构建表盘对象的方法，其特征在于，所述根据所述表盘元素的预设事件属性对当前指针的各指针控件值进行更新，确定各所述指针之间的逻辑变化的步骤，包括：
监听指针控件值的响应变化，当指针控件值发生变化时获取响应请求数据；
根据所述响应请求数据对应的指针控件值、当前指针的各指针控件值及表盘元素的预设事件属性对应的响应函数，得到响应结果；
根据所述响应结果，对各指针控件值进行更新，确定各所述指针之间的逻辑变化。


4.根据权利要求1所述的构建表盘对象的方法，其特征在于，所述根据各所述指针之间的逻辑变化及指针控件，构建目标表盘对象的步骤，包括：
根据各所述指针之间的逻辑变化及指针控件，对指针控件值进行识别与解析，得到对应的解析控件值；
获取预设渲染节点的成员变量；
根据预设函数，将各所述解析控件值配置到各所述成员变量中，得到当前成员变量；
根据各所述当前成员变量及预设的相应函数，对指针控件进行布局及渲染，得到目标表盘对象。


5.根据权利要求4所述的构建表盘对象的方法，其特征在于，所述根据各所述指针之间的逻辑变化及指针控件，对指针控件值进行识别与解析，得到对应的解析控件值的步骤，包括：
将属性名称标签名称保存至相应文件；
根据指针控件属性名称及标签名称生成对应的哈希值；
根据所述哈希值，获取各预设类的成员函数；
根据各指针控件对应的所述成员函数对各指针控件值进行解析，得到对应的解析控件值。


6.根据权利要求4所述的构建表盘对象的方法，其特征在于，所述根据各所述当前成员变量及预设的相应函数，对指针控件进行布局及渲染，得到目标表盘对象的步骤，包括：
获取表盘元素的逻辑坐标，根据表盘元素属性值、预设缩放比例及所述表盘元素的逻辑坐标，将表盘元素的逻辑坐标变换为设备坐标，确定画布尺寸及旋转中心点坐标；
根据预设旋转方向判别规则，确定指针旋转方向；
根据所述指针旋转方向及各指针元素CSS属性值，确定指针角度及指针端点坐标；
根据所述指针角度及指针端点坐标，确定指针控件渐变颜色取值；
根据预设绘图函数、所述表盘元素的中心点坐标、所述指针角度、所述指针端点坐标及指针控件渐变颜色取值绘制指针，对指针控件进行布局及渲染，得到所述目标表盘对象。
<...

【专利技术属性】
技术研发人员：魏永明，耿岳，薛淑明，
申请(专利权)人：北京飞漫软件技术有限公司，
类型：发明
国别省市：北京;11