Jump to content

Using babylon.canvas2d


Recommended Posts

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?



Link to comment
Share on other sites

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.

Link to comment
Share on other sites

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? 

Link to comment
Share on other sites

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.

Link to comment
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.

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.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...