Search the Community

Showing results for tags 'textures'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
    • Haxe JS
    • Kiwi.js
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

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 57 results

  1. Raghvendra Singh

    Phaser 3 Capture canvas at specific coordinates

    Hi All, Below is my project url please visit : http://111.93.53.134/digital/test/polygon/ Now my question is that i am creating a polygon at run time and add physics to polygon. When the polygon collides with matter body a horizontal redline is drawn and when i click on the down arrow button then another metal spring collides with polygon shapes then a blue line draw and you can drag the blue line. So i have to take the snapshot of only that polygon and redline which is beneath the polygon and that blue line which is being dragged and show them in the grid box 1,2,3,4. The polygons can be rotate as well by middle button when the spring metal is not collides with the polygon. I have tried several ways to figure this out but not able to fix the snapshot . I am attaching the image that what i actually want. And please tell me a way to make the polygon shapes more steady while rotation. Thanks, Raghvendra
  2. What's the policy for textures, if they are not longer used they are released? They are released in case they are not in use and the memory usage becomes critical? I'm asking this since I'm trying to develop something like a VR walktrhough using panoramic spheres and if it is so big it could fill a low-end mobile device. Thank you in advance.
  3. Super exciting developments for me. @Des3Dteam have finished my first 3D asset I have an obj file, height-maps, textures, and everything. I'm linking a gif of said object below. Now - what information do I need, and how do I go about changing the texture/image in the circle that says "Des3DTeam"? I need to be able to change it on the fly in the JS code. Thanks
  4. I read in another thread that BabylonJS intelligently handles multiple uses of the one texture for optimal performance i.e. internally if the texture path is the same then no extra vram is used for subsequent new textures with the same path. I suspect I've been overcomplicating things up until now but here's some related questions. Question 1 If I load my textures with AssetsManager like so: var textureTask = assetsManager.addTextureTask("my-texture", "./path/to/my-texture.jpg"); Are the following methods of applying the textures equivalent behind the scenes (i.e. neither uses more VRAM)? // Method 1 textureTask.onSuccess = function(task) { material.diffuseTexture = task.texture; } // Method 2 - elsewhere in application after assetsManager.onFinish() has been called. material.diffuseTexture = new BABYLON.Texture("./path/to/my-texture.jpg", scene); Question 2 What I've been doing up until now is assigning loaded assets to an assets array which I then pass around to various objects to use what they need like so: textureTask.onSuccess = function(task) { assets[task.name] = task.texture; } // Stuff ... var myCustomObject = new CustomObject(assets); // In CustomObject ... material.diffuseTexture = assets["my-texture"].clone(); The reason for the .clone() is when I need different uv scale and offset per instance. If my method 1 and 2 are functionally equivalent and don't result in any additional vram usage or performance hit then I'm wasting my time passing around an array of loaded assets when I could simply instantiate a new texture with the same path that I know has already been loaded by AssetsManager. Can anyone shed some light on this? How do other people manage this efficiently?
  5. Hello! I looked through the documentation but wasn't quite sure if I missed how I might load textures for my model. Perhaps I could do this using the TextureAssetTask or ImageAssetTask? Basically, I was wondering if there was a way to accomplish this: BABYLON.SceneLoader.ImportMesh("space_frig", "Assets/", "gate.babylon", scene, function (newMeshes, particleSystems) { meshPlayer = newMeshes[0]; meshPlayer.position.y = 2; //meshPlayer.receiveShadows = true; //shadowGenerator.getShadowMap().renderList.push(meshPlayer); meshPlayer.checkCollisions = true; meshPlayer.ellipsoid = new BABYLON.Vector3(1, 1, 1); meshPlayer.ellipsoidOffset = new BABYLON.Vector3(0, 0, 0); meshPlayer.scaling.x = meshPlayer.scaling.y = meshPlayer.scaling.z = 0.3; meshPlayer.material.diffuseTexture = shipTexture; meshPlayer.material.bumpTexture = new BABYLON.Texture('Assets/gate_bump.png', scene); meshPlayer.material.specularTexture = new BABYLON.Texture('Assets/gate_specular.png', scene); meshPlayer.material.emissiveTexture = new BABYLON.Texture('Assets/gate_illumination.png', scene); }); using the AssetsManager. Are there any playground samples readily available? Thank you for the assistance!
  6. Hello, When I use Blender and apply texture to some object - I can select an image from any folder. However, when I import scene to the BJS - it looks for all images in the folder where *.babylon file is. Import example: var meshTask = loader.addMeshTask("someName", "", "assets/", "myScene.babylon"); As a result - *.babylon file contains filenames only and BJS looks for them only in "assets/" + image_name.png. If we want to store images (and other files?) in a different separate folders - how it can be achieved? Because putting all Blender source files and all related files in one folder - not comfortable at all I see that Blender has a field with a relative path - maybe it can be exported/used somehow?
  7. Hi guys, I think I have problem how masking in PIXIjs works. I have this image of black horse And I would like to use masking in order to give it the color. Here is my code so far: const app = new PIXI.Application({backgroundColor: 0xFFFFFF}) document.body.appendChild(app.view) PIXI.loader.add('assets/horse.png').load(() => { const horse_sprite = new PIXI.Sprite(PIXI.loader.resources['assets/horse.png'].texture) const horse_mask = new PIXI.Graphics() horse_square.beginFill(0xFFaaFF) horse_square.drawRect(0, 0, 130, 130) horse_square.endFill() horse_mask.mask = horse // I can see the horse and the square if I comment this out app.stage.addChild(horse_mask) app.stage.addChild(horse_sprite) }) It's not working, I can't see anything, not a horse nor the square. Thanks
  8. Hi everyone, I'm actually working on an app using phaser. I receive inputs from a device and i need to draw the last 200 points received each frame. I looked all day trying various solutions with bitmapdata and render textures but i couldn't find any way to draw all thoose points at once, each time i check with the firfox's canvas inspector i get to 202 drawings with something like 800 calls, i'm totally lost. Could any one help me? Thank you in advance!
  9. Hello, Below is a PG for a scene I'm having problems with: https://playground.babylonjs.com/#X6KVNY I have a list of material definitions in JSON which I load with assetsManager, once this is loaded.. I then load a .babylon file. We then loop through each of the materials in the JSON file and if the material name matches that in the scene, it then change that material. Problem is, the scene displays before all the textures have loaded.. more noticable if you throttle the speed. In an ideal world, the spinning loading screen would show right up to the point that everything is ready, but I can't quite work out what I need to do. Yes, the textures & AO map are large, but this is really just to illustrate the problem better. Any help would be gratefully received. Thank you
  10. Hello, When I view a model exported from Blender with textures applied I have darkening to the UV seams / borders when you view closer to a tangent. Example is here: https://imgur.com/a/SLgda My textures are power of 2 (1024 x 2048 px). Does anyone have suggestions how to avoid this? The problem disappears when I remove the .ambientTexture (AO / lightmap). Thank you.
  11. Hey, I have an issue with loading textures using an .obj and .mtl file. There's over 300 textures that need to be loaded in. I've checked the developer console in chrome and it appears that BabylonJS does indeed load them in, but they're still appearing as black textures in the view-port. Check below for image: I've seen that this is a common issue with .obj and .mtl files. Just wondering if anyone actually has a solution for this? Pete.
  12. Félix Flores

    long loading time

    Hello again. I continue develop a site with babylonjs, but I have a few problems. I have a scene created with blender, I generate the babylon file, the scene has some textures, I converted the textures to a ktx format, with the script in the babylon page. You can see the page in: http://entornomexicano.com/ I import the scene with: if (!BABYLON.Engine.isSupported()){ console.log("Motor no soportado"); return; } canvas = document.getElementById("renderCanvas"); engine = new BABYLON.Engine(canvas, true); // Asignamos los tipos de textura compimidos que se pueden usar var available = ['-astc.ktx', '-dxt.ktx', '-pvrtc.ktx', '-etc1.ktx', '-etc2.ktx']; var formatUsed = engine.setTextureFormatToUse(available); BABYLON.SceneLoader.Load(blendPath + "scene1/", "landScape.babylon", engine, function (newScene) { // asignamos la escena scene = newScene; // Creamos el entorno y las luces createSkybox("models/scene1/sky2.jpg"); createWaterMesh("waterMesh", imgPath + "waterbump.png", new BABYLON.Vector3(0, -0.08, 0), 6, getMeshListToRender()); createCamera(1, new BABYLON.Vector3(-0.23, 0.56,-2.73), new BABYLON.Vector3(0, 0, 0)); // arch camera createParticleSystem(); createLights(); createShadows(); createVolumetricLightEffect(); createActionsContollers(); // Wait for textures and shaders to be ready scene.executeWhenReady(function () { // Quitamos la imagen del cargador cuando termine el proceso de carga $("#loaderPadre").remove(); scene.createOrUpdateSelectionOctree(); // quitamos los calculos de los objetos para hacer mas eficiente la escena scene.meshes.forEach(function (mesh) { if(mesh.name.search("NO_") === -1) mesh.freezeWorldMatrix(); }); // Funcion para cuando se redimensiona la ventana $(window).on('resize', function() { engine.resize(); }); // Once the scene is loaded, just register a render loop to render it engine.runRenderLoop(function() { // console.log(engine.getFps()); scene.render(); }); }); }, function (progress) { if(progress.total == 0) return; $(".textoCarga").text( ((progress.loaded/progress.total)*100).toFixed(2) + "%"); }); In the callback function I return the loadign progress, but in some devices the progres is too slow, and When I already have 100% the scene still takes time to show, maybe i have doing some wrong. Somebody know, What I can do for resolve that? And other problem is the performance of the scene, I rremoved some elements and I have down the quality of the shadows, but the fps is 30, How I can increase the speed? the complete code is in: https://github.com/flelix/entorno-models.git in the folder: entorno-models/code/proyBabylon/entorno/ here you can see the project. I hope you can help me. Thanks and regards.
  13. Hello guys . I have some issue whit image load texture. var panel = BABYLON.Mesh.CreateBox("panel", 0.2, scene); var panelMat = new BABYLON.StandardMaterial("panel1",scene); panelMat.diffuseTexture = new BABYLON.Texture("tpanel.png", scene); panel.material = panelMat; panel.scaling.z = 0.1; In developer tools always show me this : index.html:1 : Access to Image at 'file:///C:/Users/user/Desktop/trapbox/tvorbamodelov/tpanel.png' from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access. babylon.js:3 : BJS - [00:16:44]: Error while trying to load image: tpanel.png. I am new in this and I am trying to understand how BABYLON.JS works. Thank you in advance for your answers .
  14. Hi, I have a box mesh I make for steps, but it will vary in size depending upon user input. Right now, when I add a texture, since the texture stretches to cover a face, it gets distorted on the different faces of the step. ( pic attached ) I'd like to specify a set amount (ex: 2 units width, 2 units height ) and have the texture tile with those dimensions regardless of it's mesh's dimensions. So if the mesh is 2 units high & 5 units wide, the texture will automatically tile once vertically, and 2.5 times across. I can workaround this by calculating the `uScale` & `vScale` based on the mesh / texture's size but is there any built in method to accomplish this? I'd rather not have to track the texture's dimensions & do this every time, if possible
  15. Hi everybody. Here I come again with a new question for this incredible community. By the way, I think it will be "super easy" for someone which a good knowledge of the BJS internals. The case is that, following with my current development (tap simulator) I'm now focused on the performance. My doubts are mainly about the proper use of the method "clone" of the "Texture" object. Doubt 1) Suppose you have a Standard Material, you create it following the usual way, something like this: matFoo=new BABYLON.StandardMaterial("Foo_Material",myScene); matFoo.diffuseColor=new BABYLON.Color3(0,0,0); matFoo.opacityTexture=textFoo; matFoo.emissiveTexture=textFoo; Note that we are using the texture (textFoo) on two channels, opacity and emissive. Is this effective in terms of resource economy or I must follow this other approach?: matFoo=new BABYLON.StandardMaterial("Foo_Material",myScene); matFoo.diffuseColor=new BABYLON.Color3(0,0,0); matFoo.opacityTexture=textFoo.clone; matFoo.emissiveTexture=textFoo.clone; Doubt 2) Now we have a similar scenario, when we must assign a previously created texture, but this time we want to assign it to a series of Particles: ... textSprite=new BABYLON.Texture("assets/textures/flarealpha.png",myScene); ... myParticles=new BABYLON.ParticleSystem("Particles",10000,myScene); myParticles.emitter=new BABYLON.Vector3(0,0,0); myParticles.particleTexture=textSprite; ... This time, as we have a lot of particles chances are that it is better to use textSprite.clone() in order to assign the sprite image to each particle, at last line of shown code. Isn´t it? Doubt 3) Last but not least. When you (as me) arrives at the conclusion that PBR materials are the way-to-go (in order to achieve a decent look with your CGs), you are going to use, among others, the environment channel (dds files in current 3.0 version of BJS). Here I have certainly a doubt and a thought. Going first with the last, I think the environment should not be a PBR Material property (as currently is), but a scene one, as certainly is very weird to think in a scene with more than one environment (?). Anyway, as at the moment this is not the case, and we have to assign the same value of "environment" for each PBR Material, we find ourselves setting time after time the same texture (dds file) in this way (please focus only on the reflectionTexture property): ... matTube=new BABYLON.PBRMaterial("MaterialPBR_Tube",myScene); matTube.albedoTexture=new BABYLON.Texture("assets/models/Tubo_BaseColor.png",myScene); matTube.metallicTexture=new BABYLON.Texture("assets/models/Tubo_Metalico_PBR.png",myScene); matTube.bumpTexture=new BABYLON.Texture("assets/models/Tubo_Normal.png",myScene); matTube.reflectionTexture=textEnvironment; matTube.microSurface=0.96; matTube.useRoughnessFromMetallicTextureAlpha=false; matTube.useRoughnessFromMetallicTextureGreen=true; // matTap=new BABYLON.PBRMaterial("MaterialPBR_Tap",_Scene); matTap.albedoTexture=new BABYLON.Texture("assets/models/mono/Manetas_BaseColor.png",myScene); matTap.metallicTexture=new BABYLON.Texture("assets/models/mono/Manetas_Metallic_PBR.png",myScene); matTap.bumpTexture=new BABYLON.Texture("assets/models/mono/Manetas_Normal.png",myScene); matTap.reflectionTexture=textEnvironment; matTap.microSurface=0.96; matTap.useRoughnessFromMetallicTextureAlpha=false; matTap.useRoughnessFromMetallicTextureGreen=true; // matSprinkler=new BABYLON.PBRMaterial("MaterialPBR_Sprinkler",myScene); matSprinkler.albedoTexture=new BABYLON.Texture("assets/model/mono/Resto_BaseColor.png",myScene); matSprinkler.metallicTexture=new BABYLON.Texture("assets/models/mono/Resto_Metallic_PBR.png",myScene); matSprinkler.bumpTexture=new BABYLON.Texture("assets/models/mono/Resto_Normal.png",myScene); matSprinkler.reflectionTexture=textEnvironment; matSprinkler.microSurface=0.96; matSprinkler.useRoughnessFromMetallicTextureAlpha=false; matSprinkler.useRoughnessFromMetallicTextureGreen=true; ... Here, as in the case of my first doubt, I'm thinking, obviously in using "matXXX.reflectionTexture=textEnvironment.clone();", but I don´t know if that is a way to enhance performance, and by the way if dds files are buffered in a way they can benefit of texture cloning mechanism. Ok, this is all, sorry for the length of the question and, as always, thanks in advance for your time! Regards.
  16. Hi everybody: We're trying to use the BJS Editor in order to have PBR materials, as the Exporter (from Blender) doesn´t let use them. Our problem is that the resulting .babylon file generated by BJS Editor seems to include the textures as embedded ("base64String" property), resulting so in a huge .babylon file. In parallel, a clever reusing of textures (as .dds) is not possible, as they are all embedded time after time, with each scene. Is there any alternative to this workflow? Thanks for your time. Best regards. Addendum (real .babylon file excerpt): . . . { "tags": "added", "directIntensity": 1, "emissiveIntensity": 1, "environmentIntensity": 1, "specularIntensity": 1, "disableBumpMap": false, "albedoTexture": { "tags": null, "url": "tubo_basecolor.png", "uOffset": 0, "vOffset": 0, "uScale": 1, "vScale": 1, "uAng": 0, "vAng": 0, "wAng": 0, "isBlocking": true, "name": "tubo_basecolor.png", "hasAlpha": false, "getAlphaFromRGB": false, "level": 1, "coordinatesIndex": 0, "coordinatesMode": 0, "wrapU": 1, "wrapV": 1, "anisotropicFilteringLevel": 4, "isCube": false, "gammaSpace": true, "invertZ": false, "lodLevelInAlpha": false, "lodGenerationOffset": 0, "lodGenerationScale": 0.8, "isRenderTarget": false, "animations": [], "base64String": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAEAAAABAACAIAAAB9wbNAAAAACXBIWXMAAAsTAAALEwEAmpwYAAAgAElEQVR4nOzbQQ0AIRDAwCM5/5YXCTyhyYyCGuiamQ8AA . . ." }, . . .
  17. Hello, I'm asking because I'm not sure of my understanding the PIXI.basetexture WRAP_MODES: For example: given one container, one texture (loaded with loader) and one smaller sprite, defining PIXI.WRAP_MODES.REPEAT should fill the whole container, but it doesn't. The following code shows a sprite inbetween the container without repeating, what I'm doing wrong ? see WRAPMODE_TEST_HERE Thanks in advance PS: using PIXI 4.5.5 loader.load((loader, ressources) => { var texture = ressources.rgba.texture; texture.baseTexture.wrapMode = PIXI.WRAP_MODES.REPEAT; var sprite = new PIXI.Sprite(texture); sprite.width = 312 sprite.height = 312 stage.addChild(sprite); ... })
  18. I've been following this issue on and off - mainly through @JCPalmer's posts on various threads. There is also a tutorial on the BJS documentation site (written by JCP?) That tutorial gives a little bit of code to let the .babylon engine know that compressed textures are available: var available = ['-astc.ktx', '-dxt.ktx', '-pvrtc.ktx', '-etc2.ktx', '-etc1.ktx']; var formatUsed = engine.setTextureFormatToUse(available); But I have a couple of questions: 1. The BJS Blender Exporter will take the textures I have used in Blender (.png or .jpg usually) and the .babylon file created will include those pngs and jpgs. So will those two lines of automatically use a .ktx version instead - over-riding the .babylon file? 2. " The texture must be encoded with the Y-axis flipped ". Flipped so that is where the X axis was ie, 90 degrees, or mirrored on the Y axis? 3. Is the device being used automatically detected so that a low level compression format (etc1)will be used on certain processors but a higher level format (astc) be used where appropriate? I've done some tests on compression with a simple tiling png texture (570kb) and compressed it using the Mali Compression Tool and the results are impressive - a .ktx file size of 129kb (etc1) cheers, gryff
  19. Hi, Is there any way how can ToB exporter export (embed) textures in .js file ? Do Blender have any options to achive that? Or are texture always separated files? Greetings Ian @JCPalmer
  20. Following my previous post now I'm trying to use compressed textures to see if that will improve the performance on ipad 2 / mini gen 1. We are using texture packer to create the textures? What are the recommended pixel format settings? I tried a few that look very bad. How can I load an atlas with the texture? The current method doesn't seem to allow loading an atlas and several textures: https://photonstorm.github.io/phaser-ce/Phaser.Loader.html#texture Thanks for the help!
  21. Hello, this is my first post, but visit the forum for a while and am thrilled. :-) I'm currently working on a Babylon project and I'm using a CustomShader (ShaderMaterial) for the Meshes. Now I wanted to use mesh.dispose(); and mesh.material.dispose(); to remove the textures, but it does not work. Whenever I check the size with scene.textures.length, it becomes more and more. What helps?
  22. Hello all, I found this tutorial for, what seems like, a good way to create terrain textures in blender: https://www.youtube.com/watch?v=p4Dt2S6uMGM My question is about exporting this type of texture. If you don't watch the video, what is being done is a UV Map is being created, and a material with several tiled textures. There is also a stencil layer that masks layers of tiled textures. This seems to work great, since you get the benefit of a tiled textured. My questions are about how the current Blender Export to Babylon JS (4.6.1) works and if there is another way. I have not found this information yet. 1) When exporting this type of material with multiple textures, they seemed to get baked into a [filename]_[meshName]_TEXTURE.jpg. Not ideal, but this can work for now, but I am having troubles specifying the output resolution. Is there any documentation or tutorials on this? 2) Is there a way to achieve the method above without baking the textures? Such as blending different textures, if so is there documentation on this? I'm not currently trying to do infinite terrains, so I'm trying to work within this problem set at hand. Thank you, amorgan
  23. FREE Nice piece of work for your games Collection of over 50 FREE models from 3DModels-Textures (DEXSOFT-Games) production. Textures are downsized to 512*512px, ideal for mobile environments. https://www.3dmodels-textures.com/FREESFCorridors
  24. Hello, After updating Chrome my projects all look off, and I quickly found out its because webgl involuntarily scales some textures up when they are a bit far from the camera. The curious thing is it only does it to select materials, and doesn't affect other materials. It happens in different versions of Babylon.js. Please see the chimney texture below: close: farther, notice the stones appear much bigger than the previous screenshot: Also the trees texture is wrapped wrongly because of the aforementioned scaling. Is this something that can be fixed in Babylon js? Thanks
  25. When I try using shaders with textures I end up with WARNING: there is no texture bound to the unit 0 Sometimes I get so many it just stops 'cos there are too many webGL errors. http://www.babylonjs-playground.com/#TRNYD#16 I think the texture is not fully loaded when its being accessed.