GLSL renders to squared output
Chưa có ai nhận issue này.
Đánh giá
- Độ khó
- 4/5
- Thời gian dự kiến
- 3-5 ngày
- Mức phù hợp với người mới
- 35/100
- Loại issue
- Lỗi
- Độ rõ ràng
- Cần làm rõ
- Mức độ hoạt động
- Đình trệ
- Lĩnh vực
- computer-graphics
Hướng nghiên cứu
Start with the jsFiddle linked in the issue and inspect the provided vertex shader, especially how spriteSize is used when calculating position. Confirm the fix by rendering a rectangular 20x200 sprite without forcing its height to match its width.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
After using square-sized sprites and everything worked great, the moment I have tried a rectangular sprite with the size of 20x200, I have realized that it forces the output to 20x20, it only considers the width of the sprite and forces the height to be the same as the width
If you will inspect the canvas, you will see that it has the proper sizes: 20x200
I have used your shaders to render:
Vertex Shader:
uniform float u_frameOffset;
uniform vec4 u_screenDims;
attribute vec2 centerPosition;
attribute float rotation;
attribute float perSpriteFrameOffset;
attribute float spriteSize;
attribute vec2 cornerOffset;
attribute vec2 spriteTextureSize;
attribute float spritesPerRow;
attribute float numFrames;
attribute vec4 textureWeights;
varying vec2 v_texCoord;
varying vec4 v_textureWeights;
void main() {
float frameNumber = mod(u_frameOffset + perSpriteFrameOffset, numFrames);
float row = floor(frameNumber / spritesPerRow); // Compute the upper left texture coordinate of the sprite
vec2 upperLeftTC = vec2(spriteTextureSize.x * (frameNumber - (row * spritesPerRow)),
spriteTextureSize.y * row);
vec2 tc = upperLeftTC + spriteTextureSize * (cornerOffset + vec2(0.5, 0.5));
v_texCoord = tc;
v_textureWeights = textureWeights;
float s = sin(rotation);
float c = cos(rotation);
mat2 rotMat = mat2(c, -s, s, c);
// vec2 scaledOffset = spriteSize * cornerOffset;
vec2 scaledOffset = spriteSize * cornerOffset;
vec2 pos = centerPosition + rotMat * scaledOffset;
gl_Position = vec4(pos * u_screenDims.xy + u_screenDims.zw, 1.0, 1.0);
}
Fragment Shader:
precision mediump float;
uniform sampler2D u_texture0;
uniform sampler2D u_texture1;
uniform sampler2D u_texture2;
uniform sampler2D u_texture3;
varying vec2 v_texCoord;
varying vec4 v_textureWeights;
void main() {
vec4 color;
if (v_textureWeights.x > 0.0)
color = texture2D(u_texture0, v_texCoord);
else if (v_textureWeights.y > 0.0)
color = texture2D(u_texture1, v_texCoord);
else if (v_textureWeights.z > 0.0)
color = texture2D(u_texture2, v_texCoord);
else // v_textureWeights.w > 0.0
color = texture2D(u_texture3, v_texCoord);
gl_FragColor = color;
}
My GLSL knowledge isn't very strong yet and I'd appreciate any help to make it render with the original width & height.
Right now I see that the Vertex Shader accepts only spriteSize (which is only the width of the sprite) as a parameter when calculating position & sizes.
- Ngôn ngữ chính
- Wolfram Language
- Star
- 982
- Fork
- 292
- Merge trung bình
- 1 ngày 6 giờ
- Pull request đã merge (30 ngày)
- 1
Hướng dẫn đóng góp
Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của WebGLSamples/WebGLSamples.github.io
-
Độ khó 4/5 3-5 ngày Mức phù hợp với người mới 35/100
WebGLSamples/WebGLSamples.github.io#24 · 2 bình luận ·
-
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 35/100
WebGLSamples/WebGLSamples.github.io#17 · 1 bình luận ·
-
Độ khó 3/5 1-2 ngày Mức phù hợp với người mới 25/100
WebGLSamples/WebGLSamples.github.io#15 · 1 bình luận ·
-
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 20/100
WebGLSamples/WebGLSamples.github.io#8 · 5 bình luận ·
Tất cả issue của WebGLSamples/WebGLSamples.github.io
Issue tương tự
-
Add GEOM extension prefix Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 68/100
KhronosGroup/glTF#2647 · 1 bình luận ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 76/100
libsdl-org/SDL#16369 · 1 bình luận ·
-
🌑 nextgen
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 82/100
CCBlueX/LiquidBounce#9214 · 1 bình luận ·
-
bug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
-
Area:Math p5.js 2.0+
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 88/100
processing/p5.js#9197 · 3 bình luận · 1 người được giao ·