Water Material
Water material can be found here: https://cdn.babylonjs.com/materialsLibrary/babylon.waterMaterial.js
A demo can be found here: PG: Water Material
The water material needs at least only a bump texture to render properly. Just create a new reference of the material and assign its bump texture:
javascript
var ground = BABYLON.MeshBuilder.CreateGround("ground", { width: 512, height: 512, subdivisions: 32 }, scene);
var waterMaterial = new BABYLON.WaterMaterial("water_material", scene);waterMaterial.bumpTexture = new BABYLON.Texture("bump.png", scene); // Set the bump texture
ground.material = waterMaterial;
To reflect and refract the world, you just have to add the wanted meshes to the render list:
javascript
waterMaterial.addToRenderList(skybox);waterMaterial.addToRenderList(mesh1);waterMaterial.addToRenderList(mesh2);// ... etc.
That's all.
You can customize special properties of the material:
javascript
waterMaterial.windForce = 45; // Represents the wind force applied on the water surfacewaterMaterial.waveHeight = 1.3; // Represents the height of the waveswaterMaterial.bumpHeight = 0.3; // According to the bump map, represents the pertubation of reflection and refractionwaterMaterial.windDirection = new BABYLON.Vector2(1.0, 1.0); // The wind direction on the water surface (on width and height)waterMaterial.waterColor = new BABYLON.Color3(0.1, 0.1, 0.6); // Represents the water color mixed with the reflected and refracted worldwaterMaterial.colorBlendFactor = 2.0; // Factor to determine how the water color is blended with the reflected and refracted worldwaterMaterial.waveLength = 0.1; // The lenght of waves. With smaller values, more waves are generated