Jump to content

Is there a way to use canvas image data as texture data directly?


Recommended Posts

Is there any way to create a dynamic texture from a noise function? I thought this was possible and created a function to generate a 2D array of color values but it seems from my searched that dynamic textures require an image. I guess I could make an image from the array, but that seems like a step that could avoided.


Link to comment
Share on other sites


I am only on mobile for a couple of days so cannot do any new PG.

If you look at the PG in my above texturecontext can be used just as a canvas context

Then you could get the imagedata for this canvas randomise data in the imagedata  and put imagedata on the canvas then update the dynamictexture.

You may well know this already but if not find out about using imagedata like this at


Just change the greyscale and invert examples to randomising.





Link to comment
Share on other sites

On 2017/2/16 at 6:38 PM, JohnK said:

AHa,Thank u  for your time.^ ^,i thought there no one answer me ,i've tried many times,but i still confused,,,,look at this PG


now i know dynamic texture can accept canvasElement ,so i think it can be used like base texture ,then i parsed the canvasElement,but it seems can't show on the customMesh.



will you please check it for me?

Link to comment
Share on other sites

@BangTao There are a couple of errors in your PG

1. canvas width and height are not set using style but set directly with numbers

2. only draw on canvas after creating dynamic texture and once you draw on it update it.

Check out http://www.babylonjs-playground.com/#VKBJN#31 which has corrected the ode and removed most of the unnecessary code.

Link to comment
Share on other sites


Line 39 the final parameter is true, this forces the dynamictexture to use MipMaps  https://en.wikipedia.org/wiki/Mipmap  theseneed powers of 2 so the canvas size is changed so that width and height are powers of 2 keeping the proportion as close as possible to the original,

Delete the last parameter or change it to false and check the width and height again.

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...