Jump to content

Search the Community

Showing results for tags 'filtering'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Standards
    • Coding and Game Design
    • Paid Promotion (Buy Banner)
  • Frameworks
    • Pixi.js
    • Phaser 3
    • Phaser 2
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
    • GameMonetize
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered
    • Marketplace (Sell Apps, Websites, Games)

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Website URL


Twitter


Skype


Location


Interests

Found 3 results

  1. Hi, First of all thank you for Babylon.JS, it is a wonderful library and a pleasure to code with it I am working on a game project and I need to display textures with a 'nearest neighbour' sampling mode (pixelated effect). Babylon.JS theoretically offers this possibility, but I could not manage to get it working. Here is a playground illustrating my modest struggle: http://www.babylonjs-playground.com/#1IKIXK#2 Left cube's texture is created with the NEAREST_SAMPLINGMODE parameter, while the right one uses TRILINEAR_SAMPLINGMODE. In my browser (Chrome v38), there is absolutely no visible difference. I have seen a couple of threads about this on the forum but nothing that provides a real solution. Hopefully this thread will be able to do that. Of course there is always the possibility to multiply the size of the texture using a nearest neighbour interpolation with an image manipulation software, but I'd prefer not as it adds steps in the workflow and prevents doing big texture atlases. Thank you very much in advance
  2. Hi guys, trying to wrap my head around how shadows are working inside of BJS, and have a few questions. First off, I have this scene here: http://client.elementxcreative.com/public/bjs/fog_test/index.html You can move around the scene with the mouse/arrow keys. You can see the shadows looked a bit jacked up. Not only are the shadows low rez looking (despite having the resolution cranked up in BJS) but there is weird self shadowing on the objects themselves? Attached below is an image of the scene I'm exporting from Unity, what I'm expecting shadows to look closer to. It's just a single directional light. I'm manually fiddling with the filtering options on the BJS to try and get closer to this, but I'm not having much luck. Attached is code were using: var engine, scene; var mouseX,mouseY,dx,dz; var cameraTarget = new BABYLON.Vector3(0,0,0); var renderPlane, renderTarget; var DEBUG = true; var showstats = false; // Get the canvas element from our HTML above var canvas = document.querySelector("#render"); // var stats = document.querySelector("#stats"); // Load the BABYLON 3D engine engine = new BABYLON.Engine(canvas, true); engine.enableOfflineSupport = false; //this stops the manifest errors in the console BABYLON.SceneLoader.Load("assets/","fog_test.unity.babylon",engine,function(newScene){ scene = newScene; //CAMERA doCamera(newScene,canvas); // FOG doFog(newScene,canvas); // SHADOWS doShadows(newScene); // RENDER LOOP engine.runRenderLoop(function(){ newScene.render(); update(); }); }); function doShadows(newScene){ for (var i = 0; i < newScene.lights.length; i++){ var shadowGenerator = new BABYLON.ShadowGenerator(8192, newScene.lights[i]); newScene.meshes.forEach(function(mesh) { shadowGenerator.getShadowMap().renderList.push(mesh); shadowGenerator.bias = 0.0000001; //shadowGenerator.useVarianceShadowMap = true; shadowGenerator.usePoissonSampling = true; }); }; newScene.meshes.forEach(function(mesh) { mesh.receiveShadows = true; }); } function doCamera(newScene,canvas){ //new camera var newCamera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 0, 0), newScene); newCamera.position = newScene.cameras[0].position; newCamera.rotation = newScene.cameras[0].rotation; newCamera.target = newScene.cameras[0].target; newCamera.fov = newScene.cameras[0].fov; newCamera.inertia = newScene.cameras[0].inertia; newCamera.mode = newScene.cameras[0].mode; newCamera.speed = 0.1; newCamera.attachControl(canvas,false); newScene.activeCamera = newCamera; //newScene.activeCamera.wheelPrecision = 90; //newScene.activeCamera.minZ = .01; // Define z key to rotate object z axis left newScene.actionManager = new BABYLON.ActionManager(newScene); newScene.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnKeyDownTrigger, function (evt) { if (evt.sourceEvent.keyCode == 90) { console.log("z key pressed"); newScene.meshes.forEach(function(mesh) { //mesh.rotation = new BABYLON.Vector3(0, 0, 1); mesh.rotate(BABYLON.Axis.Z, 0.06, BABYLON.Space.Local) }); } })); // Define x key to rotate object z axis right newScene.actionManager.registerAction(new BABYLON.ExecuteCodeAction(BABYLON.ActionManager.OnKeyDownTrigger, function (evt) { if (evt.sourceEvent.keyCode == 88) { console.log("x key pressed"); newScene.meshes.forEach(function(mesh) { mesh.rotate(BABYLON.Axis.Z, -0.06, BABYLON.Space.Local) }); } })); } function doFog(newScene,canvas){ newScene.meshes.forEach(function(mesh) { mesh.applyFog = true; // allow all meshes to be effected by fog }); // newScene.fogMode = 2; // newScene.fogColor = new BABYLON.Color3(1, 1, 0.85); // newScene.fogDensity = .0075; } function update(){ if (renderPlane){ //console.log('hey'); var v1 = new BABYLON.Vector3(1,0,0); var v2 = scene.cameras[1].target.subtract(scene.cameras[1].position); var vec = math.cross([v1.x,v1.y,v1.z],[v2.x,v2.y,v2.z]); var w = math.sqrt(v1.lengthSquared()*v2.lengthSquared()) + math.dot([v1.x,v1.y,v1.z],[v2.x,v2.y,v2.z]); var q = new BABYLON.Quaternion(vec[0], vec[1], vec[2], w); // Quaternion q; // vector a = crossproduct(v1, v2) // q.xyz = a; // q.w = sqrt((v1.Length ^ 2) * (v2.Length ^ 2)) + dotproduct(v1, v2) renderPlane.rotation = q.toEulerAngles(); //console.log(q.toEulerAngles()); } } Any thoughts on what we could do to improve the shadows? thanks!
  3. I may have missed this somewhere else, but was unable to find it. Sorry if that is the case. I would like to be able to scale sprites with nearest neighbor filtering so they do not become blurry. I have modified phaser.js to do this myself since the beginning, but with the frequent updates, I wanted to see if there was a way already built in. Thanks.
×
×
  • Create New...