一种环状占比图的生成方法及装置制造方法及图纸

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

A Method and Device for Generating Ring Proportion Graph

The present disclosure provides a method and a device for generating a circular proportion graph, which includes: determining the starting and ending radians of the current proportion block in the circular proportion graph according to the data amount of the current proportion block to be drawn and the first and last radians of the adjacent proportion block; and determining the ring radius and the center position of the circular proportion graph, as well as the starting radians and the end radians of the current proportion block to be drawn in the circular proportion graph. The radian is used to determine the attribute information of the two semicircles corresponding to the current proportion block to be drawn; the attribute information of the circle between the two semicircles of the current proportion block to be drawn is determined based on the circle radius and center position of the ring proportion graph and the attribute information of the two semicircles of the current proportion block to be drawn; the attribute information of the semicircle between the two semicircles of the current proportion block to be drawn is determined based on the attribute information of the semicircle of the current proportion block to be drawn The attribute information of the circle is used to generate the circular corner ring map of the current proportion block to be drawn until the circular proportion map is obtained. The present embodiment of the disclosure adds a display form of a ring proportion diagram.

【技术实现步骤摘要】
一种环状占比图的生成方法及装置
本公开涉及用户界面(UI，UserInterface)设计
，具体而言，涉及一种环状占比图的生成方法及装置。
技术介绍
当今社会，随着网络信息的飞速发展，越来越多的信息可以通过浏览网页获得，占比图作为网页页面的一个元素，以直观形象的图形方式表达不同类别之间的比例信息，比如各品牌的手机在市场中所占得份额比例，受到了用户的喜爱。目前，在网页页面中，比较常见的占比图为扇形占比图、柱状占比图和环状占比图，其中环状占比图以其形状新颖，所占屏幕小等优点在占比图中应用广泛，在环状占比图的开发中，通常使用第三方开源类库进行实现，但是目前通过第三方开源类库实现的环状占比图的通常为平角环状图，较为单一，用户体验度低。综上，现有技术中的环状占比图通常为平角环状图，展示形式单一。
技术实现思路
有鉴于此，本公开的目的在于提供了一种环状占比图的生成方法及装置，以生成一种新型的环状占比图，增加了环状占比图的展示形式。第一方面，本公开实施例提供了一种环状占比图的生成方法，所述环状占比图包括多个占比区块对应的圆角环状图，该方法包括：根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；依据所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及所述圆环的属性信息，生成所述当前待绘制占比区块的圆角环状图；跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到所述环状占比图。第二方面，本公开实施例提供了一种环状占比图的生成装置，所述环状占比图包括多个占比区块对应的圆角环状图，该装置包括：弧度确定模块，用于根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；半圆确定模块，用于依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；圆环确定模块，用于依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；图形生成模块，用于依据所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及所述圆环的属性信息，生成所述当前待绘制占比区块的圆角环状图；跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到所述环状占比图。第三方面，本公开实施例提供了一种计算机设备包括处理器、存储器和总线，所述存储器存储执行指令，当装置运行时，所述处理器与所述存储器之间通过总线通信，所述处理器执行所述存储器中存储的如下执行指令：根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；依据所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及所述圆环的属性信息，生成所述当前待绘制占比区块的圆角环状图；跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到所述环状占比图。第四方面，本公开实施例提供了一种计算机可读存储介质，所述计算机可读存储介质上存储有计算机程序，所述计算机程序被处理器运行时执行上述的方法的步骤。与现有技术中相比，本公开实施例提供的环状占比图，包括多个占比区块对应的圆角环状占比图，该生成过程包括根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；依据环状占比图的圆环半径和圆心位置以及第二区块开始弧度和第二区块结束弧度，确定当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，第一半圆与第二区块开始弧度对应的线段相切，第二半圆与第二区块结束弧度对应的线段相切；依据环状占比图的圆环半径和圆心位置，以及当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定当前待绘制占比区块位于第一半圆和第二半圆之间的圆环的属性信息；依据当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及圆环的属性信息，生成当前待绘制占比区块的圆角环状图；跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到环状占比图。可见，本公开按照上述方法逐次生成环状占比图中的每个圆角环状占比图，进而得到一种不同于现有的平角环状占比图的一种新型环状占比图，这种新型的圆角环状占比图样式新颖，增加了环状占比图的展示形式，在网络页面出现时，能够满足用户的个性化需求，提高了用户体验度。为使本公开的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。附图说明为了更清楚地说明本公开实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本公开的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。图1a示出了现有技术中的平角环状占比图；图1b示出了本公开实施例所提供的圆角环状占比图；图2示出了本公开实施例所提供的环状占比图的生成方法流程示意图；图3示出了本公开实施例所提供的确定当前待绘制占比区块在环状占比图中的开始弧度和结束弧度的方法流程示意图；图4示出了本公开实施例所提供的当前待绘制占比区块对应的第一半圆的属性信息示意图的方法流程示意图；图5示出了本公开实施例所提供的环状占比图中涉及到的具体几何图；图6示出了本公开实施例所提供的确定当前待绘制占比区块位于第一半圆和第二半圆之间的圆环的属性信息的方法流程示意图；图7示出了本公开实施例所提供的一种环状占比图的生成装置结构示意图；图8示出了本公开实施例所提供的一种计算机设备的结构示意图。具体实施方式为使本本文档来自技高网...

