Your browser doesn't support HTML5 canvas.

Camera


Exposure:



FOV:




Environment


Map:


Intensity:



White point:



Black point:



Background:


Background color:



Gradient color 1:



Gradient color 2:




Files



No files imported



Model


Scale:



Angle:




Material




Material:



No material selected



Lights


Create




No lights selected



Floor


Enable:



Tiling:




Upload

FPS:

Draw calls:

Help
Mouselook
/* Here you can write your own pixel shader for the selected material. Don't forget, it is GLSL with many limitations of WebGL. Variables passed from vertex shader (varying): vec3 IN_Normal - world-space normal, vec3 IN_Tangent - world-space tangent, vec3 IN_Binormal - world-space binormal, vec2 IN_TexCoords - texture coordinates, vec3 IN_pWorld - world-space position. Uniforms: vec3 PosCam - world-space camera position, vec4 params: x component contains roughness (0-1), y component contains reflectivity (0-1), z component contains both fresnel (0-1) and emission (0-1) data: fresnel value is extracted with this formula: fract(params.z)*10.0; emission value is extracted with this formula: floor(params.z); w component contains both isMetal (true/false) and opacity (0-1) data: isMetal value is extracted with this formula: params.w>0.0; opacity value is extracted with this formula: abs(params.w); vec4 diffuseColor: RGB contains diffuse color, Alpha contains current render exposure, vec4 topColor - top color of user-defined environment, vec4 bottomColor - bottom color of user-defined environment, vec4 lightPosN, vec4 lightColorN - light parameters, N should be the number (from zero). Textures: sampler2D diffusemap, sampler2D normalmap, sampler2D glossmap (actually roughness), sampler2D reflmap, sampler2D emissionmap; sampler2D opacitymap; sampler2D aomap; sampler2D metmap; As WebGL does not support textureCubeLod, it is not possible to change cubemap mip level per fragment. Therefore, per-pixel roughness change is made in an awkward way: each mip is stored as a separate cubemap. Here they are: samplerCube Cubemap; samplerCube Cubemap1; samplerCube Cubemap2; samplerCube Cubemap3; samplerCube Cubemap4; samplerCube Cubemap5; Functions: float saturate(float f) - alias for clamp(f, 0.0, 1.0), vec3 toneMap(vec3 color, float exposureScale) - performs Hable[1] tonemapping, vec3 fixSeamsStretch(vec3 vec, float MipmapIndex, float CubemapSize=128.0) - fixes cubemap seams [2], float BlinnPhong(vec3 lightDir, vec3 viewDir, vec3 normal, float specPow, float dotNL) - gives a Blinn-Phong highlight, vec4 texture2DSRGB(sampler2D tex, vec2 tc) - does gamma conversion to linear. Don't forget to do pow(output, 0.45) on your final pixel color to convert from linear to gamma! WebGL does not support sRGB conversions natively! [1] http://filmicgames.com/archives/75 [2] http://the-witness.net/news/2012/02/seamless-cube-map-filtering/#more-1502 */ // Pixel shader code gl_FragColor = vec4(1,0,0,1); // output red color
Compile

Type a name for your model:




Type your name:




These names will be shown in your model's player

Based on your data it will look like this:


Upload

Cancel

0%