LWJGL Circle程序创建一个椭圆形的形状 [英] LWJGL Circle program create's an oval-like shape

问题描述

我试图在LWJGL中绘制一个圆，但是当我绘制时，我尝试绘制一个圆，它的形状更像是一个椭圆而不是一个圆.另外，当我更改circleVertexCount 350+时，形状会翻转.我真的不知道创建顶点的代码是如何工作的(我采用了Geometry，我知道基本的触发比率).我还没有真正找到关于创建圈子的好教程.这是我的代码:

I'm trying to draw a circle in LWJGL, but when I draw I try to draw it, it makes a shape that's more like an oval rather than a circle. Also, when I change my circleVertexCount 350+, the shape like flips out. I'm really not sure how the code works that creates the vertices(I have taken Geometry and I know the basic trig ratios). I haven't really found that good of tutorials on creating circles. Here's my code:

public class Circles {

// Setup variables
private int WIDTH = 800;
private int HEIGHT = 600;
private String title = "Circle";

private float fXOffset;

private int vbo = 0;
private int vao = 0;

int circleVertexCount = 300;

float[] vertexData = new float[(circleVertexCount + 1) * 4];

public Circles() {
    setupOpenGL();
    setupQuad();

    while (!Display.isCloseRequested()) {
        loop();
        adjustVertexData();
        Display.update();
        Display.sync(60);
    }

    Display.destroy();
}

public void setupOpenGL() {
    try {
        Display.setDisplayMode(new DisplayMode(WIDTH, HEIGHT)); 
        Display.setTitle(title);
        Display.create();

    } catch (LWJGLException e) {
        e.printStackTrace();
        System.exit(-1);
    }

    glClearColor(0.0f, 0.0f, 0.0f, 0.0f); 
}

public void setupQuad() {
    float r = 0.1f;
    float x;
    float y;
    float offSetX = 0f;
    float offSetY = 0f;
    double theta = 2.0 * Math.PI;

    vertexData[0] = (float) Math.sin(theta / circleVertexCount) * r + offSetX;
    vertexData[1] = (float) Math.cos(theta / circleVertexCount) * r + offSetY;

    for (int i = 2; i < 400; i += 2) {
        double angle = theta * i / circleVertexCount;
        x = (float) Math.cos(angle) * r;
        vertexData[i] = x + offSetX;
    }

    for (int i = 3; i < 404; i += 2) {
        double angle = Math.PI * 2 * i / circleVertexCount;
        y = (float) Math.sin(angle) * r;
        vertexData[i] = y + offSetY;
    }

    FloatBuffer vertexBuffer = BufferUtils.createFloatBuffer(vertexData.length);
    vertexBuffer.put(vertexData);
    vertexBuffer.flip();

    vao = glGenVertexArrays();
    glBindVertexArray(vao);

    vbo = glGenBuffers();
    glBindBuffer(GL_ARRAY_BUFFER, vbo);
    glBufferData(GL_ARRAY_BUFFER,vertexBuffer, GL_STATIC_DRAW);

    glVertexAttribPointer(0, 2, GL_FLOAT, false, 0, 0);

    glBindBuffer(GL_ARRAY_BUFFER, 0);

    glBindVertexArray(0);

}

public void loop() {
    glClear(GL_COLOR_BUFFER_BIT); 

    glBindVertexArray(vao);
    glEnableVertexAttribArray(0);

    glDrawArrays(GL_TRIANGLE_FAN, 0, vertexData.length / 2);

    glDisableVertexAttribArray(0);
    glBindVertexArray(0);
}

public static void main(String[] args) {
    new Circles();
}

private void adjustVertexData() {
    float newData[] = new float[vertexData.length];
    System.arraycopy(vertexData, 0, newData, 0, vertexData.length);

    if(Keyboard.isKeyDown(Keyboard.KEY_W)) {
        fXOffset += 0.05f;
    } else if(Keyboard.isKeyDown(Keyboard.KEY_S)) {
        fXOffset -= 0.05f;
    }

    for(int i = 0; i < vertexData.length; i += 2) {
        newData[i] += fXOffset;
   }

    FloatBuffer newDataBuffer = BufferUtils.createFloatBuffer(newData.length);
    newDataBuffer.put(newData);
    newDataBuffer.flip();

    glBindBuffer(GL_ARRAY_BUFFER, vbo);
    glBufferSubData(GL_ARRAY_BUFFER, 0, newDataBuffer);
    glBindBuffer(GL_ARRAY_BUFFER, 0);
}
}

300个顶点计数(这是我的主要问题)

300 Vertex Count(This is my main problem)

400个顶点计数-我删除了此图像，它已被剔除，应该是从右侧切出的小条，像割线一样

400 Vertex Count - I removed this image, it's bugged out, should be a tiny sliver cut out from the right, like a secant

500个顶点数

每100个，它就会删除越来越多的圆，依此类推.

Each 100, it removes more and more of the circle, and so on.

推荐答案

您的问题之一是:

for (int i = 2; i < 400; i += 2) {
    double angle = theta * i / circleVertexCount;
    x = (float) Math.cos(angle) * r;
    vertexData[i] = x + offSetX;
}

for (int i = 3; i < 404; i += 2) {
    double angle = Math.PI * 2 * i / circleVertexCount;
    y = (float) Math.sin(angle) * r;
    vertexData[i] = y + offSetY;
}

您为每个顶点的x和y位置使用了不同的角度值.

You are using a different value for angle for the x and y position of each vertex.

您可以尝试以下方法:

for (int i = 0; i <= circleVertexCount; i++) {
    double angle = i * theta / circleVertexCount;
    x = (float) Math.cos(angle) * r;
    y = (float) Math.sin(angle) * r;
    vertexData[i * 2] = x + offSetX;
    vertexData[i * 2 + 1] = y + offSetY;
}

您的圆的一部分在较高的顶点数处被切除的原因是您的for循环中的i < 400，所以我将其更改为i <= circleVertexCount.

The reason part of your circle was being cut out at higher vertex counts was the i < 400 in your for loops, so I have changed it to i <= circleVertexCount.

另一个问题是您的窗口不是方形的，并且您没有使用着色器(或不建议使用的内置矩阵)来纠正此问题.这意味着一个单元的长度看起来与一个单元的长度不同，从而导致椭圆形而不是圆形.要解决此问题，您可以将顶点x位置乘以显示高度除以显示宽度，最好是在着色器中.

Another problem is that your window is not square, and you are not using a shader (or the deprecated built in matrices) to correct this. This means that one unit up looks a different length than one unit right, resulting in an oval instead of a circle. To fix this you could multiply your vertex x position by your display height divided by your display width, preferably in a shader.

这篇关于LWJGL Circle程序创建一个椭圆形的形状的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！