Search the Community

Hey, I'm trying to translate a very simple Shader from ThreeJs to PixiJs, but I'm struggling to figure out how I can convert this parameter to PixiJS: gl_Position = projectionMatrix * modelViewMatrix * vec4( position.x, position.y, sin(uTime*0.4 + (position.y) * vWave), 1.0 ); Here is the Example in ThreeJs: ( https://jsfiddle.net/Noturnoo/sn6q3pfk/5/ ) And here's my result in Pixi: ( https://jsfiddle.net/Noturnoo/d6pgmsk5/ ) Vertex in Three: uniform float uTime; uniform float waveLength; varying vec2 vUv; void main() { vUv = uv; lowp float vWave = sin((position.y) * waveLength); vec3 newPosition = position; gl_Position = projectionMatrix * modelViewMatrix * vec4( position.x, position.y, sin(uTime*0.4 + (position.y) * vWave), 1.0 ); } Vertex in PixiJS: attribute vec2 aVertexPosition; uniform float time; uniform float waveLength; uniform mat3 projectionMatrix; uniform mat3 translationMatrix; varying vec2 vTextureCoord; uniform vec4 inputSize; uniform vec4 outputFrame; void main(void) { vec2 position = aVertexPosition * max(outputFrame.zw, vec2(0.)) + outputFrame.xy; lowp float vWave = sin(time*0.1 + (position.y) * waveLength); //vWave = clamp(vWave, 0.6, 1.); gl_Position = vec4((projectionMatrix * vec3(position, 1.0)).xy, 0.0 , 1.0); vTextureCoord = aVertexPosition * (outputFrame.zw * inputSize.zw); gl_Position = vec4((projectionMatrix * vec3(position.x, position.y, 1.0)).xy, 0.0 , vWave); } Any idea how to solve it? Thanks in Advance.

Hello all, I am trying to learn Babylon.js by making a simple game. But I have a problem. Some of the tiles I drew in Max2017 export wrong to babylon.js. Export to Substance Painter using a .FBX works and gives no problems. They are simple models and I don't see any faults, I have attached an image how it looks in Max and made a playground how it looks in Babylon.js, at some angles you can see through the faces to see the parts behind it. http://www.babylonjs-playground.com/#1UQADD#6 Can anybody see what I am doing wrong?

Howdy, I seem to be having some bit of difficulty in getting the vertex data from an imported gltf asset via the asset manager. The loadedMeshes don't seem to expose the underlying meshes in a way that allows me to grab the vertices. Am I doing something wrong? Any playgrounds out there that might be of use here? JPS

How do you create specific Ribbon or Path shapes? Has any one created "Mesh Editing" within Babylon? UPDATE: this caused a deeper dive into collisions.... a lot like falling down stairs. @Wingnut had a good idea providing this link, http://www.babylonjs-playground.com/#1UHFAP#7 I think I'll give it a try. -> Adding pick points and rudimentary key commands to move a vertex in 6 directions... Any Ideas on "Mesh Editing", or other previous vertex picking (position vertex with ui) attempts? Thx...

Hi , I have problem to pass matrix to uniform variable in shader ! Can anyone tell me what is worng. I try by using "getUniformLocation" but when using this webgl function i get error that i not using current web gl programm. Thanks !!!

function addSphere(scene, { x, y, z }: Object, diameter: number = 0.05, color = new BABYLON.Color3(0, 0, 0)) { const sphere = BABYLON.MeshBuilder.CreateSphere("sphere", { diameter }, scene); const material = new BABYLON.StandardMaterial("texture1", scene); material.diffuseColor = color; sphere.position = new BABYLON.Vector3(x, y, z); sphere.material = material; } const positions = mesh.getVerticesData(BABYLON.VertexBuffer.PositionKind); const zeroCoord = { x: positions[0], y: positions[1], z: positions[2], }; addSphere(scene, zeroCoord, 1); Demo As you can see in the code, I am just trying to get vertices of the foot. and the placing a sphere on the first vertice of the foot. But for some reason, as can be seen in demo, the sphere is added somewhere not even remotely close of the foot. You can download the mesh here. Why is this happening ? I've been trying to fix this for two days now, but I can't seem to do it. Edit: I am using babylonjs exported for blender. Edit2: Added playground url https://www.babylonjs-playground.com/#EEKFSK#2

Hi, I need help with shaders in pixi . I trying to translate and rotate sprite with shaders. I am using PIXI.Filter but I can find any example with vertex shaders(only fragmet examples ). If someone can provide some example . Thanks

Are there any examples of how to apply a texture to an individual vertex as is described in this tutorial: http://babylonjsguide.github.io/advanced/Facets

Hello everybody! I'd like to create a terrain that is moving in cycle generated from height map in effective way. I created mesh with new BABYLON.Mesh.CreateGroundFromHeightMap('ground', "http://i1198.photobucket.com/albums/aa455/BelindaSaxondale/album/HeightMap.jpg", 200, 200, 50, -20, 20, scene, true); So I have 200x200 plane with 50 subdivisions. Then I registered before render function in which I take first 51*3 points (51 vertices, cause there is 51*51 vertices) and put it at the end of position array of vertices data of mesh. So it should move the terrain in the cycle, but maybe I'm doing something wrong. Here is my playground: http://www.babylonjs-playground.com/#1CUE8G#5 . I achived something like this here: http://www.babylonjs-playground.com/#1CUE8G#3 but I don't think it's effective way.

I've read the code written by the awesome @Temechon, which addresses modifying the vertices in a mesh. However, I don't understand exactly how to create one such mesh from scratch, especially in such a way that it can be updated frequently with new vertex data. Could someone explain that more clearly? (Also, does BabylonJS have a way to use a VBO for such a task?) I'd post example code, but I don't really have anything that even begins to work yet. EDIT: Clarification. I know the logic and steps needed to create a mesh using vertices and the like. What I don't know is how one applies the arrays to the mesh itself, or how to create the mesh so the vertices can be updated.

Hello fellow BabylonJS users, I'm currently using babylon to put some product visualizations on the web, but today I ran into a problem that I didn't find to be documented anywhere. I got a poly-reduced CAD-data rip with custom vertex normals, in Blender everything looks nice and smooth, but when I export to babylon, all those data seemsto be lost. Do you have any idea how to fix this? I'll attach an image, showing the dataloss. Have a nice day, J

Hi, I am a novice on Babylon. I explain my problem, I created a plane with some vertices with Blender and then I export it in Babylon.What give us this, a grid of vertices (vertices ? i'm not sure if it is called vertices, vertex, intersections, dots, or other name) : I want to create an animation which make the vertice move. (An animation on a vertice, not on the all mesh) I can get an array including all the position of each vertices (x, y, z) : [0.8603,0,0.8436,1,0,0.75,1,0,1,-0.0401,0,0.8269,0,0,1,-0.25,0,1,-0.25,0,-0.25,0,0,-0.25,-0.0702,0,-0.1036,0.6698,0,-0.2934,1,0,-0.25,1,0,0,0.3603,0,-0.1564,0.5,0,-0.25,0.5969,0,0.0835,0.4031,0,-0.6832,0.5,0,-0.5,0.3068,0,-0.5568,1,0,-0.75,1,0,-0.5,0.6598,0,-0.6905,-0.613,0,-0.1865,-0.5468,0,-0.3636,-0.5,0,0,-0.6531,0,-0.6665,-0.6103,0,-0.8402,-0.5,0,-0.5,-0.1003,0,-0.6731,-0.0501,0,-0.4198,-0.25,0,-0.5,-0.5,0,0.75,-0.5,0,1,-0.75,0,1,-0.4165,0,0.3035,-0.5501,0,0.5802,-0.75,0,0.5,-0.1404,0,0.1798,0,0,0.5,-0.25,0,0.5,0.4031,0,0.8168,0.5,0,1,0.25,0,1,0.5,0,0.25,0.5,0,0.5,0.2934,0,0.4131,0.8736,0,0.3904,1,0,0.25,1,0,0.5,0.6497,0,0.5769,0.75,0,0.0936,0.1531,0,0.3168,0.25,0,0,0.25,0,0.75,-0.3703,0,0.3035,-0.2066,0,-0.0869,-1,0,0.25,-0.8202,0,0.1464,-1,0,0,-0.75,0,0.0936,-1,0,0.75,-0.6932,0,0.6932,-0.2901,0,-0.6731,-0.5,0,-1,-0.25,0,-1,0,0,-1,-1,0,-0.75,-0.8603,0,-0.5902,-0.75,0,-1,-1,0,-0.25,0.75,0,-0.887,0.5,0,-1,0.75,0,-1,1,0,-1,0.1999,0,-0.7934,0.25,0,-1,-0.1932,0,0.6932,0.75,0,1,-1,0,0.5,-1,0,1,-1,0,-0.5,-1,0,-1] I know it is possible to extract the 3 coordinates of each vertice to create a vector3 for exemple. But I don't know how to make the animation. The animations seem working only on Mesh, but not on vectors, vertice or others. I have the idea to create 2 planes. The first with the initials coordinates of the vertices. The second plane with modified coordinates.And then, create an interpolation between the both plane, but I don't know how to do that. Can you help me ? Thanks

Hi, I am attempting to export a blender file using the babylon.js exporter. My mesh contains an armature with incomplete and basic rigging, during my attempts to export the following situations occur: 1. processing complete of skeleton: Armature processing begun of mesh: characterWARNING: Maximum # of influencers exceeded for a vertex, extras ignored^repeated many many times 2. num positions : 65535num normals : 65535num uvs : 131070num uvs2 : 0num colors : 0num indices : 65535num skeletonWeights: 262140num skeletonIndices: 262140WARNING: The following mesh has exceeded the maximum # of vertex elements & will be broken into multiple Babylon meshes: character========= An error was encountered ========= File "C:\Program Files\Blender Foundation\Blender\2.72\scripts\addons\io_export_babylon.py", line 247, in execute mesh = Mesh(object, scene, self.multiMaterials, nextStartFace, forcedParent, nameID) File "C:\Program Files\Blender Foundation\Blender\2.72\scripts\addons\io_export_babylon.py", line 491, in __init__ self.name = object.name + nameIDERROR: Can't convert 'int' object to str implicitly========= end of processing ========= These two errors prevent me from exporting my man into babylon. Any advice as to how to proceed would be greatly appreciated, Thanks Joe

hello there, since this is my first post: kudos to deltakosh et al for this great work. my question is, how can i add custom attributes (buffers) to my shaders? it seems like normals, positions and uv's just magically surface when needed - yes, they're quite cleverly integrated and hidden from the developer. now i know i can cheat the system and use for example normals to send additional data to my vertex shader... but then i can't use the normal data for their original purpose anymore =p i don't want to read and understand the source code... because that is not what you're supposed to do when using a framework. if i wanted to do that, i would write my own low level framework. and -- for the life of me i can't find the info from the documentation. can anyone at least point me to the right direction?