CN116612228A - 用于平滑物体边缘的方法、装置及存储介质 - Google Patents

Abstract

本公开实施例公开了一种用于平滑物体边缘的方法、装置及存储介质，其中，方法包括：响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，将目标物体的边缘mask图贴在承载物体的表面，承载物体的中心点位置为相机所在位置；在着色器中读取目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；根据至少一个像素点的坐标信息以及边缘路径的路径信息，计算至少一个像素点与边缘路径的最小距离；基于至少一个像素点与边缘路径的最小距离，确定目标物体边缘上至少一个像素点的透明度，以实现目标物体边缘的平滑。本公开实施例可以不基于alpha通道实现对原始边缘mask做平滑处理。

Description

用于平滑物体边缘的方法、装置及存储介质

技术领域

本公开涉及三维纹理和图像处理技术领域，尤其涉及一种用于平滑物体边缘的方法、装置及存储介质。

背景技术

对于虚拟现实(Virtual Reality，简称为VR)全景图中的物体，通常无法直接通过实时计算描述会物体的边缘，虽然相关技术中可以通过边缘检测mask算法学习并输出图像中物体的mask边缘，但是所输出的mask边缘可能存在大量的毛刺。在物体边缘扫光灯应用中，这种毛刺对视觉效果产生不好的影响。

发明内容

本公开实施例所要解决的一个技术问题是：提供一种用于平滑物体边缘的方法、装置及存储介质。

根据本公开实施例的一个方面，提供一种用于平滑物体边缘的方法，应用于支持WebGL的浏览器客户端，所述方法包括：

响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，所述承载物体的中心点位置为相机所在位置；

在着色器中读取所述目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；

根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离；

基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，以实现所述目标物体边缘的平滑。

在本公开的一个实施例中，所述在着色器中读取所述目标物体的边缘mask图，得到所述目标物体边缘上至少一个像素点的坐标信息，包括：

在着色器中读取所述边缘mask图至少一个像素点的像素坐标；

根据所述边缘mask图至少一个像素点的像素坐标，确定所述边缘mask图至少一个像素点的像素值；

将所述像素值为设定值的像素点确定为所述目标物体边缘上的像素点，并将所述目标物体边缘上的像素点的坐标信息作为所述目标物体边缘上对应像素点的坐标信息。

在本公开又一实施例中，所述根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，包括：

根据所述边缘路径的路径信息，计算出所述边缘路径的首尾相连的多条线段；

以所述目标物体边缘上至少一个像素点为起点分别向与所述多条线段做垂线，得到所述目标物体边缘上至少一个像素点与所述多条线段的距离；

针对所述目标物体边缘上至少一个像素点，将与所述多条线段的距离中的最小值作为与所述边缘路径的最小距离。

在本公开又一实施例中，所述方法还包括：

接收用户触发的扫光显示操作；

根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点；

按照设定展示角度、设定旋转方向，确定后续任一帧的扫光显示像素点；

对每一帧的扫光显示像素点进行渲染和高亮显示，放弃渲染所述目标物体边缘上的除扫光显示像素点之外的像素点。

在本公开又一实施例中，所述根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点，包括：

计算所述目标物体边缘上至少一个像素点与所述边缘物体的中心点的连线与x轴正方向的夹角；

将所述夹角在所述起点角度和终点角度之间的所述目标物体边缘上的像素点判定为所述初始帧的扫光显示像素点。

在本公开又一实施例中，所述基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，包括：

通过式(1)计算所述目标物体边缘上至少一个像素点的透明度：

alpha＝1.0-k*normalize(distance(point,closedpoint)) 式(1)

式(1)中，k为一个经验值，normalize()为一个归一化函数，用于将所述至少一个像素点与所述边缘路径的最小距离进行归一化处理。

在本公开又一实施例中，所述方法还包括：

离线生成所述目标物体的边缘mask图和所述目标物体的边缘路径信息；

将所述目标物体的边缘路径信息以二维数组的形式输入所述着色器，将目标物体的边缘mask图以贴在所述承载物体表面的形式输入所述着色器。

根据本公开实施例的又一方面，提供一种用于平滑物体边缘的装置，应用于支持WebGL的浏览器客户端，所述装置包括：

第一生成模块，用于响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，所述承载物体的中心点位置为相机所在位置；

读取模块，用于在着色器中读取所述目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；

距离计算模块，用于根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离；

透明度确定模块，用于基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，以实现所述目标物体边缘的平滑。

在本公开的一个实施例中，所述读取模块包括：

读取子模块，用于在着色器中读取所述边缘mask图至少一个像素点的像素坐标；

像素值确定子模块，用于根据所述边缘mask图至少一个像素点的像素坐标，确定所述边缘mask图至少一个像素点的像素值；

第一确定子模块，用于将所述像素值为设定值的像素点确定为所述目标物体边缘上的像素点，并将所述目标物体边缘上的像素点的坐标信息作为所述目标物体边缘上对应像素点的坐标信息。

在本公开又一实施例中，所述距离计算模块包括：

计算子模块，用于根据所述边缘路径的路径信息，计算出所述边缘路径的首尾相连的多条线段；

垂线子模块，用于以所述目标物体边缘上至少一个像素点为起点分别向与所述多条线段做垂线，得到所述目标物体边缘上至少一个像素点与所述多条线段的距离；

第二确定子模块，用于针对所述目标物体边缘上至少一个像素点，将与所述多条线段的距离中的最小值作为与所述边缘路径的最小距离。

在本公开又一实施例中，所述装置还包括：

接收模块，用于接收用户触发的扫光显示操作；

第一确定模块，用于根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点；

第二确定模块，用于按照设定展示角度、设定旋转方向，确定后续任一帧的扫光显示像素点；

渲染模块，用于对每一帧的扫光显示像素点进行渲染和高亮显示，放弃渲染所述目标物体边缘上的除扫光显示像素点之外的像素点。

在本公开又一实施例中，所述第一确定模块包括：

夹角计算子模块，用于计算所述目标物体边缘上至少一个像素点与所述边缘物体的中心点的连线与x轴正方向的夹角；

第三确定子模块，用于将所述夹角在所述起点角度和终点角度之间的所述目标物体边缘上的像素点判定为所述初始帧的扫光显示像素点。

在本公开又一实施例中，所述透明度确定模块，具体用于通过式(1)计算所述目标物体边缘上至少一个像素点的透明度：

alpha＝1.0-k*normalize(distance(point,closedpoint)) 式(1)

式(1)中，k为一个经验值，normalize()为一个归一化函数，用于将所述至少一个像素点与所述边缘路径的最小距离进行归一化处理。

在本公开又一实施例中，所述装置还包括：

第二生成模块，用于离线生成所述目标物体的边缘mask图和所述目标物体的边缘路径信息；

输入模块，用于将所述目标物体的边缘路径信息以二维数组的形式输入所述着色器，将所述目标物体的边缘mask图以贴在所述承载物体表面的形式输入所述着色器。

根据本公开实施例的再一方面，提供一种电子设备，该电子设备包括：

存储器，用于存储计算机程序；

处理器，用于执行所述存储器中存储的计算机程序，且所述计算机程序被执行时，实现上述用于平滑物体边缘的方法。

根据本公开实施例的再一方面，提供一种计算机可读存储介质，其上存储有计算机程序，该计算机程序被处理器执行时，实现上述用于平滑物体边缘的方法。

基于本公开上述实施例提供的用于平滑物体边缘的方法、装置以及存储介质，应用于支持全球广域网图形函数库(Web Graphics Library，简称为WebGL)2.0的浏览器客户端，响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，该承载物体的中心点位置为相机所在位置；在着色器中读取目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；根据目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算目标物体边缘上至少一个像素点与边缘路径的最小距离；然后基于目标物体边缘上至少一个像素点与边缘路径的最小距离，确定目标物体边缘上至少一个像素点的透明度，以实现目标物体边缘的平滑。本公开技术方案通过调用三维纹理应用程序编程接口即可实现空间VR游览时，全景图中目标物体的边缘平滑，通过将目标物体的边缘mask图贴在一个三维的承载物体上，即可在着色器中读取该边缘mask图，并根据目标物体边缘上至少一个像素点与边缘路径的距离，设置目标物体边缘上至少一个像素点的透明度，即可实现对边缘mask图中边缘毛刺的平滑处理，本公开技术方案可以不基于alpha通道对原始边缘mask做平滑处理。

下面通过附图和实施例，对本公开的技术方案做进一步的详细描述。

附图说明

构成说明书的一部分的附图描述了本公开的实施例，并且连同描述一起用于解释本公开的原理。

参照附图，根据下面的详细描述，可以更加清楚地理解本公开，其中：

图1为本公开的用于平滑物体边缘的方法的一个实施例的流程图；

图2A为本公开的基于平滑物体边缘的方法的扫光显示实施例的流程图；

图2B为本公开的图2A所示实施例的步骤202的实现流程图；

图2C为本公开的扫光显示中一帧数据中设定展示角度的边缘示意图；

图3A为本公开的确定目标物体边缘上至少一个像素点的坐标信息的实施例的流程图；

图3B为本公开的确定目标物体所在全景图示意图；

图3C为本公开的确定目标物体所在全景图的目标物体的边缘mask图；

图3D为本公开的确定目标物体所在全景图的目标物体边缘mask图的毛刺效果示意图；

图4为本公开的计算目标物体边缘上至少一个像素点与边缘路径的最小距离的实施例的流程图；

图5为本公开的用于平滑物体边缘的装置的一个实施例的结构示意图；

图6为本公开的用于平滑物体边缘的装置的又一个实施例的结构示意图；

图7为本公开一示意性实施例提供的电子设备的结构图。

具体实施方式

现在将参照附图来详细描述本公开的各种示例性实施例。应注意到：除非另外具体说明，否则在这些实施例中阐述的部件和步骤的相对布置、数字表达式和数值不限制本公开的范围。

同时，应当明白，为了便于描述，附图中所示出的各个部分的尺寸并不是按照实际的比例关系绘制的。

以下对至少一个示例性实施例的描述实际上仅仅是说明性的，决不作为对本公开及其应用或使用的任何限制。

对于相关领域普通技术人员已知的技术、方法和设备可能不作详细讨论，但在适当情况下，所述技术、方法和设备应当被视为说明书的一部分。

应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步讨论。

本公开实施例可以应用于计算机系统/服务器等电子设备，其可与众多其它通用或专用计算系统环境或配置一起操作。适于与计算机系统/服务器等电子设备一起使用的众所周知的计算系统、环境和/或配置的例子包括但不限于：个人计算机系统、服务器计算机系统、瘦客户机、厚客户机、手持或膝上设备、基于微处理器的系统、机顶盒、可编程消费电子产品、网络个人电脑、小型计算机系统、大型计算机系统和包括上述任何系统的分布式云计算技术环境，等等。

计算机系统/服务器等电子设备可以在由计算机系统执行的计算机系统可执行指令(诸如程序模块)的一般语境下描述。通常，程序模块可以包括例程、程序、目标程序、组件、逻辑、数据结构等等，它们执行特定的任务或者实现特定的抽象数据类型。计算机系统/服务器可以在分布式云计算环境中实施，分布式云计算环境中，任务是由通过通信网络链接的远程处理设备执行的。在分布式云计算环境中，程序模块可以位于包括存储设备的本地或远程计算系统存储介质上。

本公开概述

本公开实施例提供的技术方案应用于全景图空间VR游览时需要在全景图上描绘物体边缘的场景中，本公开提供一种不基于alpha通道实现边缘平滑的技术方案，为了实现该技术方案，需要浏览器能够支持WebGL，基于WebGL的三维纹理应用程序编程接口可以加载贴到承载物体表面的边缘mask图到显存中，以便渲染、展示使用，而且通过WebGL的着色器可以获取边缘mask图的目标物体边缘至少一个像素点的坐标信息以及目标物体边缘的至少一个像素点与边缘路径的最小距离，进而实现根据目标物体边缘至少一个像素点与边缘路径的最小距离设置至少一个像素点的透明度，由此通过浏览器的WebGL环境实现了全景图中目标物体的边缘平滑处理。

示例性实施例

图1为本公开的用于平滑物体边缘的方法的一个实施例的流程图；该用于平滑物体边缘的方法可以应用在电子设备(如移动终端等)上，电子设备上的浏览器需要能够支持WebGL2.0。如图1所示，该用于平滑物体边缘的方法包括以下步骤：

在步骤101中，响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在承载物体的表面，所述承载物体的中心点位置为相机所在位置。

在一实施例中，在具体执行本公开实施例之前，需要先确保浏览器支持WebGL，如果浏览器不支持，则可弹出提示信息提醒用户升级浏览器版本。

在一实施例中，用户可以在浏览器客户端界面中通过按钮的方式触发生成操作，还可以通过相关的菜单指令触发物体生成操作，生成一个承载物体。

其中，承载物体可以为一个球体，也可以为一个立方体，或者为其他形状的物体。

在一实施例中，通过赋值操作可以实现将目标物体的边缘mask图贴在承载物体的表面，然后将贴了边缘mask图的承载物体以相机所在位置为中心点放入到三维空间场景中。赋值操作是浏览器客户端的一个功能，本公开技术方案对此不作限定。

在一实施例中，为了实现本公开实施例的技术方案，需要预先离线生成目标物体的边缘mask图和目标物体的边缘路径信息。参见图3B，其示意了一幅全景图，通过相关技术中的边缘mask图的生成算法即可生成该全景图的边缘mask图，如图3C所示，该边缘mask图与全景图的分辨率相同。

需要说明的是，通过算法生成的边缘mask图通常存在毛刺现象，参见图3D中标号31和标号32示意的位置，本公开实施例可以实现对毛刺现象进行平滑处理。

需要说明的是，边缘mask图上的至少一个像素点(所有像素点)以及目标物体的边缘路径可以定义在一个归一化的图像坐标系上。

其中，目标物体的边缘路径信息可由图像坐标系上一些二维点组成，可以以二维数组的形式输入着色器。而目标物体的边缘mask图可通过贴在承载物体表面上的形式输入着色器。

在一实施例中，在将目标物体的边缘mask图在贴在承载物体表面上输入着色器时，也会向对应的着色器输入边缘mask图的像素点信息，像素点信息可以包括像素点的坐标以及对应的像素值。

在步骤102中，在着色器中读取目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息。

在一实施例中，将目标物体的边缘mask图在贴在承载物体表面输入着色器后，着色器读取目标物体的边缘mask图上每个像素点的像素点坐标，然后根据像素点坐标即可读取到对应的像素值，根据像素值确定出目标物体边缘上的像素点。例如，边缘mask图上一个像素点的坐标为(0.5,0.5)，通过输入的像素点信息，可以获取到坐标为(0.5,0.5)的像素点的像素值为RGB(1,1,1)，说明该像素点是一个白色的像素点，而由于边缘mask图中定义物体边缘显示为白色，背景显示为黑色，因此，可确定该坐标为(0.5,0.5)的像素点为目标物体边缘上的一个像素点。在着色器中读取目标物体的边缘mask图并获取到每个像素点的像素值后，即可确定出目标物体边缘的所有像素点的坐标信息。

在步骤103中，根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离。

在一实施例中，根据边缘路径path的路径信息，可以计算出边缘路径的首尾相连的多条线段，然后计算目标物体边缘上至少一个像素点与边缘路径的首尾相连的多条线段的线段距离，即可计算出目标物体边缘上至少一个像素点与边缘路径的最小距离，具体可参见图4所示实施例，这里先不详述。

在步骤104中，基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，以实现所述目标物体边缘的平滑。

在一实施例中，根据目标物体边缘上至少一个像素点与边缘路径的最小距离来计算每个像素点的透明度时，可以使用一个设定的式(1)计算出：

alpha＝1.0-k*normalize(distance(point,closedpoint)) 式(1)

式(1)中，k为一个经验值，normalize()为一个归一化函数，用于将所述至少一个像素点与所述边缘路径的最小距离进行归一化处理。

由此，通过式(1)就可以实现距离边缘路径path越远，像素点的透明度越接近0，实现一种平滑的效果。

需要说明的是，通过控制经验值k，可以改变实现平滑的速率，边缘mask图中边缘的毛刺越多，k可以设置得越大一些，以实现快速平滑。

上述步骤101～104，通过在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，所述承载物体的中心点位置为相机所在位置；在着色器中读取目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；根据目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算目标物体边缘上至少一个像素点与边缘路径的最小距离；基于目标物体边缘上至少一个像素点与边缘路径的最小距离，确定目标物体边缘上至少一个像素点的透明度，以实现目标物体边缘的平滑。本公开技术方案通过调用三维纹理应用程序编程接口即可实现空间VR游览时，全景图中目标物体的边缘平滑，通过将目标物体的边缘mask图贴在一个三维的承载物体上，即可在着色器中读取该边缘mask图，并根据目标物体边缘上至少一个像素点与边缘路径的距离，设置目标物体边缘上至少一个像素点的透明度，即可实现对边缘mask图中边缘毛刺的平滑处理，本公开技术方案可以不基于alpha通道对原始边缘mask做平滑处理。

为了更好地说明本公开的用于平滑物体边缘的的方案，下面用另一个实施例说明。

图2A为本公开的基于平滑物体边缘的方法的扫光显示实施例的流程图，图2B为本公开的图2A所示实施例的步骤202的实现流程图，图2C为本公开的扫光显示中一帧数据中设定展示角度的边缘示意图；本实施例以如何在边缘平滑的基础上实现扫光显示为例进行示例性说明，如图2A所示，包括如下步骤：

在步骤201中，接收用户触发的扫光显示操作。

在一实施例中，扫光显示是一种边缘扫光环绕感的显示效果，用户可以通过WebGL2.0的菜单命令、按钮等操作方式触发扫光显示操作。

在步骤202中，根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点。

在一实施例中，确定初始帧的扫光显示像素点的具体实现方式可参见图2B，包括以下步骤221和步骤222：

在步骤221中，计算所述目标物体边缘上至少一个像素点与所述边缘物体的中心点的连线与x轴正方向的夹角。

在步骤222中，将所述夹角在所述起点角度和终点角度之间的所述目标物体边缘上的像素点判定为所述初始帧的扫光显示像素点。

在步骤221和步骤222中，用户可以在操作界面上设置对应的起点角度和终点角度，进而可以确定初始帧的扫光显示像素点，例如，初始帧的展示角度范围是30度-90度，则可向片元着色器传入目标物体的中心点坐标(x0,y0)、起点角度30、终点角度90，片元着色器即可针对目标物体边缘的每一个像素点(x,y)，都计算像素点到中心点的连线与x轴正方向的夹角，如果夹角在30度-90度内，就渲染这个像素点，不在这个角度范围的像素点则放弃渲染，循环改变展示角度范围，就可以实现边缘扫光。

需要说明的是，除了可以直接设置起点角度和终点角度之外，也可以基于用户用户触发的操作选择一个起始点A和终点B，接着计算A点和中心点的连线与x轴的夹角得到起点角度，计算B点和中心点的连线与x轴的夹角得到终点角度，进而计算出初始帧的扫光显示像素点，后续还是基于角度进行扫光实现。

在步骤203中，按照设定展示角度、设定旋转方向，确定后续任一帧的扫光显示像素点。

其中，扫光显示可以理解为按照设定展示角度、设定旋转方向周期性地显示边缘的一部分，可以定义x轴的正方向是0度。参见图2C，设定展示角度为每一帧需要展示的角度范围，例如，图2C中对应的设定展示角度60度，图2C当前帧需要展示的是30度-90度角度(60度的展示范围)内的边缘(标号21所指示的边缘段)，其中，30度是指目标物体边缘上的像素点A到中心点O的连线与x轴正方向的夹角为30度，90度是指目标物体边缘上的像素点B到中心点O的连线与x轴正方向的夹角为90度。

而设定旋转方向则是指扫光显示的是逆时针旋转显示还是顺时针旋转显示。如果当前帧需要展示的是30度-90度角度(60度的展示范围)内的边缘，并且设定旋转方向为逆时针方向，则下一帧需要显示的边缘的角度为90度-150度角度范围内的边缘，由此可以确定每一帧需要显示的边缘，并在一个周期内完成边缘的扫光环绕感展示效果。

在步骤204中，对每一帧的扫光显示像素点进行渲染和高亮显示，放弃渲染所述目标物体边缘上的除扫光显示像素点之外的像素点。

在一实施例中，在扫光显示时，对每一帧数据中目标物体边缘，可以只渲染和高亮显示扫光显示像素点，而放弃渲染所述目标物体边缘上的所述扫光显示像素点之外的像素点，由此可实现扫光显示效果。每一帧的扫光显示像素点包括初始帧的扫光显示像素点以及后续任一帧的扫光显示像素点。

具体实现时，可通过discard函数放弃渲染扫光显示像素点之外的所述目标物体边缘上的像素点。

通过上述步骤201～步骤204，在实现了边缘平滑的基础上，可以根据设定展示角度、设定旋转方向，确定每一帧需要显示的边缘像素点，并在一个周期内完成边缘的扫光环绕感展示效果，同时也保证了边缘比较平滑；避免了相关技术中采用alpha通道的方式完成边缘平滑时不能实现边缘扫光环绕感的问题。

图3A为本公开的确定目标物体边缘上至少一个像素点的坐标信息的实施例的流程图，图3B为本公开的确定目标物体所在全景图示意图，图3C为本公开的确定目标物体所在全景图的目标物体的边缘mask图，图3D为本公开的确定目标物体所在全景图的目标物体边缘mask图的毛刺效果示意图；本实施例以如何确定目标物体边缘上至少一个像素点为例进行示例性说明，如图3A所示，包括如下步骤：

在步骤301中，在着色器中读取所述边缘mask图至少一个像素点的像素坐标。

在步骤302中，根据所述边缘mask图至少一个像素点的像素坐标，确定所述边缘mask图至少一个像素点的像素值。

在步骤303中，将所述像素值为设定值的像素点确定为所述目标物体边缘上的像素点，并将所述目标物体边缘上的像素点的坐标信息作为所述目标物体边缘上对应像素点的坐标信息。

在步骤301～步骤303中，将目标物体的边缘mask图在贴在承载物体表面输入着色器后，着色器可以读取目标物体的边缘mask图上的每个像素点的像素点坐标，根据像素点坐标即可读取到对应的像素值，像素值RGB(1,1,1)的像素点即为目标物体边缘上的像素点。例如，像素点的坐标为(0.5,0.5)，通过输入的像素点信息，可以获取到坐标为(0.5,0.5)的像素点的像素值为RGB(1,1,1)，是一个白色的像素点，而由于边缘mask图中定义白色为物体边缘，黑色为背景，则该像素点(0.5,0.5)即为目标物体边缘上的像素点。

在一实施例中，通过获取目标物体的边缘mask图的每个像素点的像素值，即可得到所有像素值为RGB(1,1,1)的像素点，也即，可以得到目标物体边缘上的像素点。

通过上述步骤301～步骤303中，通过将边缘mask图贴在一个承载物体上，即可实现着色器能够读取到边缘mask图上的每个像素点，进而根据像素点对应的像素值，即可确定出目标物体边缘。

图4为本公开的计算目标物体边缘上至少一个像素点与边缘路径的最小距离的实施例的流程图；本实施例以如何确定至少一个像素点与边缘路径的最小距离为例进行示例性说明，如图4所示，包括如下步骤：

在步骤401中，根据所述边缘路径的路径信息，计算出所述边缘路径的首尾相连的多条线段。

在一实施例中，在离线生成边缘路径后，根据边缘路径上每个二维点的坐标，可以计算出边缘路径的首尾相连的多条线段。

在步骤402中，以所述目标物体边缘上至少一个像素点为起点分别向与所述多条线段做垂线，得到所述目标物体边缘上至少一个像素点与所述多条线段的距离。

在一实施例中，通过以目标物体边缘上至少一个像素点分别向多条线段分别做垂线，可以得到到每条线段的垂足，计算每个垂足与像素点之间的距离，即得到像素点与每条线段的距离。

在步骤403中，针对所述目标物体边缘上至少一个像素点，将与所述多条线段的距离中的最小值作为与所述边缘路径的最小距离。

在一实施例中，针对目标物体边缘上至少一个像素点，都计算出了与边缘路径的每个线段的距离之后，将每个像素点对应的最小距离确定为对应像素点与边缘路径的最小距离即可。

通过上述步骤401～步骤403中，通过计算目标物体边缘上至少一个像素点与边缘路径的最小距离，可以在后续实现距离边缘路径path越远，透明度越接近0，距离边缘路径越近，透明度越接近1，由此实现目标物体边缘的平滑效果。

与前述用于平滑物体边缘的方法的实施例相对应，本公开还提供了用于平滑物体边缘的装置对应的实施例。

图5为本公开的用于平滑物体边缘的装置的一个实施例的结构示意图，该装置应用在电子设备(如计算机系统、服务器)上，电子设备支持WebGL的浏览器客户端，如图5所示，该装置包括：

第一生成模块51，用于响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，所述承载物体的中心点位置为相机所在位置；

读取模块52，用于在着色器中读取所述目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；

距离计算模块53，用于根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离；

透明度确定模块54，用于基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，以实现所述目标物体边缘的平滑。

图6为本公开的用于平滑物体边缘的装置的又一个实施例的结构示意图，如图6所示，在图5所示实施例的基础上，在一实施例中，所述读取模块52包括：

读取子模块521，用于在着色器中读取所述边缘mask图至少一个像素点的像素坐标；

像素值确定子模块522，用于根据所述边缘mask图至少一个像素点的像素坐标，确定所述边缘mask图至少一个像素点的像素值；

第一确定子模块523，用于将所述像素值为设定值的像素点确定为所述目标物体边缘上的像素点，并将所述目标物体边缘上的像素点的坐标信息作为所述目标物体边缘上对应像素点的坐标信息。

在一实施例中，所述距离计算模块53包括：

计算子模块531，用于根据所述边缘路径的路径信息，计算出所述边缘路径的首尾相连的多条线段；

垂线子模块532，用于以所述目标物体边缘上至少一个像素点为起点分别向与所述多条线段做垂线，得到所述目标物体边缘上至少一个像素点与所述多条线段的距离；

第二确定子模块533，用于针对所述目标物体边缘上至少一个像素点，将与所述多条线段的距离中的最小值作为与所述边缘路径的最小距离。

在一实施例中，所述装置还包括：

接收模块55，用于接收用户触发的扫光显示操作；

第一确定模块56，用于根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点；

第二确定模块57，用于按照设定展示角度、设定旋转方向，确定后续任一帧的扫光显示像素点；

渲染模块58，用于对每一帧的扫光显示像素点进行渲染和高亮显示，放弃渲染所述目标物体边缘上的除扫光显示像素点之外的像素点。

在一实施例中，所述第一确定模块56包括：

夹角计算子模块561，用于计算所述目标物体边缘上至少一个像素点与所述边缘物体的中心点的连线与x轴正方向的夹角；

第三确定子模块562，用于将所述夹角在所述起点角度和终点角度之间的所述目标物体边缘上的像素点判定为所述初始帧的扫光显示像素点。

在一实施例中，所述透明度确定模块54，具体用于通过式(1)计算所述目标物体边缘上至少一个像素点的透明度：

alpha＝1.0-k*normalize(distance(point,closedpoint)) 式(1)

式(1)中，k为一个经验值，normalize()为一个归一化函数，用于将所述至少一个像素点与所述边缘路径的最小距离进行归一化处理。

在一实施例中，所述装置还包括：

第二生成模块59，用于离线生成所述目标物体的边缘mask图和所述目标物体的边缘路径信息；

输入模块60，用于将所述目标物体的边缘路径信息以二维数组的形式输入所述着色器，将目标物体的边缘mask图以贴在所述承载物体表面的形式输入所述着色器。

上述装置中各个单元的功能和作用的实现过程具体详见上述方法中对应步骤的实现过程，在此不再赘述。

对于装置实施例而言，由于其基本对应于方法实施例，所以相关之处参见方法实施例的部分说明即可。以上所描述的装置实施例仅仅是示意性的，其中作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本公开方案的目的。本领域普通技术人员在不付出创造性劳动的情况下，即可以理解并实施。

下面，参考图7来描述根据本公开实施例的电子设备，其中可以集成本公开实施例实现方法的装置。图7为本公开一示意性实施例提供的电子设备的结构图，如图7所示，电子设备包括一个或多个处理器71、一个或多个计算机可读存储介质的存储器72，以及存储在存储器上并可在处理器上运行的计算机程序。在执行存储器72的程序时，可以实现上述用于平滑物体边缘的方法。

具体的，在实际应用中，该电子设备还可以包括输入装置73、输出装置74等部件，这些组件通过总线系统和/或其他形式的连接机构(未示出)互连。本领域技术人员可以理解，图7中示出的电子设备的结构并不构成对该电子设备的限定，可以包括比图示更多或更少的部件，或者某些部件，或者不同的部件布置。其中：

处理器71可以是中央处理单元(CPU)或者具有数据处理能力和/或指令执行能力的其他形式的处理单元，通过运行或执行存储在存储器72内的软件程序和/或模块，以及调用存储在存储器72内的数据，执行各种功能和处理数据，从而对该电子设备进行整体监控。

存储器72可以包括一个或多个计算机程序产品，计算机程序产品可以包括各种形式的计算机可读存储介质，例如易失性存储器和/或非易失性存储器。易失性存储器例如可以包括随机存取存储器(RAM)和/或高速缓冲存储器(cache)等。非易失性存储器例如可以包括只读存储器(ROM)、硬盘、闪存等。在计算机可读存储介质上可以存储一个或多个计算机程序指令，处理器71可以运行程序指令，以实现上文的本公开的各个实施例的用于平滑物体边缘的方法以及/或者其他期望的功能。在计算机可读存储介质中还可以存储诸如输入信号、信号分量、噪声分量等各种内容。

输入装置73可用于接收输入的数字或字符信息，以及产生与用户设置以及功能控制有关的键盘、鼠标、操作杆，光学或轨迹球信号输入。

输出装置74可以向外部输出各种信息，包括确定出的距离信息、方向信息等。该输出装置74可以包括例如显示器、扬声器、打印机、以及通信网络及其所连接的远程输出设备等等。

电子设备还可以包括给各个部件供电的电源，可以通过电源管理系统与处理器71逻辑相连，从而通过电源管理系统实现管理充电、放电，以及功耗管理等功能。电源还可以包括一个或一个以上的直流或交流电源、再充电系统、电源故障检测电路、电源转换器或者逆变器、电源状态指示器等任意组件。

当然，为了简化，图7中仅示出了该电子设备中与本公开有关的组件中的一些，省略了诸如总线、输入/输出接口等组件。除此之外，根据具体应用情况，电子设备还可以包括任何其他适当的组件。

除了上述方法和设备以外，本公开的实施例还可以是计算机程序产品，其包括计算机程序指令，所述计算机程序指令在被处理器运行时使得所述处理器执行本说明书上述“示例性方法”部分中描述的根据本公开各种实施例的用于平滑物体边缘的方法中的步骤。

所述计算机程序产品可以以一种或多种程序设计语言的任意组合来编写用于执行本公开实施例操作的程序代码，所述程序设计语言包括面向对象的程序设计语言，诸如Java、C++等，还包括常规的过程式程序设计语言，诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。

此外，本公开的实施例还可以是计算机可读存储介质，其上存储有计算机程序指令，所述计算机程序指令在被处理器运行时使得所述处理器执行本说明书上述“示例性方法”部分中描述的根据本公开各种实施例的用于平滑物体边缘的方法中的步骤。

所述计算机可读存储介质可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以包括但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

以上结合具体实施例描述了本公开的基本原理，但是，需要指出的是，在本公开中提及的优点、优势、效果等仅是示例而非限制，不能认为这些优点、优势、效果等是本公开的各个实施例必须具备的。另外，上述公开的具体细节仅是为了示例的作用和便于理解的作用，而非限制，上述细节并不限制本公开为必须采用上述具体的细节来实现。

本说明书中各个实施例均采用递进的方式描述，每个实施例重点说明的都是与其它实施例的不同之处，各个实施例之间相同或相似的部分相互参见即可。对于系统实施例而言，由于其与方法实施例基本对应，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

本领域普通技术人员可以理解：实现上述方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成，前述的程序可以存储于一计算机可读取存储介质中，该程序在执行时，执行包括上述方法实施例的步骤；而前述的存储介质包括：ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。

可能以许多方式来实现本公开的方法和装置。例如，可通过软件、硬件、固件或者软件、硬件、固件的任何组合来实现本公开的方法和装置。用于所述方法的步骤的上述顺序仅是为了进行说明，本公开的方法的步骤不限于以上具体描述的顺序，除非以其它方式特别说明。此外，在一些实施例中，还可将本公开实施为记录在记录介质中的程序，这些程序包括用于实现根据本公开的方法的机器可读指令。因而，本公开还覆盖存储用于执行根据本公开的方法的程序的记录介质。

本公开的描述是为了示例和描述起见而给出的，而并不是无遗漏的或者将本公开限于所公开的形式。很多修改和变化对于本领域的普通技术人员而言是显然的。选择和描述实施例是为了更好说明本公开的原理和实际应用，并且使本领域的普通技术人员能够理解本公开从而设计适于特定用途的带有各种修改的各种实施例。

Claims (10)

1.一种用于平滑物体边缘的方法，其特征在于，应用于支持WebGL的浏览器客户端，所述方法包括：

响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，所述承载物体的中心点位置为相机所在位置；

在着色器中读取所述目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；

根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离；

基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，以实现所述目标物体边缘的平滑。

2.根据权利要求1所述的方法，其特征在于，所述在着色器中读取所述目标物体的边缘mask图，得到所述目标物体边缘上至少一个像素点的坐标信息，包括：

在着色器中读取所述边缘mask图至少一个像素点的像素坐标；

根据所述边缘mask图至少一个像素点的像素坐标，确定所述边缘mask图至少一个像素点的像素值；

将所述像素值为设定值的像素点确定为所述目标物体边缘上的像素点，并将所述目标物体边缘上的像素点的坐标信息作为所述目标物体边缘上对应像素点的坐标信息。

3.根据权利要求1所述的方法，其特征在于，所述根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，包括：

根据所述边缘路径的路径信息，计算出所述边缘路径的首尾相连的多条线段；

以所述目标物体边缘上至少一个像素点为起点分别向与所述多条线段做垂线，得到所述目标物体边缘上至少一个像素点与所述多条线段的距离；

针对所述目标物体边缘上至少一个像素点，将与所述多条线段的距离中的最小值作为与所述边缘路径的最小距离。

4.根据权利要求1所述的方法，其特征在于，所述方法还包括：

接收用户触发的扫光显示操作；

根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点；

按照设定展示角度、设定旋转方向，确定后续任一帧的扫光显示像素点；

对每一帧的扫光显示像素点进行渲染和高亮显示，放弃渲染所述目标物体边缘上的除扫光显示像素点之外的像素点。

5.根据权利要求4所述的方法，其特征在于，所述根据所述扫光显示操作对应的起点角度和终点角度，确定初始帧的扫光显示像素点，包括：

计算所述目标物体边缘上至少一个像素点与所述边缘物体的中心点的连线与x轴正方向的夹角；

将所述夹角在所述起点角度和终点角度之间的所述目标物体边缘上的像素点判定为所述初始帧的扫光显示像素点。

6.根据权利要求1所述的方法，其特征在于，所述基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，包括：

通过式(1)计算所述目标物体边缘上至少一个像素点的透明度：

alpha＝1.0-k*normalize(distance(point,closedpoint)) 式(1)

式(1)中，k为一个经验值，normalize()为一个归一化函数，用于将所述至少一个像素点与所述边缘路径的最小距离进行归一化处理。

7.根据权利要求1所述的方法，其特征在于，所述方法还包括：

离线生成所述目标物体的边缘mask图和所述目标物体的边缘路径信息；

将所述目标物体的边缘路径信息以二维数组的形式输入所述着色器，将所述目标物体的边缘mask图以贴在所述承载物体表面的形式输入所述着色器。

8.一种用于平滑物体边缘的装置，其特征在于，应用于支持WebGL的浏览器客户端，所述装置包括：

第一生成模块，用于响应于用户触发的生成操作，在三维空间场景中生成一个承载物体，并将目标物体的边缘mask图贴在所述承载物体的表面，所述承载物体的中心点位置为相机所在位置；

读取模块，用于在着色器中读取所述目标物体的边缘mask图，得到目标物体边缘上至少一个像素点的坐标信息；

距离计算模块，用于根据所述目标物体边缘上至少一个像素点的坐标信息以及边缘路径的路径信息，计算所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离；

透明度确定模块，用于基于所述目标物体边缘上至少一个像素点与所述边缘路径的最小距离，确定所述目标物体边缘上至少一个像素点的透明度，以实现所述目标物体边缘的平滑。

9.一种电子设备，其特征在于，包括：

存储器，用于存储计算机产品；

处理器，用于执行所述存储器中存储的计算机产品，且所述计算机产品被执行时，实现上述权利要求1-7任一所述的方法。

10.一种计算机可读存储介质，其上存储有计算机指令，其特征在于，所述计算机指令被处理器执行时，实现上述权利要求1-7任一所述的方法。