(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Grab from
- custom images in shadertoy:
/*
A simple method to load custom image textures in Shadertoy!
-----------------------------------------------------------
The idea is to call directly the SetTexture function found in Shadertoy js code.
Here is how to loads the three textures needed for this shader:
- Open the javascript console of your browser:
Mac / Windows
Chrome: cmd + opt + J / ctrl + shift J
Firefox: cmd + opt + K / ctrl + shift K
IE: na / F12
- Then copy the following lines in the console to load custom 2048x2048 textures:
gShaderToy.SetTexture(0, {mSrc:'https://dl.dropboxusercontent.com/s/88u2uo8dxdmgzxo/world2.jpg?dl=0', mType:'texture', mID:1, mSampler:{ filter: 'mipmap', wrap: 'repeat', vflip:'true', srgb:'false', internal:'byte' }});
gShaderToy.SetTexture(1, {mSrc:'https://dl.dropboxusercontent.com/s/5rdhhnvnr5mochq/cloud2.jpg?dl=0', mType:'texture', mID:1, mSampler:{ filter: 'mipmap', wrap: 'repeat', vflip:'true', srgb:'false', internal:'byte' }});
gShaderToy.SetTexture(2, {mSrc:'https://dl.dropboxusercontent.com/s/ojl5zoxgbdn5w5s/light2.jpg?dl=0', mType:'texture', mID:1, mSampler:{ filter: 'mipmap', wrap: 'repeat', vflip:'true', srgb:'false', internal:'byte' }});
- Or, the following lines for 1024x1024 textures:
gShaderToy.SetTexture(0, {mSrc:'https://dl.dropboxusercontent.com/s/0j4q7p4x0upj40q/world1.jpg?dl=0', mType:'texture', mID:1, mSampler:{ filter: 'mipmap', wrap: 'repeat', vflip:'true', srgb:'false', internal:'byte' }});
gShaderToy.SetTexture(1, {mSrc:'https://dl.dropboxusercontent.com/s/26xr0l2ly68xgzh/cloud1.jpg?dl=0', mType:'texture', mID:1, mSampler:{ filter: 'mipmap', wrap: 'repeat', vflip:'true', srgb:'false', internal:'byte' }});
gShaderToy.SetTexture(2, {mSrc:'https://dl.dropboxusercontent.com/s/b67udjdsw4gzf99/light1.jpg?dl=0', mType:'texture', mID:1, mSampler:{ filter: 'mipmap', wrap: 'repeat', vflip:'true', srgb:'false', internal:'byte' }});
- hit return to execute and load the textures.
Using your own images:
- The first argument of gShaderToy.SetTexture() is the iChannel index from 0 to 3
- The second argument defines the url and additional parameters of the texture.
- Your images must be hosted on a server (such as Dropbox) that allows direct link
from a different domain in javascript. Otherwise, you will get an error message:
"'example.com has been blocked from loading by Cross-Origin Resource Sharing policy"
*/