Michuspo

Angular (2 and 4), BabylonJS and NPM

Recommended Posts

Hi,

I'm using BabylonJS in an Angular project. I used NPM and I have installed 3.0.7: 

"babylonjs": "^3.0.7",

I think the definition file is uncompleted, because a lot of properties are not available, like:

camera.alpha

But it happens in others properties, in materials, .....

Inside my node_module folder:

597e0080ea427_ScreenShot2017-07-30at17_35_15.png.35e65f3096389a08492d041a54b7f234.png

What do you think can be the problem?

Thanks!

 

Share this post


Link to post
Share on other sites

Thanks Brianzinn for your answer.

Yes, I'm using alpha in ArcRotateCamera, but it happens me with Materials too:

//Creation of a mirror material
var mirrorMaterial = new BABYLON.StandardMaterial("texture4", this._scene);
mirrorMaterial.diffuseColor = new BABYLON.Color3(0.4, 0.4, 0.4);
mirrorMaterial.reflectionTexture = new BABYLON.MirrorTexture("mirror", 512, this._scene, true); //Create a mirror texture
mirrorMaterial.reflectionTexture.mirrorPlane = new BABYLON.Plane(0, -1.0, 0, -10.0);

Property 'mirrorPlane' does not exist on type 'BaseTexture'

Another example: 

//Wall
var wall = BABYLON.Mesh.CreatePlane("wall", 20.0, this._scene);
wall.material = new BABYLON.StandardMaterial("wallMat", this._scene);
wall.material.emissiveColor = new BABYLON.Color3(0.5, 1, 0.5);

Property 'emissiveColor' does not exist on type 'Material'.

Any idea about can be the problem?

Thanks,

 

Share this post


Link to post
Share on other sites

This is weird because the d.ts is always in sync. I think more as an issue in your code:

mirrorMaterial.reflectionTexture = new BABYLON.MirrorTexture("mirror", 512, this._scene, true); 

//Create a mirror texture 
mirrorMaterial.reflectionTexture.mirrorPlane = new BABYLON.Plane(0, -1.0, 0, -10.0);

the complain from the compiler is fine. the reflectionTexture is flagged as BaseTexture. You should first cast it to MirrorTexture.

Share this post


Link to post
Share on other sites

I'm using same version of BabylonJS.  If I right-click on emissive color in editor and go to definition, it brings me right to:

class StandardMaterial extends PushMaterial {
... emissiveColor: Color3; (line 6060 of babylon.module.d.ts)

}

Not all materials support emissive color - StandardMaterial does.  Might be a code issue.

var wallMaterial = new BABYLON.StandardMaterial("wallMat", this._scene);
wallMaterial.emissiveColor = new BABYLON.Color3(0.5, 1, 0.5);

wall.material = wallMaterial

 

Edited by brianzinn
add code sample

Share this post


Link to post
Share on other sites

Hi,

Sorry, I'm still working on that without success! :)

I have a code that it is running in the playground: https://playground.babylonjs.com/#GWK0TQ#8

I'm trying to have the same in my Angular project. I have two problems:

1) Camera.Alpha:

light.position.x = Math.cos(this._camera.alpha + radiansFromCameraForShadows) * 10

2) BABYLON.GridMaterial

var grid = new BABYLON.GridMaterial("grid", this._scene);

What BJS version is running the playground? I was checking my installation and everything looks ok. Even, in the case of camera.alpha, I was checking the ts file, and it is there:

declare module BABYLON {
    class ArcRotateCamera extends TargetCamera {
        alpha: number;
        beta: number;
        radius: number;

Thanks for your help!

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.