Getting Started with WebGL and BabylonJs

Introduction

In this article, we will learn about WebGL and Babylon.js.

What is WebGL?

Definition from: [WebGL - Mozilla] (https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API) and khronos WebGL (Web Graphics Library) is a JavaScript API for rendering interactive 3D and 2D graphics within any compatible web browser without the use of plug-ins. WebGL does so by introducing an API that closely conforms to OpenGL ES 2.0.

1. It is a cross-platform, free web standard for 3D graphics API based on OpenGL ES.
2. It is exposed to ECMAScript via the HTML5 Canvas element. Developers familiar with OpenGL ES 2.0 will recognize WebGL as a Shader-based API using GLSL, with constructs that are semantically similar to those of the underlying OpenGL ES API.
3. It stays very close to the OpenGL ES specification, with some concessions made for what developers expect out of memory-managed languages such as JavaScript.
4. WebGL 1.0 exposes the OpenGL ES 2.0 feature set; WebGL 2.0 exposes the OpenGL ES 3.0 API. WebGL brings plugin-free 3D to the web, implemented right into the browser. Major browser vendors Apple (Safari), Google (Chrome), Microsoft (Edge), and Mozilla (Firefox) are members of the WebGL Working Group.

It is maintained by khronos.

What is Babylon.js?

Babylon.js is a Powerful, Beautiful, Simple, Open source Web-Based 3D WebGL-based graphics engine.

Pros:

1. Equipped with the powerful Inspector.
2. Best in class physically-based-rendering, countless optimizations.
3. Powerful, beautiful, simple, and open 3D to everyone on the web.

3D engine vocabulary or terms:

• A point in the 3D world = vertex.
• Multiple vertex = vertices.
• Vector3 (x,y,z) is used for a 3D position or a direction.
• Triangle = face
• 3D object = mesh

Setting up release build for Android platform

Conclusion

There are the steps to create a build for ionic 4 application and then you can host you application on Android store.

Comments: