将方形图像纹理映射到圆形 OpenGl

Question

我正在尝试将钟面的方形图像映射到我创建的圆 GL_POLYGON 上。我目前正在使用以下代码：

        float angle, radian, x, y, xcos, ysin, tx, ty;       

        glEnable(GL_TEXTURE_2D);
        glBindTexture(GL_TEXTURE_2D, an_face_texture1);

        glBegin(GL_POLYGON);

        for (angle=0.0; angle<360.0; angle+=2.0)
        {
            radian = angle * (pi/180.0f);

            xcos = (float)cos(radian);
            ysin = (float)sin(radian);
            x = xcos * radius;
            y = ysin * radius;
            tx = (x/radius + 1)*0.5;
            ty = (y/radius + 1)*0.5;

            glTexCoord2f(tx, ty);
            glVertex2f(x, y);           
        }

        glEnd();
        glDisable(GL_TEXTURE_2D);

然而，当我这样做时，我最终得到了一个奇怪的重叠图像效果。如图所示： The original texture image is however the corners are cut out and it is png format. This way of generating the texture coordinates and is took from a previous answer: HERE

下面是用于加载图像的代码：

#ifndef PNGLOAD_H

#include <png.h>
#include <stdlib.h>

int png_load(const char* file_name, 
             int* width, 
             int* height, 
             char** image_data_ptr)
{
png_byte header[8];

FILE* fp = fopen(file_name, "rb");
if (fp == 0)
{
    fprintf(stderr, "erro: could not open PNG file %s\n", file_name);
    perror(file_name);
    return 0;
}

// read the header
fread(header, 1, 8, fp);

if (png_sig_cmp(header, 0, 8))
{
    fprintf(stderr, "error: %s is not a PNG.\n", file_name);
    fclose(fp);
    return 0;
}

png_structp png_ptr = png_create_read_struct(PNG_LIBPNG_VER_STRING, NULL, NULL, NULL);
if (!png_ptr)
{
    fprintf(stderr, "error: png_create_read_struct returned 0.\n");
    fclose(fp);
    return 0;
}

// create png info struct
png_infop info_ptr = png_create_info_struct(png_ptr);
if (!info_ptr)
{
    fprintf(stderr, "error: png_create_info_struct returned 0.\n");
    png_destroy_read_struct(&png_ptr, (png_infopp)NULL, (png_infopp)NULL);
    fclose(fp);
    return 0;
}

// create png info struct
png_infop end_info = png_create_info_struct(png_ptr);
if (!end_info)
{
    fprintf(stderr, "error: png_create_info_struct returned 0.\n");
    png_destroy_read_struct(&png_ptr, &info_ptr, (png_infopp) NULL);
    fclose(fp);
    return 0;
}

// the code in this if statement gets called if libpng encounters an error
if (setjmp(png_jmpbuf(png_ptr))) {
    fprintf(stderr, "error from libpng\n");
    png_destroy_read_struct(&png_ptr, &info_ptr, &end_info);
    fclose(fp);
    return 0;
}

// init png reading
png_init_io(png_ptr, fp);

// let libpng know you already read the first 8 bytes
png_set_sig_bytes(png_ptr, 8);

// read all the info up to the image data
png_read_info(png_ptr, info_ptr);

// variables to pass to get info
int bit_depth, color_type;
png_uint_32 temp_width, temp_height;

// get info about png
png_get_IHDR(png_ptr, info_ptr, &temp_width, &temp_height, &bit_depth, &color_type,
    NULL, NULL, NULL);

if (width) { *width = temp_width; }
if (height){ *height = temp_height; }

// Update the png info struct.
png_read_update_info(png_ptr, info_ptr);

// Row size in bytes.
int rowbytes = png_get_rowbytes(png_ptr, info_ptr);

// glTexImage2d requires rows to be 4-byte aligned
rowbytes += 3 - ((rowbytes-1) % 4);

// Allocate the image_data as a big block, to be given to opengl
png_byte* image_data;
image_data = (png_byte*)malloc(rowbytes * temp_height * sizeof(png_byte)+15);
if (image_data == NULL)
{
    fprintf(stderr, "error: could not allocate memory for PNG image data\n");
    png_destroy_read_struct(&png_ptr, &info_ptr, &end_info);
    fclose(fp);
    return 0;
}

// row_pointers is for pointing to image_data for reading the png with libpng
png_bytep* row_pointers = (png_bytep*)malloc(temp_height * sizeof(png_bytep));
if (row_pointers == NULL)
{
    fprintf(stderr, "error: could not allocate memory for PNG row pointers\n");
    png_destroy_read_struct(&png_ptr, &info_ptr, &end_info);
    free(image_data);
    fclose(fp);
    return 0;
}

// set the individual row_pointers to point at the correct offsets of image_data
int i;
for (i = 0; i < temp_height; i++)
{
    row_pointers[temp_height - 1 - i] = image_data + i * rowbytes;
}

// read the png into image_data through row_pointers
png_read_image(png_ptr, row_pointers);

// clean up
png_destroy_read_struct(&png_ptr, &info_ptr, &end_info);

//free(image_data);
*image_data_ptr = (char*)image_data; // return data pointer

free(row_pointers);
fclose(fp);

fprintf(stderr, "\t texture image size is %d x %d\n", *width, *height);

return 1;
}

