V4 crash displaying models

Bugs
1

@John @Simeon - filling out a crash report and touched the screen outside the report panel and it disappeared. So, here is what I was doing - I loaded a demo from @binaryblues at this link

First demo on topic.

I was trying different models in it and whilst trying to zoom the scene it crashed.

Couple of points

On the demo the scene was red coloured and I couldn’t change it to natural light, didn’t seem in line with the colours displayed.

Secondly, I have tried to add a skybox in the background() command but I don’t know the syntax - can you give us a hint.

Cheers

Edit: @John, I may be wrong but I think the red colours in the objects for the above demo is the default texture colour.
Adding a cube image path to background() merely got me a black background.

2

@Bri_G You can comment this line as a temporary tip:

    scn.sky = nil

then the red back light will disappear.

About the crash, I have a guess: the animation models need more memory. The more models we load, the more likely we are to crash due to insufficient memory. Please try to comment three models, and only keep one.

Btw. Now the performance is very good! 120 fps

image
image2048×1413 246 KB

3

@binaryblues - thanks for that, worked a treat and the skybox became visible. Only problem with the skybox now appears to be size. The image looks to be zoomed in. Is there a scaling factor for it?

4

Without any factor, I cut the image to make it smaller :smile:

5

@binaryblues - hmmmmm, tried several sized skybox images and all seemed to show very similar images. Not sure on the syntax for the skybox in V4. I’ve been trying to add it in the background() function, as described in the docs, but with little success.

What sized images have you used?

Edit: slowly getting there now, found an example in the docs which uses a shader. Set up a model in it and it partially displays the skybox but elements above and below are not complete.

6

Here is my skybox code in V4(based on the built-in example, and made some modify)

-- C4Shader
-- https://github.com/JohnTM/Codea4-Docs/tree/main/docs/source/code/Background%20Shader.codea
-- 有特殊语法形式的 skybox shader
-- background(shader) 只能加载 skybox 类型的 shader

---[=[
viewer.displayStats = true
function setup()
    -- Create a custom background shader
    skybox = shader{
        name = "Skybox",
        
        properties =
        {
            {"environment", "texture"},
            {"mipLevel", "float", 0}
        },
        
        pass =
        {
            cullFace = "none", -- backgrounds don't need culling
            depthWrite = false, -- no need to write to depth buffer
            depthFunc = "always", -- no need for depth testing
            blendMode = "disabled", -- no need for blending
            renderQueue = "background", -- render behind everything else
            
            vertex =
            [[
            #version 430
            #include <codea/common.glsl>
            
            layout (location = POSITION) in vec3 a_position;
            
            layout (location = 0) out vec3 v_eyeDirection;
            
            void main()
            {
                // vertex layout is a quad between -1 and 1, use this to unproject and calculate eye direction from view/perspective matrix
                vec3 unprojected = (u_invProj * vec4(a_position, 1)).xyz;
                v_eyeDirection = mat3(u_invView) * unprojected;
                
                gl_Position = vec4(a_position.xy, 1, 1);
            }
            ]],
    
            fragment =
            [[       
            #version 430
            #include <codea/common.glsl>
            
            layout (location = 0) in vec3 v_eyeDirection;
            out vec4 fragColor;
            
            uniform samplerCube environment;
            uniform float mipLevel;
            
            void main()
            {
            vec3 rayDir = normalize(v_eyeDirection);
            rayDir = vec3(rayDir.x, rayDir.y, rayDir.z);
            vec3 col = texture(environment, rayDir, mipLevel).rgb;
            fragColor = vec4(col, 1.0);
            }
            ]],
        }
    }
    
    -- 生成 skybox 格式的图片
    local hdr = image.cube(image.read(asset.builtin.hdr.Norway_Forest))
    -- local hdr = image.cube(image.read(asset.builtin.Small_World.Icon))
    -- local hdr = image.cube(image.read(asset.documents.HDR_029_Sky_Cloudy_Free.HDR_029_Sky_Cloudy_Free.HDR_041_Path_Bg))
    skybox.environment = hdr:generateIrradiance()
    -- skybox.environment = hdr
    
    -- Test mip level adjustment
    parameter.number("MipLevel", 0, 10, 0, function(mip)
        skybox.mipLevel = mip
    end)  
    
    parameter.vec2("Rotation", vec2(0,0))
    
    -- 使用基本场景的默认镜头
    scn = scene.default3d()
    scn.sky = nil
    
    local rig = scn.camera:add(camera.rigs.orbit)
    rig.distance = 5000
    rig.angles.x = -45    
    rig.angles.y = -75
    
    -- scene.main = scn
end

function draw()
        
    matrix.perspective() 
    local v = mat4.orbit(vec3(0, 0, 0), 100, Rotation:unpack())    
    matrix.view(v)
    
    -- 点击屏幕控制镜头
    scn:draw()
    background(skybox)
-- sprite(skybox,WIDTH/2,HEIGHT/2,100,100)
end

--]=]
7

@binaryblues - thanks again for the post, tried it with my image and had the same effect. Tried to attach an image to show that the image is not wrapping. Image size was 2048 x 1536. Reduced it to 1024 x 768 and still same effect. What dimensions did you succeed with ?

@John - am I missing something here, your demo with the forest scene seems to be OK ?

Edit: Found my answer - @ John has used an interpolation of a solid image, not the cross shaped images used for V3, the skybox images that we are used to. The Norway Forest image does seem to be distorted a little almost like a fish-eye lens so we may have to modify a standard image before use. The forest image is 2048 x 1024.

Use following code to see it (in V3) :


function setup()
    --
    pic = readImage(asset.builtin.hdr.Norway_Forest)
    print(spriteSize(pic))
end

function draw()
    --
    background(0)
    sprite(pic,WIDTH/2,HEIGHT/2)
end

Edit 2: As I thought, grabbed recent space telescoped image and used that in the code you posted and it gives a complete skybox effect but where the edges meet show contrasting edge effects. Seem to remember this in V3 until @John modified it.

8

Hi @Bri_G

Yes, as you’ve noticed, V4 handles background images differently. In Craft we supported both cube-maps and HDRIs (equirectangular images). We need to explictly add support for detecting and loading t-shape cubemap images for them to display correctly in these situations

9

@John - thanks for the reply. Didn’t realise V3 could handle different types of textures in skyboxes. I’m intrigued about how you can create a texture, like the forest one, which wraps without edges. When you look at that image around the edges it does look like the image has been manipulated. What’s the technique ? Are there any references for it ?

Looks like V4 is going to be a major step change.

Again - thanks for the reply.

10

A HDRI is a panoramic (360 degree) seamless image of an environment with a high dynamic range (pixel values go beyond 0-255). This is useful for more than just backgrounds because it can also be used as a source of indirect environmental lighting (see - image based lighting)

Here’s a video of how to make one with just your phone:

11

As long as it is a normal HDR image, it should be fine. John offers the general way to make HDR images, and there are free resources available on the web to download:

https://www.2gacademy.net/product-page/hdri-sky-099

1 Like
12

@John @binaryblues - thanks for the feedback on HDRi, did a little digging myself since the original post and found a Wikipedia page and lots of images on the net. Incorporated a couple into a Codes project. The video on make your own with your phone was interesting. Must try that.
Thanks again, will keep me busy for a while.