为babylon.js场景创建模块

时间:2016-08-03 15:41:01

标签: javascript module babylonjs

这是第一个外部JavaScript"模块"我试图建立。我用Babylon.js创建了一个空间场景。我没有图书馆本身的麻烦。这与我对使用模块不了解的事情有关。我想要做的是将构造函数放在另一个文件中。这个构造函数的实例将创建我设计的这个星形网格。如果我将构造函数保留在文件中,它可以工作。如果我把它放在另一个名为Star.js的文件中,然后将其放在标题的脚本标记中,页面会加载白色空白。

我也尝试用括号中的匿名函数来解读它的括号......似乎无关紧要,我觉得它应该可行。

这里有什么文件......(解包)

var Star = function (position) {
this.sphere = BABYLON.Mesh.CreateSphere("sphere1", 50, 100, scene);
this.mat = new BABYLON.StandardMaterial("white", scene);
this.mat.diffuseTexture = new BABYLON.Texture("textures/suntexture.jpg", scene);
this.mat.specularColor = new BABYLON.Color3(0, 0, 0);
this.sphere.material = this.mat;
this.sphere.position = position;

this.particleSystem = new BABYLON.ParticleSystem("particles", 15000, scene);
this.particleSystem.particleTexture = new BABYLON.Texture("textures/fireflare.jpg", scene);
this.particleSystem.emitter = this.sphere;
this.particleSystem.color1 = new BABYLON.Color4(0.984, 0.337, 0.047, 1);
this.particleSystem.color2 = new BABYLON.Color4(0.984, 0.757, 0.047, 1);
this.particleSystem.minSize = 8;
this.particleSystem.maxSize = 30;
this.particleSystem.minLifeTime = 0.5;
this.particleSystem.maxLifeTime = 0.8;
this.particleSystem.emitRate = 15000;
this.particleSystem.direction1 = new BABYLON.Vector3(-120, -120, -120);
this.particleSystem.direction2 = new BABYLON.Vector3(120, 120, 120);
this.particleSystem.minAngularSpeed = 0;
this.particleSystem.maxAngularSpeed = Math.PI;
this.particleSystem.minEmitPower = 1;
this.particleSystem.maxEmitPower = 3;
this.particleSystem.updateSpeed = 0.01;
this.particleSystem.start();
};

这是文件外观(相关部分)的剪辑版本

<head>
<script src="js/babylon.js" ></script>
<script src="js/star.js" ></script>
</head>
<body>
<canvas id="renderCanvas"></canvas>
<script>

var star1 = new Star(new BABYLON.Vector3(500, 500, 1000));
var star2 = new Star(new BABYLON.Vector3(0, -100, 200));
var star3 = new Star(new BABYLON.Vector3(-600, 200, 1200));
</script>

我已经阅读了很多关于JS模块的内容......但是,尽管您可以搜索,阅读和搜索并尝试找到答案,但是当您尝试构建它时,它会有所不同你自己,因为那里有一条你没有的信息......我将在不同的文件夹中以这种方式设计整个场景作为我的第一个重大项目,所以我的理解非常重要 THX

1 个答案:

答案 0 :(得分:0)

这不是模块化的问题,而是scene变量的不幸事件。

我猜测scene是您脚本文件中的一个变量,只要您的Star构造函数保留在同一个文件中就可以了。

构造函数定义了一个参数(position),但也没有定义scene

一旦你将scene传递给构造函数,它就可以工作。

查看working code sample here