#endif

和：

unsigned int load_and_bind_texture(const char* filename)
{
char* image_buffer = NULL; // the image data
int width = 0;
int height = 0;

// read in the PNG image data into image_buffer
if (png_load(filename, &width, &height, &image_buffer)==0)
{
    fprintf(stderr, "Failed to read image texture from %s\n", filename);
    exit(1);
}

unsigned int tex_handle = 0;

// request one texture handle
glGenTextures(1, &tex_handle); 

// create a new texture object and bind it to tex_handle
glBindTexture(GL_TEXTURE_2D, tex_handle);

glPixelStorei(GL_UNPACK_ALIGNMENT, 1);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);

glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);

glTexImage2D(GL_TEXTURE_2D, 0, 
            GL_RGB, width, height, 0,
            GL_RGB, GL_UNSIGNED_BYTE, image_buffer);


free(image_buffer); // free the image buffer memory

return tex_handle;
}

然后从 init() 方法调用这些：

background_texture = load_and_bind_texture("images/office-wall.png");
an_face_texture1 = load_and_bind_texture("images/clock.png");

Answer 1

the image is loaded in the same way the background is loaded.

是的，这几乎可以肯定是问题所在。虽然两张图片都是 PNG，但它们几乎可以肯定是不一样的格式。

让我们实际调试一下您在加载的纹理中看到的内容。你看到 2 与 10 重叠。3 与 9 重叠。8 与 4 重叠。全部相互交错。并且这个模式重复了 3 次。

就好像你拿了原始图像，将它垂直折叠起来，然后重复它。 3次。

此处“3”的重复强烈表明 libPNG 实际读取的内容与您告诉 OpenGL 的纹素数据实际内容之间存在不匹配。你告诉 OpenGL 纹理是 RGB 格式，每个像素 3 个字节。

但并非每个 PNG 都是这样格式化的。一些 PNG 是灰度的；每个像素一个字节。并且因为您使用了低级 libPNG 读取接口，所以您从 PNG 中读取了 exact 格式的像素数据。是的，它解压它。但是您正在阅读 PNG 在概念上存储的内容。

因此，如果 PNG 是灰度 PNG，您对 png_read_image 的调用可以读取不是每像素 3 个字节的数据。但是你告诉 OpenGL 数据是每个像素 3 个字节。因此，如果 libPNG 每个像素写入 1 个字节，您将向 OpenGL 提供错误的纹素数据。

太糟糕了。

如果您要使用 libPNG 的低级读取例程，那么您必须实际检查正在读取的 PNG 格式并调整您的 OpenGL 代码以匹配。

使用更高级别的读取例程并明确告诉它将灰度转换为 RGB 会容易得多。

将方形图像纹理映射到圆形 OpenGl

Texture Mapping a square image onto a circle OpenGl

opengl

texture-mapping