actarian / vscode-glsl-canvas

Live WebGL preview of GLSL shaders
MIT License
335 stars 25 forks source link

Texture Error "u_texture_0": "F\image.png" #45

Closed bhomaidan1990 closed 4 years ago

bhomaidan1990 commented 4 years ago

I added this line to the settings to show the image :

 "glsl-canvas.extensions": [

    ],
    "glsl-canvas.textures": {
        "0": "F:\\image.png",
    }

so the error popped up on VsCode, can you please tell me how to render the image correctly?

//------------------------------------------
#ifdef GL_ES
precision mediump float;
#endif
//------------------------------------------
//------------------------------------------
uniform vec2 u_resolution;
uniform float u_time;
uniform vec2 u_mouse;
uniform sampler2D u_texture_0;
void main(){
    //=============================
    // // Image
    //=============================
    vec2 coord = gl_FragCoord.xy / u_resolution;
    vec3 color = vec3(0.0);

    coord.x += sin(u_time);

    gl_FragColor = texture2D(u_texture_0, coord);
}
actarian commented 4 years ago

@bhomaidan1990 due to VSCode file loading policy restriction you can load texture with relative path or over http with enabled CORS:

"glsl-canvas.textures": {
        "0": "./texture.png",
        "1": "https://rawgit.com/actarian/plausible-brdf-shader/master/textures/noise/cloud-1.png",
        "2": "https://rawgit.com/actarian/plausible-brdf-shader/master/textures/noise/cloud-2.jpg",        
}

You can also load textures directly in fragment with relative or remote http path:

uniform sampler2D u_tex0; // data/moon.jpg
uniform vec2 u_tex0Resolution;
uniform sampler2D u_logo; // https://rawgit.com/actarian/glsl-canvas/master/docs/data/logo.jpg
uniform vec2 u_logoResolution;
chilus commented 4 years ago

@actarian Loading the textures directly in fragment works for me with a remote http path, but doesn't with a relative path. I've tried out several options and different vscode workspace hierarchies but no success. Do you have any ideas?

actarian commented 4 years ago

@Chilus texture path should be relative to workspace root folder, eg. if you got a folder named data in your workspace you should write relative path like this:

uniform sampler2D u_tex0; // ./data/moon.jpg

Jinsong-Bluesky commented 4 years ago

Interesting. It works with root/.frag and ./data/logo.jpg, but NOT with root/shaders/.frag and ../data/log.jpg.

bhomaidan1990 commented 4 years ago

@actarian Thanks for your detailed explanation.