欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

webgl中如何做YUV数据的裁剪

程序员文章站 2022-03-22 08:22:23
针对有裁剪信息的码流(1088,768),在进行渲染之前需要进行YUV数据的裁剪,因为裁剪区域的码流为冗余数据,如果不进行裁剪,渲染出来将有蓝边或紫边状态。在将YUV数据上传到纹理前进行YUV的裁剪。即https://blog.csdn.net/qq_34754747/article/details/107281312 webgl渲染过程中的步骤:上传YUV数据到纹理updateFrameDataupdateFrameData = function(oWidth,oHeight,dat.....

针对有裁剪信息的码流(1088,768),在进行渲染之前需要进行YUV数据的裁剪,因为裁剪区域的码流为冗余数据,如果不进行裁剪,渲染出来将有蓝边或紫边状态。

在将YUV数据上传到纹理前进行YUV的裁剪。

https://blog.csdn.net/qq_34754747/article/details/107281312  webgl渲染过程中的

步骤:上传YUV数据到纹理 updateFrameData

updateFrameData = function(oWidth,oHeight,data,crop_left,crop_right,crop_top,crop_bottom)
{
    var i420Data = data;
    var dWidth = oWidth - crop_left - crop_right;
    var dHeight = oHeight - crop_top - crop_bottom;
    
    var yDataLength = dWidth * dHeight;//实际的长度
    var yData = i420Data.subarray(0, yDataLength);//从原始
    gl.activeTexture(gl.TEXTURE0);//激活纹理单元
    gl.bindTexture(gl.TEXTURE_2D, yTextureRef);//绑定纹理
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, dWidth, dHeight, 0, gl.LUMINANCE, gl.UNSIGNED_BYTE, yData);//指定纹理的绑定对象

    var cbDataLength = dWidth/2 * dHeight/2;
    var cbData = i420Data.subarray(width*height, width*height + cbDataLength);//从原始位置拷贝实际长度
    gl.activeTexture(gl.TEXTURE1);
    gl.bindTexture(gl.TEXTURE_2D, uTextureRef);
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, dWidth/2, dHeight/2, 0, gl.LUMINANCE, gl.UNSIGNED_BYTE, cbData);

    var crDataLength = cbDataLength;
    var crData = i420Data.subarray(width*height + width*height/4, width*height + width*height/4 + crDataLength);//从原始位置拷贝实际长度
    gl.activeTexture(gl.TEXTURE2);
    gl.bindTexture(gl.TEXTURE_2D, vTextureRef);
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, dWidth/2, dHeight/2, 0, gl.LUMINANCE, gl.UNSIGNED_BYTE, crData);
}

 

本文地址:https://blog.csdn.net/qq_34754747/article/details/107281226