CN116630510B - 一种有关圆锥渐变纹理的生成方法、设备及介质 - Google Patents
一种有关圆锥渐变纹理的生成方法、设备及介质 Download PDFInfo
- Publication number
- CN116630510B CN116630510B CN202310602313.3A CN202310602313A CN116630510B CN 116630510 B CN116630510 B CN 116630510B CN 202310602313 A CN202310602313 A CN 202310602313A CN 116630510 B CN116630510 B CN 116630510B
- Authority
- CN
- China
- Prior art keywords
- sector
- texture
- gradient
- pixel
- texture map
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 230000008859 change Effects 0.000 title claims abstract description 51
- 238000000034 method Methods 0.000 title claims abstract description 37
- 238000004364 calculation method Methods 0.000 claims abstract description 18
- 230000000694 effects Effects 0.000 claims abstract description 17
- 238000006243 chemical reaction Methods 0.000 claims abstract description 13
- 239000003086 colorant Substances 0.000 claims description 13
- 238000004422 calculation algorithm Methods 0.000 claims description 3
- 238000004040 coloring Methods 0.000 claims description 3
- 230000001419 dependent effect Effects 0.000 claims 2
- 230000000875 corresponding effect Effects 0.000 description 16
- 238000010586 diagram Methods 0.000 description 11
- 238000004590 computer program Methods 0.000 description 5
- 230000009286 beneficial effect Effects 0.000 description 3
- 230000005540 biological transmission Effects 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000003287 optical effect Effects 0.000 description 2
- 230000004456 color vision Effects 0.000 description 1
- 230000003247 decreasing effect Effects 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 230000006870 function Effects 0.000 description 1
- 230000006872 improvement Effects 0.000 description 1
- 230000008569 process Effects 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
- 230000003068 static effect Effects 0.000 description 1
- 230000009466 transformation Effects 0.000 description 1
- 230000007704 transition Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T15/00—3D [Three Dimensional] image rendering
- G06T15/04—Texture mapping
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T3/00—Geometric image transformations in the plane of the image
- G06T3/40—Scaling of whole images or parts thereof, e.g. expanding or contracting
- G06T3/4007—Scaling of whole images or parts thereof, e.g. expanding or contracting based on interpolation, e.g. bilinear interpolation
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T5/00—Image enhancement or restoration
- G06T5/70—Denoising; Smoothing
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T7/00—Image analysis
- G06T7/40—Analysis of texture
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Theoretical Computer Science (AREA)
- Computer Graphics (AREA)
- Computer Vision & Pattern Recognition (AREA)
- Image Generation (AREA)
Abstract
本发明公开了一种有关圆锥渐变纹理的生成方法、设备及介质,属于颜色配置生成技术领域,用于解决现有的扇形元素对数据做统计展示,难以动态生成且支持透明像素的平滑圆锥渐变纹理图像,难以满足不同的展示效果的技术问题。方法包括:对绘图容器进行初始化处理,得到初始化扇形纹理图;将初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图;对渐变扇形纹理图的渐变色梯度与多个扇形块进行组合转化,得到组合对照关系;基于组合对照关系,对画布中的每个像素进行线性差值计算,得到渐变扇形纹理图的像素颜色值;将像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,以满足不同纹理图片的效果展示。
Description
技术领域
本申请涉及颜色配置生成领域,尤其涉及一种有关圆锥渐变纹理的生成方法、设备及介质。
背景技术
Web浏览器中常用扇形元素对数据做统计展示,对于实现圆锥渐变效果的扇形背景,Web浏览器现有手段有各种缺陷:Canvas通过割圆法生成的圆锥渐会有明显的切割线条,直接处理每个像素在较低分辨率下会出现明显的锯齿;CSS的conic-gradient所生成的圆锥渐变无法保存为纹理图片进一步加工使用,且无法修改色彩模式;SVG仅能通过预制的渐变纹理实现圆锥渐变效果,不能满足动态变化。
现有的扇形元素对数据做统计展示,难以动态生成且支持透明像素的平滑圆锥渐变纹理图像,对于不同的展示情况,难以实现各种对应的效果。
发明内容
本申请实施例提供了一种有关圆锥渐变纹理的生成方法、设备及介质,用于解决如下技术问题:现有的扇形元素对数据做统计展示,难以动态生成且支持透明像素的平滑圆锥渐变纹理图像,难以满足不同的展示效果。
本申请实施例采用下述技术方案:
一方面,本申请实施例提供了一种有关圆锥渐变纹理的生成方法,包括:对绘图容器进行初始化处理,得到初始化扇形纹理图;将所述初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图;对所述渐变扇形纹理图的渐变色梯度与多个扇形块进行组合转化,得到组合对照关系;基于所述组合对照关系,对画布中的每个像素进行线性差值计算,得到所述渐变扇形纹理图的像素颜色值;将所述像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,以满足不同纹理图片的效果展示。
本申请实施例通过采用Canvas作为图形绘制的容器,使用WebGL着色器通过物理像素级别绘制图形降低锯齿影响,实现实时生成任意角度且支持透明像素的平滑圆锥渐变纹理图片,纹理图片能够方便的进行加工并和格式转化,通过简单的参数配置就可以动态生成支持透明像素的平滑圆锥渐变纹理图片,以满足不同的效果展示。
在一种可行的实施方式中,对绘图容器进行初始化处理,得到初始化扇形纹理图,具体包括:获取Web浏览器中的Canvas元素,并将所述Canvas元素确定为绘图容器;其中,所述Canvas元素的宽度以及高度为最终输出纹理图片的尺寸标准;获取Web浏览器中的webGL控制实例;通过所述webGL控制实例中的API,对所述绘图容器中的着色程序、着色缓冲区以及顶点数据进行初始化处理,得到初始化绘图数据;基于所述初始化绘图数据,对扇形纹理图进行初始化配置,得到所述初始化扇形纹理图。
在一种可行的实施方式中,在将所述初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图之前,所述方法还包括:根据画布的中心点,确定出有关所述画布的直角坐标系;将所述初始化扇形纹理图与所述直角坐标系进行相互结合,得到扇形纹理直角坐标系。
在一种可行的实施方式中,将所述初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图,具体包括:根据所述扇形纹理直角坐标系,确定出所述扇形纹理图像的角度参数;其中,所述角度参数至少包括:起始角度、结束角度以及轴向夹角;对所述初始化扇形纹理图进行扇形半径的数据获取,得到扇形半径数据;其中,所述扇形半径数据至少包括:内圆半径以及外圆半径;基于渐变颜色线性图形,确定出符合所述初始化扇形纹理图的渐变色线性数据;根据有关色彩的RGB类型以及HSL类型,对所述初始化扇形纹理图进行色彩像素的表达转化,得到所述初始化扇形纹理图的色彩模式类型;基于所述角度参数、所述扇形半径数据、所述渐变色线性数据以及所述色彩模式类型,对所述初始化扇形纹理图进行数据的对应定义配置,得到所述渐变扇形纹理图。
在一种可行的实施方式中,对所述渐变扇形纹理图的渐变色梯度与多个扇形块进行组合转化,得到组合对照关系,具体包括:对所述渐变扇形纹理图进行扇形块的划分,得到多个扇形块;将所述渐变扇形纹理图中的渐变色线性数据转化为渐变色梯度数据;并根据所述渐变色梯度数据,确定出渐变色比例区间;基于所述渐变色比例区间,并根据所述多个扇形块在所述渐变扇形纹理图中的位置与角度占比,对于所述渐变色梯度数据进行有关渐变色的相互组合,得到有关渐变扇形纹理图中渐变色的组合对照关系。
在一种可行的实施方式中,基于所述组合对照关系,对画布中的每个像素进行线性差值计算,得到所述渐变扇形纹理图的像素颜色值,具体包括:根据扇形纹理直角坐标系,获取所述扇形纹理直角坐标系中的像素位置向量;通过向量的叉乘以及点乘算法,对所述像素位置向量进行坐标轴的偏转计算,得到像素偏转角度;将所述像素偏转角度与所述渐变扇形纹理图中的起始角度进行差值处理,得到差值角度,并确定出与所述差值角度所对应的组合对照关系;基于所对应的组合对照关系,并根据所述像素偏转角度在多个扇形块中的偏移位置,对画布中每个像素的像素位置进行线性差值计算,得到所述渐变扇形纹理图中每个组合对照关系的像素颜色值。
在一种可行的实施方式中,在根据所述像素偏转角度在多个扇形块中的偏移位置,对画布中的每个像素进行线性差值计算之后,所述方法还包括:对所述组合对照关系中每个像素的像素位置与所述扇形纹理直角坐标系中的原点坐标进行相对距离的比对判断;若所述相对距离小于内圆半径且大于外圆半径,则所述像素颜色值不具备绘图颜色的输出;否则,所述像素颜色值具备绘图颜色的输出;若所述像素颜色值不存在于任何一个扇形块,则所述像素颜色值不具备绘图颜色的输出。
在一种可行的实施方式中,将所述像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,具体包括:通过所述绘图容器中的toDataURL,将所述像素颜色值进行有关base64数据的数据转换,以使所述像素颜色值进行绘图颜色输出,得到所述平滑圆锥渐变纹理图。
第二方面,本申请实施例还提供了一种有关圆锥渐变纹理的生成设备,所述设备包括:至少一个处理器;以及,与所述至少一个处理器通信连接的存储器;其中,所述存储器存储有能够被所述至少一个处理器执行的指令,以使所述至少一个处理器能够执行上述任一实施方式所述的一种有关圆锥渐变纹理的生成方法。
第三方面,本申请实施例还提供了一种非易失性计算机存储介质,其特征在于,所述存储介质为非易失性计算机可读存储介质,所述非易失性计算机可读存储介质存储有至少一个程序,每个所述程序包括指令,所述指令当被终端执行时,使所述终端执行上述任一实施方式所述的一种有关圆锥渐变纹理的生成方法。
本申请提供了一种有关圆锥渐变纹理的生成方法、设备及介质,通过采用Canvas作为图形绘制的容器,使用WebGL着色器通过物理像素级别绘制图形降低锯齿影响,实现实时生成任意角度且支持透明像素的平滑圆锥渐变纹理图片,纹理图片能够方便的进行加工并和格式转化,通过简单的参数配置就可以动态生成支持透明像素的平滑圆锥渐变纹理图片,以满足不同的效果展示。
附图说明
为了更清楚地说明本申请实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本申请中记载的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。在附图中:
图1为本申请实施例提供的一种有关圆锥渐变纹理的生成方法流程图;
图2为本申请实施例提供的一种扇形纹理直角坐标系示意图;
图3为本申请实施例提供的一种渐变颜色线性图形示意图;
图4为本申请实施例提供的一种色彩模式渐变效果示意图;
图5为本申请实施例提供的一种有关圆锥渐变纹理的生成设备的结构示意图。
具体实施方式
为了使本技术领域的人员更好地理解本申请中的技术方案,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本说明书实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都应当属于本申请保护的范围。
本申请实施例提供了一种有关圆锥渐变纹理的生成方法,如图1所示,有关圆锥渐变纹理的生成方法具体包括步骤S101-S105:
S101、对绘图容器进行初始化处理,得到初始化扇形纹理图。
具体地,先获取Web浏览器中的Canvas元素,并将Canvas元素确定为绘图容器。其中,Canvas元素的宽度以及高度为最终输出纹理图片的尺寸标准;获取Web浏览器中的webGL控制实例。
进一步地,通过webGL控制实例中的API,对绘图容器中的着色程序、着色缓冲区以及顶点数据进行初始化处理,得到初始化绘图数据。
进一步地,基于初始化绘图数据,对扇形纹理图进行初始化配置,得到初始化扇形纹理图。
在一个实施例中,从Web浏览器的页面获取Canvas元素作为绘图容器,为其设置宽度和高度,Canvas的宽度和高度为最终输出的图片的尺寸,获取webGL控制实例,再通过webGL控制实例提供的API初始化着色器程序和缓冲区以及顶点数据,然后对扇形纹理图进行初始化配置,得到初始化扇形纹理图。
S102、将初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图。
具体地,根据画布的中心点,确定出有关画布的直角坐标系。再将初始化扇形纹理图与直角坐标系进行相互结合,得到扇形纹理直角坐标系。
在一个实施例中,图2为本申请实施例提供的一种扇形纹理直角坐标系示意图,如图2所示,该扇形纹理直角坐标系包括:画布宽度、画布高度、起始角度以及结束角度等等。其中,对绘图数据的计算是在以画布为中心建立的平面直角坐标系基础上。画布和初始化扇形纹理图在以画布为中心建立的直角坐标系中的的绘制关系。
进一步地,根据扇形纹理直角坐标系,确定出扇形纹理图像的角度参数。其中,角度参数至少包括:起始角度、结束角度以及轴向夹角。对初始化扇形纹理图进行扇形半径的数据获取,得到扇形半径数据。其中,扇形半径数据至少包括:内圆半径以及外圆半径。基于渐变颜色线性图形,确定出符合初始化扇形纹理图的渐变色线性数据。根据有关色彩的RGB类型以及HSL类型,对初始化扇形纹理图进行色彩像素的表达转化,得到初始化扇形纹理图的色彩模式类型。
在一个实施例中,如图2所示,确定出扇形纹理图像的角度参数,包括:起始角度StartAngle,结束角度EndAngle,在扇形纹理直角坐标系中,x轴表示的角度为0,顺时针变大,逆时针减小,实际可接受的值范围是正负有理数,StartAngle、EndAngle表示顺时针与x轴正向的夹角。对初始化扇形纹理图进行扇形半径的数据获取,得到扇形半径数据,包括:内圆半径ra,外圆半径rb,范围都是[0,1]。
在一个实施例中,图3为本申请实施例提供的一种渐变颜色线性图形示意图,如图3所示,基于渐变颜色线性图形,确定出符合初始化扇形纹理图的渐变色线性数据,即在0~1一个单位内表述颜色渐变,初始化扇形纹理图包含了多个渐变色组合的端点情况,比如0表示绿色、0.2表示红色、0.4表示蓝色、1.0表示黄色,两个端点确定一种渐变色组合。
在一个实施例中,图4为本申请实施例提供的一种色彩模式渐变效果示意图,如图4所示,图中左侧的扇形纹理图为RGBA渐变图,图中右侧的扇形纹理图为HSLA渐变图。RGB类型或HSL类型是为了支持透明像素,还需要加上透明像素表达符号变为RGBA和HSLA,而RGB更适合显示系统,HSL能更接近真实的色彩感知,从而使得更加明亮。
进一步地,基于角度参数、扇形半径数据、渐变色线性数据以及色彩模式类型,对初始化扇形纹理图进行数据的对应定义配置,得到渐变扇形纹理图。
S103、对渐变扇形纹理图的渐变色梯度与多个扇形块进行组合转化,得到组合对照关系。
具体地,先对渐变扇形纹理图进行扇形块的划分,得到多个扇形块。再将渐变扇形纹理图中的渐变色线性数据转化为渐变色梯度数据。并根据渐变色梯度数据,确定出渐变色比例区间。
进一步地,基于渐变色比例区间,并根据多个扇形块在渐变扇形纹理图中的位置与角度占比,对于渐变色梯度数据进行有关渐变色的相互组合,得到有关渐变扇形纹理图中渐变色的组合对照关系。
在一个实施例中,如图2所示,将起始角度与结束角度首先进行2π处理,限制在[-2π,2π]范围,为了减小差值,将较小的值作为起始角度,较大的值作为结束角度。对渐变扇形纹理图进行扇形块的划分,得到多个扇形块,包含了多种颜色渐变的扇形可以看作将原有扇形分为多个扇形块,每个扇形块使用不同的渐变色组合。根据渐变色配置转化成渐变色梯度,确定出渐变色比例区间,即由原来渐变色线性数据中的描述渐变组合端点形式,转为以比例区间描述渐变色形式。然后基于渐变色比例区间,并根据多个扇形块在渐变扇形纹理图中的位置与角度占比,即根据多个扇形块在原有渐变扇形纹理图中的位置和角度占比确定每个扇形块所对应的渐变色组合,最终确定出有关渐变扇形纹理图中渐变色的组合对照关系。
在一个实施例中,关于渐变扇形纹理图中渐变色的组合对照关系,即渐变颜色的组合配置,如图3所示,可用0表示绿色、0.2表示红色、0.4表示蓝色、1.0表示黄色等等。转为渐变色梯度为:0~0.2使用绿色~红色的渐变色组合,0.2~0.4使用红色~蓝色的渐变色组合,0.4~1.0使用蓝色~黄色的渐变色组合。然后对扇形区域划分,得到的每个扇形块和渐变色组合的对照关系为:扇形块的角度范围在0π~0.2π之间,使用绿色~红色的渐变色组合,扇形块的角度范围在0.2π~0.4π之间,使用红色~蓝色的渐变色组合,扇形块的角度范围在0.4π~1.0π之间,使用蓝色~黄色的渐变色组合。然后基于渐变色比例区间,并根据多个扇形块在渐变扇形纹理图中的位置与角度占比,对于渐变色梯度数据进行有关渐变色的相互组合,得到的组合对照关系再写入webGl的缓冲区用以绘图计算等。
S104、基于组合对照关系,对画布中的每个像素进行线性差值计算,得到渐变扇形纹理图的像素颜色值。
具体地,根据扇形纹理直角坐标系,获取扇形纹理直角坐标系中的像素位置向量。然后通过向量的叉乘以及点乘算法,对像素位置向量进行坐标轴的偏转计算,得到像素偏转角度。
进一步地,将像素偏转角度与渐变扇形纹理图中的起始角度进行差值处理,得到差值角度,并确定出与差值角度所对应的组合对照关系。
进一步地,基于所对应的组合对照关系,并根据像素偏转角度在多个扇形块中的偏移位置,对画布中每个像素的像素位置进行线性差值计算,得到渐变扇形纹理图中每个组合对照关系的像素颜色值。
其中,在根据像素偏转角度在多个扇形块中的偏移位置,对画布中的每个像素进行线性差值计算之后,对组合对照关系中每个像素的像素位置与扇形纹理直角坐标系中的原点坐标进行相对距离的比对判断。若相对距离小于内圆半径且大于外圆半径,则像素颜色值不具备绘图颜色的输出。否则,像素颜色值具备绘图颜色的输出。若像素颜色值不存在于任何一个扇形块,则像素颜色值不具备绘图颜色的输出。
在一个实施例中,计算像素偏转角度和起始角度之间的差值,得到像素所属的扇形块和对应的组合对照关系,并根据像素偏转角度在对应扇形块中的偏移情况,即以像素偏转角度相对扇形块起始角度的偏转距离作为线性插值参考值,对组合对照关系中渐变色组合的颜色A以及颜色B使用线性插值计算,得到渐变扇形纹理图中每个组合对照关系的像素颜色值,比如:扇形块角度为π,像素相对于扇形块起始边的偏转角为0.6π,渐变色组合以RGBA表述为红色rgba(255,0,0,255)到蓝色rgba(0,0,255,0,255),则该像素位置在扇形块中,即0.6(0.6π/π)的相对位置,线性插值得到像素颜色值为rgba(102,0,153,255)。然后再计算每个像素的像素位置与扇形纹理直角坐标系中原点坐标的相对距离,如果该相对距离不符合大于内圆半径以及小于外圆半径的话,或者不属于任何对应的扇形块的像素颜色值,则像素颜色值不具备绘图颜色的输出。
S105、将像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,以满足不同纹理图片的效果展示。
具体地,通过绘图容器中的toDataURL,将像素颜色值进行有关base64数据的数据转换,以使像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图。
另外,本申请实施例还提供了一种有关圆锥渐变纹理的生成设备,如图5所示,有关圆锥渐变纹理的生成设备500具体包括:
至少一个处理器501;以及,与至少一个处理器501通信连接的存储器502;其中,存储器502存储有能够被至少一个处理器501执行的指令,以使至少一个处理器501能够执行:
对绘图容器进行初始化处理,得到初始化扇形纹理图;
将初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图;
对渐变扇形纹理图的渐变色梯度与多个扇形块进行组合转化,得到组合对照关系;
基于组合对照关系,对画布中的每个像素进行线性差值计算,得到渐变扇形纹理图的像素颜色值;
将像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,以满足不同纹理图片的效果展示。
本申请提供了一种有关圆锥渐变纹理的生成方法、设备及介质,通过采用Canvas作为图形绘制的容器,使用WebGL着色器通过物理像素级别绘制图形降低锯齿影响,实现实时生成任意角度且支持透明像素的平滑圆锥渐变纹理图片,纹理图片能够方便的进行加工并和格式转化,通过简单的参数配置就可以动态生成支持透明像素的平滑圆锥渐变纹理图片,以满足不同的效果展示。
本申请中的各个实施例均采用递进的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。尤其,对于设备、非易失性计算机存储介质实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
本申请实施例提供的设备和介质与方法是一一对应的,因此,设备和介质也具有与其对应的方法类似的有益技术效果,由于上面已经对方法的有益技术效果进行了详细说明,因此,这里不再赘述设备和介质的有益技术效果。
本领域内的技术人员应明白,本申请的实施例可提供为方法、系统、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
内存可能包括计算机可读介质中的非永久性存储器,随机存取存储器(RAM)和/或非易失性内存等形式,如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括,但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带,磁带磁盘存储或其他磁性存储设备或任何其他非传输介质,可用于存储可以被计算设备访问的信息。按照本文中的界定,计算机可读介质不包括暂存电脑可读媒体(transitory media),如调制的数据信号和载波。
上述对本申请特定实施例进行了描述。其它实施例在所附权利要求书的范围内。在一些情况下,在权利要求书中记载的动作或步骤可以按照不同于实施例中的顺序来执行并且仍然可以实现期望的结果。另外,在附图中描绘的过程不一定要求示出的特定顺序或者连续顺序才能实现期望的结果。在某些实施方式中,多任务处理和并行处理也是可以的或者可能是有利的。
以上所述仅为本申请的实施例而已,并不用于限制本申请。对于本领域技术人员来说,本申请的实施例可以有各种更改和变化。凡在本申请实施例的精神和原理之内所作的任何修改、等同替换、改进等,均应包含在本申请的权利要求范围之内。
Claims (5)
1.一种有关圆锥渐变纹理的生成方法,其特征在于,所述方法包括:
对绘图容器进行初始化处理,得到初始化扇形纹理图,具体包括:
获取Web浏览器中的Canvas元素,并将所述Canvas元素确定为绘图容器;其中,所述Canvas元素的宽度以及高度为最终输出纹理图片的尺寸标准;
获取Web浏览器中的webGL控制实例;
通过所述webGL控制实例中的API,对所述绘图容器中的着色程序、着色缓冲区以及顶点数据进行初始化处理,得到初始化绘图数据;
基于所述初始化绘图数据,对扇形纹理图进行初始化配置,得到所述初始化扇形纹理图;
将所述初始化扇形纹理图进行有关扇形纹理图像参数的对应转化,得到渐变扇形纹理图,具体包括:
根据画布的中心点,确定出有关所述画布的直角坐标系;
将所述初始化扇形纹理图与所述直角坐标系进行相互结合,得到扇形纹理直角坐标系;
根据所述扇形纹理直角坐标系,确定出所述扇形纹理图像的角度参数;其中,所述角度参数至少包括:起始角度、结束角度以及轴向夹角;
对所述初始化扇形纹理图进行扇形半径的数据获取,得到扇形半径数据;其中,所述扇形半径数据至少包括:内圆半径以及外圆半径;
基于渐变颜色线性图形,确定出符合所述初始化扇形纹理图的渐变色线性数据;
根据有关色彩的RGB类型以及HSL类型,对所述初始化扇形纹理图进行色彩像素的表达转化,得到所述初始化扇形纹理图的色彩模式类型;
基于所述角度参数、所述扇形半径数据、所述渐变色线性数据以及所述色彩模式类型,对所述初始化扇形纹理图进行数据的对应定义配置,得到所述渐变扇形纹理图;
对所述渐变扇形纹理图的渐变色梯度与多个扇形块进行组合转化,得到组合对照关系,具体包括:
对所述渐变扇形纹理图进行扇形块的划分,得到多个扇形块;
将所述渐变扇形纹理图中的渐变色线性数据转化为渐变色梯度数据;并根据所述渐变色梯度数据,确定出渐变色比例区间;
基于所述渐变色比例区间,并根据所述多个扇形块在所述渐变扇形纹理图中的位置与角度占比,对于所述渐变色梯度数据进行有关渐变色的相互组合,得到有关渐变扇形纹理图中渐变色的组合对照关系;
基于所述组合对照关系,对画布中的每个像素进行线性差值计算,得到所述渐变扇形纹理图的像素颜色值,具体包括:
根据扇形纹理直角坐标系,获取所述扇形纹理直角坐标系中的像素位置向量;
通过向量的叉乘以及点乘算法,对所述像素位置向量进行坐标轴的偏转计算,得到像素偏转角度;
将所述像素偏转角度与所述渐变扇形纹理图中的起始角度进行差值处理,得到差值角度,并确定出与所述差值角度所对应的组合对照关系;
基于所对应的组合对照关系,并根据所述像素偏转角度在多个扇形块中的偏移位置,对画布中每个像素的像素位置进行线性差值计算,得到所述渐变扇形纹理图中每个组合对照关系的像素颜色值;
将所述像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,以满足不同纹理图片的效果展示。
2.根据权利要求1所述的一种有关圆锥渐变纹理的生成方法,其特征在于,在根据所述像素偏转角度在多个扇形块中的偏移位置,对画布中的每个像素进行线性差值计算之后,所述方法还包括:
对所述组合对照关系中每个像素的像素位置与所述扇形纹理直角坐标系中的原点坐标进行相对距离的比对判断;
若所述相对距离小于内圆半径且大于外圆半径,则所述像素颜色值不具备绘图颜色的输出;否则,所述像素颜色值具备绘图颜色的输出;
若所述像素颜色值不存在于任何一个扇形块,则所述像素颜色值不具备绘图颜色的输出。
3.根据权利要求1所述的一种有关圆锥渐变纹理的生成方法,其特征在于,将所述像素颜色值进行绘图颜色输出,得到平滑圆锥渐变纹理图,具体包括:
通过所述绘图容器中的toDataURL,将所述像素颜色值进行有关base64数据的数据转换,以使所述像素颜色值进行绘图颜色输出,得到所述平滑圆锥渐变纹理图。
4.一种有关圆锥渐变纹理的生成设备,其特征在于,所述设备包括:
至少一个处理器;以及,
与所述至少一个处理器通信连接的存储器;其中,
所述存储器存储有能够被所述至少一个处理器执行的指令,以使所述至少一个处理器能够执行根据权利要求1-3任一项所述的一种有关圆锥渐变纹理的生成方法。
5.一种非易失性计算机存储介质,其特征在于,所述存储介质为非易失性计算机可读存储介质,所述非易失性计算机可读存储介质存储有至少一个程序,每个所述程序包括指令,所述指令当被终端执行时,使所述终端执行根据权利要求1-3任一项所述的一种有关圆锥渐变纹理的生成方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310602313.3A CN116630510B (zh) | 2023-05-24 | 2023-05-24 | 一种有关圆锥渐变纹理的生成方法、设备及介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310602313.3A CN116630510B (zh) | 2023-05-24 | 2023-05-24 | 一种有关圆锥渐变纹理的生成方法、设备及介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN116630510A CN116630510A (zh) | 2023-08-22 |
CN116630510B true CN116630510B (zh) | 2024-01-26 |
Family
ID=87596897
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202310602313.3A Active CN116630510B (zh) | 2023-05-24 | 2023-05-24 | 一种有关圆锥渐变纹理的生成方法、设备及介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN116630510B (zh) |
Citations (11)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108305315A (zh) * | 2018-01-24 | 2018-07-20 | 珠江水利委员会珠江水利科学研究院 | 一种基于wpf的三维地形高效渐变着色方法 |
CN110443877A (zh) * | 2019-08-06 | 2019-11-12 | 网易(杭州)网络有限公司 | 模型渲染的方法、装置、终端设备和存储介质 |
CN110634169A (zh) * | 2019-01-08 | 2019-12-31 | 华为技术有限公司 | 图像处理的装置和方法 |
CN110942505A (zh) * | 2019-09-05 | 2020-03-31 | 北京无线电测量研究所 | 一种雷达一次信息渲染方法、系统、介质及设备 |
CN111951345A (zh) * | 2020-08-10 | 2020-11-17 | 杭州趣维科技有限公司 | 一种基于gpu的实时图像视频油画风格化方法 |
CN112767508A (zh) * | 2021-01-18 | 2021-05-07 | 赛诺联合医疗科技(北京)有限公司 | 针对呼吸门控图像的伪彩显示方法、系统、设备以及介质 |
CN112991366A (zh) * | 2021-02-18 | 2021-06-18 | 广州光锥元信息科技有限公司 | 对图像进行实时色度抠图的方法、装置及移动端 |
CN113593027A (zh) * | 2021-08-02 | 2021-11-02 | 四川汉科计算机信息技术有限公司 | 一种三维航电显控界面装置 |
WO2022012085A1 (zh) * | 2020-07-15 | 2022-01-20 | 北京沃东天骏信息技术有限公司 | 人脸图像处理方法、装置、存储介质及电子设备 |
CN114219902A (zh) * | 2021-07-22 | 2022-03-22 | 江苏及象生态环境研究院有限公司 | 气象数据的体绘制渲染方法、装置和计算机设备 |
CN114463344A (zh) * | 2021-12-20 | 2022-05-10 | 北京镁伽科技有限公司 | 渐变图像的生成方法、生成装置及图像信号发生器 |
Family Cites Families (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US8081187B2 (en) * | 2006-11-22 | 2011-12-20 | Autodesk, Inc. | Pencil strokes for vector based drawing elements |
US8203564B2 (en) * | 2007-02-16 | 2012-06-19 | Qualcomm Incorporated | Efficient 2-D and 3-D graphics processing |
US9449362B2 (en) * | 2013-09-06 | 2016-09-20 | Intel Corporation | Techniques for reducing accesses for retrieving texture images |
-
2023
- 2023-05-24 CN CN202310602313.3A patent/CN116630510B/zh active Active
Patent Citations (11)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108305315A (zh) * | 2018-01-24 | 2018-07-20 | 珠江水利委员会珠江水利科学研究院 | 一种基于wpf的三维地形高效渐变着色方法 |
CN110634169A (zh) * | 2019-01-08 | 2019-12-31 | 华为技术有限公司 | 图像处理的装置和方法 |
CN110443877A (zh) * | 2019-08-06 | 2019-11-12 | 网易(杭州)网络有限公司 | 模型渲染的方法、装置、终端设备和存储介质 |
CN110942505A (zh) * | 2019-09-05 | 2020-03-31 | 北京无线电测量研究所 | 一种雷达一次信息渲染方法、系统、介质及设备 |
WO2022012085A1 (zh) * | 2020-07-15 | 2022-01-20 | 北京沃东天骏信息技术有限公司 | 人脸图像处理方法、装置、存储介质及电子设备 |
CN111951345A (zh) * | 2020-08-10 | 2020-11-17 | 杭州趣维科技有限公司 | 一种基于gpu的实时图像视频油画风格化方法 |
CN112767508A (zh) * | 2021-01-18 | 2021-05-07 | 赛诺联合医疗科技(北京)有限公司 | 针对呼吸门控图像的伪彩显示方法、系统、设备以及介质 |
CN112991366A (zh) * | 2021-02-18 | 2021-06-18 | 广州光锥元信息科技有限公司 | 对图像进行实时色度抠图的方法、装置及移动端 |
CN114219902A (zh) * | 2021-07-22 | 2022-03-22 | 江苏及象生态环境研究院有限公司 | 气象数据的体绘制渲染方法、装置和计算机设备 |
CN113593027A (zh) * | 2021-08-02 | 2021-11-02 | 四川汉科计算机信息技术有限公司 | 一种三维航电显控界面装置 |
CN114463344A (zh) * | 2021-12-20 | 2022-05-10 | 北京镁伽科技有限公司 | 渐变图像的生成方法、生成装置及图像信号发生器 |
Non-Patent Citations (2)
Title |
---|
一种基于轮廓提取与纹理分析的图像着色方法;金舟 等;《计算机应用研究》;第第28卷卷(第第12期期);全文 * |
基于渐变纹理贴图的机载图形显示抗锯齿方法研究;郑悦 等;《无线互联科技》(第第15期期);全文 * |
Also Published As
Publication number | Publication date |
---|---|
CN116630510A (zh) | 2023-08-22 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
JP6678209B2 (ja) | 非正規直交グリッドへのテクスチャマッピングのためのグラデーションの調整 | |
US11908107B2 (en) | Method and apparatus for presenting image for virtual reality device, device and non-transitory computer-readable storage medium | |
WO2006080115A1 (ja) | 描画方法、画像生成装置、および電子情報機器 | |
WO2006048961A1 (ja) | 描画処理装置および描画処理方法 | |
KR20160051154A (ko) | 렌더링 방법, 렌더링 장치 및 전자 장치 | |
US10504419B2 (en) | Data converting method and apparatus, and computer-readable storage medium | |
US9639920B2 (en) | Dither directed LUT output value interpolation | |
CN108122196B (zh) | 图片的纹理贴图方法和装置 | |
CN109584366B (zh) | 一种地形渲染方法、装置、设备及可读存储介质 | |
US10582089B2 (en) | Image data interpolation | |
KR100745768B1 (ko) | 전력 소비를 감소시키기 위한 lod 값 계산 방법과이것을 이용한 3차원 렌더링 시스템 | |
CN110866965A (zh) | 一种三维模型的贴图绘制方法及装置 | |
CN107038729B (zh) | 一种基于OpenGL-ES的数字仪表盘绘制方法 | |
KR100723421B1 (ko) | 포인트 보간에 의한 렌더링 방법, 포인트 보간에 의한 렌더링 장치 및 기록매체 | |
CN109643462B (zh) | 基于渲染引擎的实时图像处理方法以及显示设备 | |
US20150062115A1 (en) | Contour gradients using three-dimensional models | |
JP3547250B2 (ja) | 描画方法 | |
CN116630510B (zh) | 一种有关圆锥渐变纹理的生成方法、设备及介质 | |
JP7460641B2 (ja) | 光強度画像を生成するための装置及び方法 | |
KR20080071377A (ko) | 렌더링 장치 및 방법 | |
US11164373B2 (en) | Graphics processing apparatus | |
CN112785699A (zh) | 图像绘制方法与设备 | |
CN109544483B (zh) | 视频图像亮度、对比度增强方法及装置 | |
KR101748397B1 (ko) | OpenGL을 이용한 AVM용 LUT 생성 방법 | |
US9449579B2 (en) | Systems and methods for mapping color data |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |