Babylon.js

saalek110

saalek110

Well-Known Member
Babylon.js



www.babylonjs.com

Babylon.js: Powerful, Beautiful, Simple, Open - Web-Based 3D At Its Best

Babylon.js is one of the world's leading WebGL-based graphics engines. From a new visual scene inspector, best-in-class physically-based rendering, countless performance optimizations, and much more, Babylon.js brings powerful, beautiful, simple, and open 3D to everyone on the web.
www.babylonjs.com www.babylonjs.com



برای اجرای برنامه های بابیلون ، می توانید مثل من در infinityfree.com فضای مجانی بگیرید و کدهای تاپیک را با پسوند html در فایل منیجر هاست خود آپلود کنید..

یا اینکه نرم افزار زیر را نصب کنید در گوشی خود:

play.google.com

AWebServer ( Http Web Server A - Apps on Google Play

Http Web Server for Android based on Apache and with Php , MariaDb sql enabled.
play.google.com play.google.com

و دکمه start آن را بزنید و بعد فایل html را با بروسر خود باز کنید.
اگر در کامپیوتر و با ویندوز کار می کنید ، نرپ افزار xampp را نصب کنید.آموزش استفاده اش در سایتها هست. اونم دکمه هایی دارد.
در عکس زیر تصویر نرم افزار مذکور و دکمه ای که باید بزنید نشان داده شده.

Screenshot_۲۰۲۳-۰۹-۱۵_۱۱۵۴۴۲.jpg


من خودم فعلا از ادیتور زیر استفاده می کنم: ( البته اکثر ادیتورها قابل استفاده اند برای این کار)

play.google.com

ACE (All Code Editor) - Apps on Google Play

Create, modify code and plain text and preview HTML & JavaScript files.
play.google.com play.google.com

با این ادیتور می توانید فایل با پسوند html بسازید و یا در هاست خود آپلود کنید، یا با استفاده از نرم افزار سرورساز در گوشی خود باز کنید.
هر مشکلی در کار با هاست یا نرم افزارها داشتید در همین تاپیک بپرسید.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
برنامه آخر این صفحه
doc.babylonjs.com

Getting Started - Chapter 1 - Setup Your First Web App | Babylon.js Documentation

HTML Templates to load your first model or code into a Babylon.js scene.
doc.babylonjs.com doc.babylonjs.com
.
یک مکعب است که با لمس می شود چرخاند.

کد:
JavaScript: 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Babylon Template</title>

    <style>
      html,
      body {
        overflow: hidden;
        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
      }

      #renderCanvas {
        width: 100%;
        height: 100%;
        touch-action: none;
      }
    </style>

    <script src="https://cdn.babylonjs.com/babylon.js"></script>
    <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
    <script src="https://code.jquery.com/pep/0.4.3/pep.js"></script>
  </head>

  <body>
    <canvas id="renderCanvas" touch-action="none"></canvas>
    <!-- touch-action="none" for best results from PEP -->

    <script>
      const canvas = document.getElementById("renderCanvas"); // Get the canvas element
      const engine = new BABYLON.Engine(canvas, true); // Generate the BABYLON 3D engine

      // Add your code here matching the playground format
      const createScene = function () {
        const scene = new BABYLON.Scene(engine);

        BABYLON.MeshBuilder.CreateBox("box", {});

        const camera = new BABYLON.ArcRotateCamera("camera", -Math.PI / 2, Math.PI / 2.5, 15, new BABYLON.Vector3(0, 0, 0));
        camera.attachControl(canvas, true);
        const light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(1, 1, 0));

        return scene;
      };

      const scene = createScene(); //Call the createScene function

      // Register a render loop to repeatedly render the scene
      engine.runRenderLoop(function () {
        scene.render();
      });

      // Watch for browser/canvas resize events
      window.addEventListener("resize", function () {
        engine.resize();
      });
    </script>
  </body>
</html>
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
در برنامه پست قبل من هیچ فایلی کنار فایلم آپلود نکردم ،
در کد می بینید که لینک داده به سایت خودش و نیازی به فایل کناری ندارد.
 
saalek110

saalek110

Well-Known Member
در مورد قضاوت در مورد بابیلون،
با رسم یک مکعب نمیشه فهمید چقدر سبک و روان است. باید آبجکت های زیادی رسم کرد تا بشود قضاوت کرد.
 
saalek110

saalek110

Well-Known Member
JavaScript: 
<!doctype html>
<html>
   <head>
      <meta charset = "utf-8">
      <title> Babylon.JS : Demo2</title>
      <script src = "babylon.js"></script>
      <style>
         canvas { width: 100%; height: 100%;}
      </style>
   </head>
 
   <body>
      <canvas id = "renderCanvas"></canvas>
      <script type = "text/javascript">
         var canvas = document.getElementById("renderCanvas");
         var engine = new BABYLON.Engine(canvas, true);
         var createScene  = function() {
            var scene = new BABYLON.Scene(engine);
            scene.clearColor = new BABYLON.Color3(1, 0.8, 0.8);
           
            var camera = new BABYLON.ArcRotateCamera("Camera", 1, 0.8, 10, new BABYLON.Vector3(0, 0, 0), scene);
            scene.activeCamera.attachControl(canvas);
           
            var light0 = new BABYLON.PointLight("Omni", new BABYLON.Vector3(0, 0, 10), scene);
           
            var origin = BABYLON.Mesh.CreateSphere("origin", 10, 1.0, scene);
           
            var torus = BABYLON.Mesh.CreateTorus("torus", 5, 1, 10, scene, false);
           
            var box = BABYLON.Mesh.CreateBox("box", 3.0, scene);
            box.position = new BABYLON.Vector3(-5, 0, 0);
           
            var cylinder = BABYLON.Mesh.CreateCylinder("cylinder", 3, 3, 3, 6, 1, scene, false);
           
            cylinder.position = new BABYLON.Vector3(5, 0, 0);  
            return scene;
         };
         var scene = createScene();
         engine.runRenderLoop(function() {
            scene.render();
         });
      </script>
   </body>
</html>

منبع
www.tutorialspoint.com

BabylonJS - Basic Elements

BabylonJS Basic Elements - Babylon.js is a popular framework to help build 3D games for developers. It has built-in functions to implement 3D functionalities. Let us build a simple demo using Babylon.js and understand the basic functionalities required to get started.
www.tutorialspoint.com www.tutorialspoint.com
 
saalek110

saalek110

Well-Known Member
سالک: برنامه بالا اجرا نشد ، پس من اومدم مثل برنامه اولی ، کدهای زیر را:
JavaScript: 
    <script src="https://cdn.babylonjs.com/babylon.js"></script>
    <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
    <script src="https://code.jquery.com/pep/0.4.3/pep.js"></script>

مثل برنامه قبلی، قبل از
HTML: 
</head>
درج کردم ، و خط:
JavaScript: 
<script src = "babylon.js"></script>

را حذف کردم.

در اینجا آپلود شده:

نتیجه اجرا:
Screenshot_۲۰۲۳-۰۹-۱۴_۲۰۴۹۵۹.jpg

کد این اشکال را در کد پست قبل ببینید، دیگه واضح است و نیاز به توضیح نداد. ۴ تا شکل داریم ولی قبلش نور و دوربین هم داریم. من قبلا کمی گرافیک کار کردم و می دونم نور ودوربین نقششان چیه.
می توانید محل نور را یا دوربین را عوض کنید تا ببینید ، چه تغییری در شکل بالا اتفاق می افتد.

روبروی origin نوشته createsphere . پس کره است.
توروس هم اون شکلی است که دور کره قرار دارد(شبیه تیوب ماشین یا دوچرخه). مکعب و سیلندر هم که نیاز به توضیح ندارد.

مکان سیلندر و مکعب ، ببینید ۵ و منفی ۵ است. اگر این ۵ ها را نمی داد ، می افتادند روی کره و توروس. ولی برای توروس و کره مکان تعیین نکرده ، پس تکون نخوردند.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
JavaScript: 
var light0 = new BABYLON.PointLight("Omni", new BABYLON.Vector3(0, 16, 10), scene);

من نور را کمی بردم بالا ، تا روی اجسام هم روشن شود.در کد بالا ببینید ، عدد دوم را ۱۶ دادم. اون ۱۰ قبلا بود.
نتیجه را در عکس زیر می بینید:

Screenshot_۲۰۲۳-۰۹-۱۴_۲۱۲۴۰۰.jpg

حالت نور کمی رفته بالاتر را در لینک زیر ببینید:

 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member

Screenshot_۲۰۲۳-۰۹-۱۴_۲۱۲۷۴۴.jpg

JavaScript: 
            var camera = new BABYLON.ArcRotateCamera("Camera", 1, 0.8, 60, new BABYLON.Vector3(0, 0, 0), scene);

به جای ۱۰ قرار دادم ۶۰. می بینید دوربین دور شده و اجسام کوچک به نظر می رسند.

پس نقش نور و دوربین را متوجه شدید.

در بازیها ، مثلا دوربین متحرک می شود ، و گویی شما از دید بازیکن دارید محیط را می بینید.
با نور هم میشه بازی کرد ، و جلوه هایی ایجاد کرد. اینجا یک نور فقط داریم ولی میشه چند تا باشه ، مثلا نقش چراغ برقهای خیابان را بازی کند.

خوب ، حالا می توانید بروید بازی بسازید یا هر چیز دیگر.
می توانید لینک ساخته های خود را در همین تاپیک یا جای دیگر بگذارید تا همه ببینند.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
JavaScript: 
1    Box   
var box = BABYLON.Mesh.CreateBox(
   "box", 6.0, scene, false, BABYLON.Mesh.DEFAULTSIDE);
2    Sphere   
var sphere = BABYLON.Mesh.CreateSphere(
   "sphere", 10.0, 10.0, scene,
   false, BABYLON.Mesh.DEFAULTSIDE);
3    Plane   
var plane = BABYLON.Mesh.CreatePlane(
   "plane", 10.0, scene, false, BABYLON.Mesh.DEFAULTSIDE);
4    Disc   
var disc = BABYLON.Mesh.CreateDisc(
   "disc", 5, 30, scene, false, BABYLON.Mesh.DEFAULTSIDE);
5    Cylinder   
var cylinder = BABYLON.Mesh.CreateCylinder(
   "cylinder", 3, 3, 3, 6, 1, scene, false,
   BABYLON.Mesh.DEFAULTSIDE);
6    Torus   
var torus = BABYLON.Mesh.CreateTorus(
   "torus", 5, 1, 10, scene, false,
   BABYLON.Mesh.DEFAULTSIDE);
7    Knot   
var knot = BABYLON.Mesh.CreateTorusKnot(
   "knot", 2, 0.5, 128, 64, 2, 3, scene, false,
   BABYLON.Mesh.DEFAULTSIDE);
8    Line Mesh   
var lines = BABYLON.Mesh.CreateLines("lines", [
   new BABYLON.Vector3(-10, 0, 0),
   new BABYLON.Vector3(10, 0, 0),
   new BABYLON.Vector3(0, 0, -10),
   new BABYLON.Vector3(0, 0, 10)
], scene);
9    Dashes Lines   
var dashedlines = BABYLON.Mesh.CreateDashedLines(
   "dashedLines", [v1, v2, ... vn],
   dashSize, gapSize, dashNb, scene);
10    Ribbon   
var ribbon = BABYLON.Mesh.CreateRibbon(
   "ribbon",
   [path1, path2, ..., pathn],
   false, false, 0,
   scene, false,
   BABYLON.Mesh.DEFAULTSIDE);
11    Tube   
var tube = BABYLON.Mesh.CreateTube(
   "tube",
   [V1, V2, ..., Vn],
   radius, tesselation,
   radiusFunction,
   cap, scene, false,
   BABYLON.Mesh.DEFAULTSIDE);
12    Ground   
var ground = BABYLON.Mesh.CreateGround(
   "ground", 6, 6, 2, scene);
13    Ground From HeightMap   
var ground = BABYLON.Mesh.CreateGroundFromHeightMap(
   "ground", "heightmap.jpg", 200, 200, 250, 0, 10,
   scene, false, successCallback);
14    Tiled Ground   
var precision = {"w" : 2, "h" : 2};
var subdivisions = {'h' : 8, 'w' : 8};
var tiledGround = BABYLON.Mesh.CreateTiledGround(
   "Tiled Ground", -3, -3, 3, 3,
   subdivisions, precision, scene, false);

کد اشکال مختلف را در بالا می بینید.



BabylonJS - Basic Elements - Howcodex

BabylonJS - Basic Elements - Babylon.js is a popular framework to help build 3D games for developers. It has built-in functions to implement 3D functionalities. Let us build a simple demo u
www.howcodex.com www.howcodex.com
 
saalek110

saalek110

Well-Known Member

Screenshot_۲۰۲۳-۰۹-۱۵_۰۲۰۹۴۷.jpg

JavaScript: 
<!doctype html>
<html>
   <head>
      <meta charset = "utf-8">
      <title>BabylonJs - Basic Element-Creating Scene</title>
     
      <style>
         canvas {width: 100%; height: 100%;}
      </style>
          <script src="https://cdn.babylonjs.com/babylon.js"></script>
              <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
                  <script src="https://code.jquery.com/pep/0.4.3/pep.js"></script>
                 
   </head>

   <body>
      <canvas id = "renderCanvas"></canvas>
      <script type = "text/javascript">
         var canvas = document.getElementById("renderCanvas");
         var engine = new BABYLON.Engine(canvas, true);
         var createScene  = function() {
            var scene = new BABYLON.Scene(engine);
            scene.clearColor = new BABYLON.Color3(0, 1, 0);
       
            var camera = new BABYLON.ArcRotateCamera("Camera", 1, 0.8, 10, new BABYLON.Vector3(0, 0, 0), scene);
            scene.activeCamera.attachControl(canvas);
       
            var light = new BABYLON.PointLight("Omni", new BABYLON.Vector3(0, 100, 100), scene);

            var boxa = BABYLON.Mesh.CreateBox("BoxA", 1.0, scene);
            boxa.position = new BABYLON.Vector3(0,0.5,0);

            var boxb = BABYLON.Mesh.CreateBox("BoxB", 1.0, scene);
            boxb.position = new BABYLON.Vector3(3,0.5,0);      
            boxb.scaling = new BABYLON.Vector3(2,1,2);

            var boxc = BABYLON.Mesh.CreateBox("BoxC", 1.0, scene);
            boxc.parent = boxb;
            boxc.position.z = -3;
       
            var ground = BABYLON.Mesh.CreateGround("ground1", 10, 6, 2, scene);
            ground.position = new BABYLON.Vector3(0,0,0);
            return scene;
         };
         var scene = createScene();
         engine.runRenderLoop(function() {
            scene.render();
         });
      </script>
   </body>
</html>


BabylonJS - Basic Elements - Howcodex

BabylonJS - Basic Elements - Babylon.js is a popular framework to help build 3D games for developers. It has built-in functions to implement 3D functionalities. Let us build a simple demo u
www.howcodex.com www.howcodex.com

همان طور که می بینید در کد گراند استفاده شده.
با تاچ می شود صحنه را چرخاند.

کد گویا ۳ مکعب و یک گراند دارد.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member

Screenshot_۲۰۲۳-۰۹-۱۵_۰۲۲۷۴۷.jpg


JavaScript: 
<!doctype html>
<html>
   <head>
      <meta charset = "utf-8">
      <title> Babylon.JS : Demo</title>
      <style>
         canvas { width: 100%; height: 100%;}
      </style>
<script src="https://cdn.babylonjs.com/babylon.js"></script>
<script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
<script src="https://code.jquery.com/pep/0.4.3/pep.js"></script>   
   </head>

   <body>
      <canvas id = "renderCanvas"></canvas>
      <script type = "text/javascript">
         var canvas = document.getElementById("renderCanvas");
         var engine = new BABYLON.Engine(canvas, true);
         var createScene  = function() {
            var scene = new BABYLON.Scene(engine);
            var light = new BABYLON.PointLight("Omni",
            new BABYLON.Vector3(10, 50, 50), scene);
          
            var camera = new BABYLON.ArcRotateCamera("Camera", 0.4, 1.2, 20, new BABYLON.Vector3(-10, 0, 0), scene);
            camera.attachControl(canvas, true);

            var material1 = new BABYLON.StandardMaterial("mat1", scene);
            material1.diffuseTexture = new BABYLON.Texture("images/tsphere.jpg", scene);

            var sphere = BABYLON.Mesh.CreateSphere("red", 32, 2, scene);
            sphere.setPivotMatrix(BABYLON.Matrix.Translation(2, 0, 0));
            sphere.material = material1;     

            // Fog
            scene.fogMode = BABYLON.Scene.FOGMODE_EXP;
            scene.fogColor = new BABYLON.Color3(0.9, 0.9, 0.85);
            scene.fogDensity = 0.01;

            //skybox     
            var skybox = BABYLON.Mesh.CreateBox("skyBox", 100.0, scene);
          
            var skyboxMaterial = new BABYLON.StandardMaterial("skyBox", scene);
            skyboxMaterial.backFaceCulling = false;
          
            skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture("images/cubetexture/skybox", scene);
            skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE;
          
            skyboxMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
          
            skyboxMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
          
            skyboxMaterial.disableLighting = true;
            skybox.material = skyboxMaterial;


            var spriteManagerPlayer = new BABYLON.SpriteManager("playerManager", "images/plane.png", 8, 1000, scene);
          
            var plane = new BABYLON.Sprite("plane", spriteManagerPlayer);
            plane.position.x = -2;
            plane.position.y = 2; 
            plane.position.z = 0; 


            var alpha = 0;
            var x = 2;
            var y = 0;
            scene.registerBeforeRender(function () {
               scene.fogDensity = Math.cos(alpha) / 10;
               alpha += 0.02;
               sphere.rotation.y += 0.01;
               y += 0.05;
               if (x > 50) {
                  x = -2;
               }
               plane.position.x = -x;
               x += 0.02;
            });
            return scene;
         };
         var scene = createScene();
         engine.runRenderLoop(function() {
            scene.render();
         });
      </script>
   </body>
</html>

BabylonJS - Basic Elements - Howcodex

BabylonJS - Basic Elements - Babylon.js is a popular framework to help build 3D games for developers. It has built-in functions to implement 3D functionalities. Let us build a simple demo u
www.howcodex.com www.howcodex.com

تصویر سایت با مال من فرق داره.چون عکسها را من کنارش نگذاشتم. فعلا دنبال تهیه عکسها و استفاده از اون نیستم. در سایت چند تا عکس گذاشته ، می توانید در کارهای خود استفاده کنید.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member

BabylonJS - Basic Elements - Howcodex

BabylonJS - Basic Elements - Babylon.js is a popular framework to help build 3D games for developers. It has built-in functions to implement 3D functionalities. Let us build a simple demo u
www.howcodex.com www.howcodex.com

basic_material_property_fresnelparameters.jpg

کد این یکی را فعلا نقل نمی کنم در سایت اصلی هست می توانید خودتان ببینید.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member

BabylonJS - Animations - Howcodex

BabylonJS - Animations - Animation makes a scene more interactive and also makes it impressive giving realistic look to it. Let us now understand animation in detail. We will apply anim
www.howcodex.com www.howcodex.com

این صفحه هم چند تا کد و یک سری عکس داره ، که من رد میشم ازش فعلا.
 
saalek110

saalek110

Well-Known Member
حدود ۲۰ صفحه دیگه هست ، که در هر صفحه چیزهایی را کار کرده. خیلی سایت جالبی است.
فکر کنم با آموزشهای این سایت بازیهای کامل و زیبایی بشه ساخت. ولی یک نکته که می مونه روانی و سبکی اجرای بازی وقتی آبجکت هایش زیاد میشه هست. یک راه اینه یک بازی کامل بسازی و توانایی بازی ساز را ببینی...
البته طرز ساخت بازی هم خیلی مهمه ، یک نفر می تونه با ترفندهایی بازی خوب و گسترده ولی در عین حال سبک خلق کنه.
یک نکته اش اینه که جایی که دوربین و بازیکن نیست ، آبجکت ها را رسم نکنیم تا بی جهت فشار به سیستم نیاید.

نمی دانم با بابیلون چه کارهایی میشه کرد، تا انجام ندهیم معلوم نمیشه ، ولی همین یک سایت کلی چیزها در اختیارمون گذاشته. و ممکنه سایت های آموزشی بهتر از این هم باشه.




اگر اشکالی در این بازی ساز نباشه ،( البته نباید اسم بازی ساز را داد، چون میشه ازش استفاده های دیگر هم کرد ولی من به چشم بازی ساز بهش نگاه می کنم...) با همین آموزش های همین یک سایت خیلی کارها جالبی میشه ساخت.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
سالک: من دیگه به ترتیب جلو نرفتم و رفتم سراغ فیزیک....

BabylonJS - Physics Engine
www.tutorialspoint.com

BabylonJS - Physics Engine

BabylonJS Physics Engine - Babylon.js has plugin system for Physics engine which helps to add interactions to the scene.It shows the collision and bouncing between 2 objects and makes it more like real life interaction.The demo will show the balls colliding with each other and moving around with...
www.tutorialspoint.com www.tutorialspoint.com

تکسچر چوب را خود سایت برای دانلود گذاشته ، نیازی به گشتن ندارد. در پوشه images کنار فایل قرار دهید.

Screenshot_۲۰۲۳-۰۹-۱۵_۱۲۴۷۵۴.jpg

تصویر بالا متحرک بود ولی من فقط عکس گرفتم، توپها به تخته می خورد و به بالا برمیگشت.
جالب اینکه توپ هاییکه به لبه تخته می خورند کمونه می کنند و به بالا برنمی گردند و افقی یا زاویه دیگر می روند.

JavaScript: 
<!doctype html>
<html>
   <head>
      <meta charset = "utf-8">
      <title>BabylonJs - Ball/Ground Demo</title>
      <script type = "text/javascript" src="https://cdn.babylonjs.com/Oimo.js"></script>
 
      <style>
         canvas {width: 100%; height: 100%;}
      </style>
      <script src="https://cdn.babylonjs.com/babylon.js"></script>
      <script src="https://cdn.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>
      <script src="https://code.jquery.com/pep/0.4.3/pep.js"></script>
   </head>

   <body>
      <canvas id = "renderCanvas"></canvas>
      <script type = "text/javascript">
         var canvas = document.getElementById("renderCanvas");
         var engine = new BABYLON.Engine(canvas, true);
         var v3 = BABYLON.Vector3;
 
         var createScene = function () {
            // This creates a basic Babylon Scene object (non-mesh)
            var scene = new BABYLON.Scene(engine);

            var camera = new BABYLON.ArcRotateCamera("Camera", 0.86, 1.37, 250, BABYLON.Vector3.Zero(), scene);
   
            camera.attachControl(canvas);
            camera.maxZ = 5000;
            camera.lowerRadiusLimit = 120;
            camera.upperRadiusLimit = 430;
            camera.lowerBetaLimit =0.75;
            camera.upperBetaLimit =1.58 ;

            new BABYLON.HemisphericLight("hemi", new BABYLON.Vector3(0, 1, 0), scene);

            var randomNumber = function (min, max) {
               if (min == max) {
                  return (min);
               }
               var random = Math.random();
               return ((random * (max - min)) + min);
            };

            var mat = new BABYLON.StandardMaterial("ground", scene);
            var t = new BABYLON.Texture("images/gr1.jpg", scene);
            t.uScale = t.vScale = 10;
            mat.diffuseTexture = t;
            mat.specularColor = BABYLON.Color3.Black();
   
            var g = BABYLON.Mesh.CreateBox("ground", 200, scene);
   
            g.position.y = -20;
            g.position.x = 0
            g.scaling.y = 0.01;
            g.material = mat;
   
            scene.enablePhysics(new BABYLON.Vector3(0, -10, 0), new BABYLON.OimoJSPlugin());
   
            g.physicsImpostor = new BABYLON.PhysicsImpostor(g, BABYLON.PhysicsImpostor.BoxImpostor, {
               mass: 0,
               restitution: 0.9
            }, scene);
   
            var getPosition = function(y) {
               return new v3(randomNumber(-100, 100), y, randomNumber(-100, 100));
            };
   
            var allspheres = [];
            var y = 50;
            var max = 50;
   
            for (var index = 0; index < max; index++) {
               var redSphere = BABYLON.Mesh.CreateSphere("s" + index, 32, 8, scene);
               redSphere.position = getPosition(y);
               redSphere.physicsImpostor = new BABYLON.PhysicsImpostor(redSphere, BABYLON.PhysicsImpostor.SphereImpostor,{
                  mass: 1, restitution:0.9
               }, scene);
     
               redSphere.physicsImpostor.applyImpulse(new BABYLON.Vector3(1, 2, -1), new BABYLON.Vector3(1, 2, 0));
     
               var redMat = new BABYLON.StandardMaterial("ground", scene);
               redMat.diffuseColor = new BABYLON.Color3(0.4, 0.4, 0.4);
               redMat.specularColor = new BABYLON.Color3(0.4, 0.4, 0.4);
               redMat.emissiveColor = BABYLON.Color3.Red();
               redSphere.material = redMat;
     
               // push all spheres in the allspheres variable
               allspheres.push(redSphere);  
               y += 10; // increment height
            }
            scene.registerBeforeRender(function() {
               allspheres.forEach(function(obj) {
                  // if the sphers falls down its updated again over here
                  // If object falls
                  if (obj.position.y < -100) {
                     obj.position = getPosition(200);      
                  }
               });
            })
            return scene;
         };
         var scene = createScene();
         engine.runRenderLoop(function() {
            scene.render();
         });
      </script>
   </body>
</html>
 
آخرین ویرایش:
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا