[发明专利]一种环状占比图的生成方法及装置

说明书

本公开提供了一种环状占比图的生成方法及装置，该方法包括：根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一结束弧度，确定当前待绘制占比区块在环状占比图的开始弧度和结束弧度；依据环状占比图的圆环半径和圆心位置以及开始弧度和结束弧度，确定当前待绘制占比区块对应的两个半圆的属性信息；依据环状占比图的圆环半径和圆心位置，以及当前待绘制占比区块的两个半圆的属性信息，确定当前待绘制占比区块位于两个半圆之间的圆环的属性信息；依据当前待绘制占比区块的半圆的属性信息以及圆环的属性信息，生成当前待绘制占比区块的圆角环状图直至得到环状占比图。本公开实施例增加了环状占比图的展示形式。

技术领域

本公开涉及用户界面(UI，User Interface)设计技术领域，具体而言，涉及一种环状占比图的生成方法及装置。

背景技术

当今社会，随着网络信息的飞速发展，越来越多的信息可以通过浏览网页获得，占比图作为网页页面的一个元素，以直观形象的图形方式表达不同类别之间的比例信息，比如各品牌的手机在市场中所占得份额比例，受到了用户的喜爱。

目前，在网页页面中，比较常见的占比图为扇形占比图、柱状占比图和环状占比图，其中环状占比图以其形状新颖，所占屏幕小等优点在占比图中应用广泛，在环状占比图的开发中，通常使用第三方开源类库进行实现，但是目前通过第三方开源类库实现的环状占比图的通常为平角环状图，较为单一，用户体验度低。

综上，现有技术中的环状占比图通常为平角环状图，展示形式单一。

发明内容

有鉴于此，本公开的目的在于提供了一种环状占比图的生成方法及装置，以生成一种新型的环状占比图，增加了环状占比图的展示形式。

第一方面，本公开实施例提供了一种环状占比图的生成方法，所述环状占比图包括多个占比区块对应的圆角环状图，该方法包括：

根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；

依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；

依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；

依据所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及所述圆环的属性信息，生成所述当前待绘制占比区块的圆角环状图；

跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到所述环状占比图。

第二方面，本公开实施例提供了一种环状占比图的生成装置，所述环状占比图包括多个占比区块对应的圆角环状图，该装置包括：

弧度确定模块，用于根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；

半圆确定模块，用于依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；

圆环确定模块，用于依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；