klaude

Members
  • Content Count

    22
  • Joined

  • Last visited

  1. finally, i found the solution with BABYLON.FilterPostProcess. please let me share, if there is better method or code. https://playground.babylonjs.com/#H05KJ1#4 many thanks
  2. I'm using ImageProcessingPostProcess for brightness of scene. and configure it with .exposure property. by default, ImageProcessingPostProcess makes brighter than non-use even set exposure to 1. in my case it does not affect meshes with ambientColor, under exposure value 1 of postprocess. and it does affect with exposure less than 1. it works well before. but now, shaderMaterial is affected by ImageProcessingPostProcess exposure 1. https://playground.babylonjs.com/#H05KJ1#3 so, please let me know if there are any method to change brightness of entire scene. thanks.
  3. @Deltakosh My faults. It's because not vColor and shader. It's because ImageProcessingPostProcess https://playground.babylonjs.com/#H05KJ1#1 and now, how to set meshes to have same brightness?
  4. @Deltakosh it's complicate to create same thing on the Playground, so made simple one. multiplying vColor makes plane2 disappear. is it related? https://playground.babylonjs.com/#H05KJ1
  5. Hi, @Blax My project is not usual. mixing 2d and 3d. so entire meshes use only diffuseTexture, opacityTexture and ambientColor without light. basically, meshes use StandardMaterial. and now shaderMaterial is used only for character. but new trial of shaderMaterial shows lighter color than before.
  6. Hello! I'm upgrading my code, StandardMaterial to ShaderMeterial. my scene colors are scene.clearColor = new BABYLON.Color3(0,0,0); scene.ambientColor = new BABYLON.Color3(1,1,1); and before standardMaterial initializing is like mat = new BABYLON.StandardMaterial('material', scene); mat.ambientColor = new BABYLON.Color3(1,1,1); mat.diffuseTexture = texture.texture; mat.opacityTexture = texture.texture; and new shaderMeterial initializing is like var route = { vertex: "custom", fragment: "custom", }; var options = { needAlphaBlending : true, needAlphaTesting: true, attributes: ["position", "normal", "uv"], uniforms: ["world", "worldView", "worldViewProjection", "view", "projection"] }; mat = new BABYLON.ShaderMaterial('shader', scene, route, options); mat.backFaceCulling = false; mat.setTexture('map', texture.texture); shader code is below BABYLON.Effect.ShadersStore["customVertexShader"]= "precision highp float;\r\n"+ "// Attributes\r\n"+ "attribute vec3 position;\r\n"+ "attribute vec2 uv;\r\n"+ "attribute vec4 color;\r\n"+ "// Uniforms\r\n"+ "uniform mat4 worldViewProjection;\r\n"+ "// Varying\r\n"+ "varying vec2 vUv;\r\n"+ "varying vec4 vColor;\r\n"+ "void main() {\r\n"+ " vUv = uv;\r\n"+ " vColor = color;\r\n"+ " vec4 p = vec4( position, 1. );\r\n"+ " gl_Position = worldViewProjection * p;\r\n"+ "}\r\n"; BABYLON.Effect.ShadersStore["customFragmentShader"]= "precision highp float;\r\n"+ "varying vec2 vUv;\r\n"+ "varying vec4 vColor;\r\n"+ "uniform sampler2D map;\r\n"+ "void main(void) {\r\n"+ " gl_FragColor = texture2D(map, vUv)*vColor;\r\n"+ "}\r\n"; but results are different. before vs after how to make shaderMaterial color like standardMaterial color?
  7. OK, thanks @Sebavan incidentally, At first I used one webgl(babylonjs) and another canvas-2d(spine-canvas). It looks like to share texture cache. in this case, canvas-2d logic has just redrawing with HTMLImageElement.
  8. Hello, maybe this frequently required about preview dialog. like when shows character preview in a dialog or popup ui with new canvas. but i couldn't find the related post. in my case, not a full screen game it's web application. so, required multiple scenes for a dialog. BABYLONJS AssetsManager constructor needs a scene. and can not reuse these loaded textures with another scene in normal. when reused, it shows error like 'bindTexture: object not from this context' Is that possible to reuse loaded textures in another canvas with new scene? I don't want to request duplicated texture assets. thanks.
  9. Hello, @Rodrix3 made sample below. https://codepen.io/klaude/pen/pZpBOz?editors=1010 ignore before thread. had some misunderstanding. good luck!
  10. Hello, @Rodrix3 Maybe you have also some logics in engine.runRenderLoop function callback. In my case like this example. var capturer = new CCapture( { format: 'webm', framerate: 30 } ); function _render() { // some logics... scene.render(); } engine.runRenderLoop(_render.bind(this)); // stop render loop and capture function record() { scene.getEngine().stopRenderLoop(); render(); } // recording: call scene.render function and capture in loop function render() { requestAnimationFrame(function() { scene.render(); capturer.capture(scene.getEngine().getRenderingCanvas()); render(); }); } // and finally when to stop recording, call capturer.stop(); capturer.save(); i tested until this but for more exactly at last, you may should stop requestAnimationFrame in render() and call engine.runRenderLoop again. and can't tell you its time sync is exactly right but looks fine.
  11. Hello @Sebavan and @Deltakosh Thanks for your efforts https://github.com/BabylonJS/Extensions/tree/master/GIFExporter/examples/basic there is no example.js so i'm just trying using js files in 'dist'. Script tag and code like new GIFCreator(scene.getEngine()); it shows GIFCreator not found error. how to fix it it's available?
  12. Hi @aWeirdo if engine's target fps is 60 then every scene.render() is render after 1/60s. so setTimeout function's millisecs parameter do not affect rendering video speed. right? still it doesn't work as what i think. :( Sebavan's new solution is genius thing, i cannot approach near around it.
  13. Hello, found this solution for creating video. but this result video is faster than runtime animation. thought that _alpha variable usage is strange, so tried milliseconds controls but not easy for me. in my opinion every 1000/fps milliseconds, to render and to capture are correct. but it makes more speedy video any advice? ps. i solved using CCapture. but video quality is not good. function record() { scene.getEngine().stopRenderLoop(); render() } function render() { requestAnimationFrame(function() { scene.render(); capturer.capture(scene.getEngine().getRenderingCanvas()); render(); }); }
  14. klaude

    alphaIndex occurs depth problem.

    It was fully my newbie-like mistake about js array sort function... Thank you @sable