【技术保护点】
1.一种环状占比图的生成方法，其特征在于，所述环状占比图包括多个占比区块对应的圆角环状图，该方法包括：根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；依据所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及所述圆环的属性信息，生成所述当前待绘制占比区块的圆角环状图；跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到所述环状占比图。

【技术特征摘要】
1.一种环状占比图的生成方法，其特征在于，所述环状占比图包括多个占比区块对应的圆角环状图，该方法包括：根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在环状占比图的第二区块开始弧度和第二区块结束弧度；依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息和第二半圆的属性信息，所述第一半圆与所述第二区块开始弧度对应的线段相切，所述第二半圆与所述第二区块结束弧度对应的线段相切；依据所述环状占比图的圆环半径和圆心位置，以及所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息，确定所述当前待绘制占比区块位于所述第一半圆和第二半圆之间的圆环的属性信息；依据所述当前待绘制占比区块的第一半圆的属性信息和第二半圆的属性信息以及所述圆环的属性信息，生成所述当前待绘制占比区块的圆角环状图；跳转至下一待绘制占比区块，直至生成最后一个待绘制占比区块的圆角环状图，得到所述环状占比图。2.根据权利要求1所述的方法，其特征在于，所述根据当前待绘制占比区块的数据量以及相邻的上一占比区块的第一区块结束弧度，确定所述当前待绘制占比区块在所述环状占比图的第二区块开始弧度和第二区块结束弧度，包括：根据所述当前待绘制占比区块的数据量以及所有占比区块的总数据量，确定所述当前待绘制占比区块的数据量在所述总数据量中所占的百分比；根据所述当前待绘制占比区块对应的百分比，确定所述当前待绘制占比区块在所述环状占比图中的占比弧度；根据所述当前待绘制占比区块的占比弧度以及所述第一区块结束弧度，确定所述当前待绘制占比区块的第二区块开始弧度和第二区块结束弧度。3.根据权利要求2所述的方法，其特征在于，所述根据所述当前待绘制占比区块的占比弧度以及所述第一区块结束弧度，确定所述当前待绘制占比区块的第二区块开始弧度和第二区块结束弧度，包括：以所述第一区块结束弧度为所述第二区块开始弧度；按照所述第二区块开始弧度以及所述当前待绘制占比区块的占比弧度，确定出所述第二区块结束弧度。4.根据权利要求2所述的方法，其特征在于，所述根据所述当前待绘制占比区块的占比弧度以及所述第一区块结束弧度，确定所述当前待绘制占比区块的第二区块开始弧度和第二区块结束弧度，包括：计算当前待绘制占比区块的占比弧度与设定占比弧度阈值的差值，得到当前待绘制占比区块的第二中间占比弧度；按照所述第一区块结束弧度以及所述设定占比弧度阈值，确定所述第二区块开始弧度；按照所述第二区块开始弧度以及所述第二中间占比弧度，确定所述第二区块结束弧度。5.根据权利要求1所述的方法，其特征在于，所述依据所述环状占比图的圆环半径和圆心位置以及所述第二区块开始弧度和第二区块结束弧度，确定所述当前待绘制占比区块对应的第一半圆的属性信息，包括：依据所述环状占比图的圆环半径，确定所述第一半圆的半径；依据所述环状占比图的圆环半径和圆心位置，以及所述第二区块开始弧度，确定所述第一半圆的圆心位置；以所述第一半圆的圆心位置为原点，以平行于所述环状占比图的坐标轴为坐标轴，构建第一半圆坐标系；在所述第一半圆坐标系中，依据所述环状占比图的圆环半径以及所述第二区块开始弧度，确定所述第一半圆的开始弧度和结束弧度。6.根据权利要求5所述的方法，其特征在于，所述依据所述环状占比...

【专利技术属性】
技术研发人员：吴昊，
申请(专利权)人：新华三大数据技术有限公司，
类型：发明
国别省市：河南,41