Using babylon.canvas2d

[Tobi]

I recently installed the latest npm babylon package which includes babylon.canvas2d.d.ts and babylon.canvas2d.js files in the node_modules directory. 

I've been trying to use ScreenSpaceCanvas2D from the canvas2d with no luck. I'm importing babylon using this import * as BABYLON from "babylonjs";

Do i have to have a separate import for Canvas2d in order to use ScreenSpaceCanvas2D? At a lost? Does some one have a example on how to import Canvas and use it within Typescript?

Thanks, 

Tobi.

[brianzinn]

Hi Tobi,

I think you would need to do

import { ScreenSpaceCanvas2D } from 'babylonjs/babylon.canvas2d'

I never got it working in ES6 or TypeScript.  Good luck - let me know if you can figure it out.  Deltakosh has suggested adding this to the end of Canvas2d.js, but it didn't help me:

if (((typeof window != "undefined" && window.module) || (typeof module != "undefined")) && typeof module.exports != "undefined") {
    module.exports = BABYLON.Canvas2D;
};

I think you will find similar issues if you try to show the debug window, which I also lost after switching from 2.5.  Would be really interested to hear from somebody who has this working.  Cheers.

[Tobi]

Thanks Brianzinn!

Unfortunately i had no luck with the above suggestion. Atom keeps telling me babylon.canvas2d is not a module. It's being declare as "module BABYLON" within the babylon.canvas2d.d.ts definition file which shares the same namespace as the babyon.d.ts file.

It seems like the babylon.module.d.ts does not define any of the canvas2d classes which makes sense, so should canvas2d have it's on babylon.module file? 

[brianzinn]

Hi Tobi,

I don't know if it necessarily makes sense that babylon.module.d.ts does not define (or export) the canvas2d classes. I think v4 of d3 declares all their libraries (separate npm modules?) from their main module (https://github.com/d3/d3/blob/master/index.js).  Anyway, I wasn't trying to suggest that the 'babylonjs/babylon.canvas2d' import would work, just that it is a separate file in the npm module (and I have imported other separate modules in this same manner on other projects).  I did not devote too much time on this yet as I have managed so far and actually started writing a lot of my own canvas2d stuff, because it seemed easier than getting canvas2d to work out of the box.  I would love to hear if you get it working.  Cheers.