Jump to content

Convert Babylon.js camera animation to HD video file


roman_44
 Share

Recommended Posts

Hi everybody!

I need to convert Babylon.JS animation to video file with at least FullHD resolution and .... !!!on server side!!!

I wrote code which already works locally on my mac, but now I need to deploy this rendering stuff.

My flow is this: I have NodeJS server. When the server gets appropriate request, it starts real browser window on my mac, load scene, start animation with speed of 1 frame per second and every second I run screenshot function from babylon tools which finally give me canvas element with picture and I run this:

var dataToSend = screenshotCanvas.toDataURL('image/png');

then I send dataToSend back to node and store it somewhere in filesystem.

After all animation finishes server takes sequence of files and make video file with some node libraries. At this point I have my video file with big resolution.

But now I need to deploy this kinda rendering engine somewhere and problem is that I need to run real browser window in order to get pictures from babylon.js animation.

So I cannot use headless browser because  they all are not supporting webGL. I have to run real browser window. And I think this is also doable.

My question is this: is it possible to get what I need any other way? Maybe you have some hints for me, or already done same tasks.

Thank you! Will appreciate any advice!!!

Link to comment
Share on other sites

5 minutes ago, Deltakosh said:

hello the main caveat I can foresee is that server side you will not be able to have a webgl context

Yes, you right, unless I will not fire real browser window, which should be able to do in Windows Server VM with GPU somewhere on Azure... 

https://azure.microsoft.com/en-us/documentation/videos/azurecon-2015-applications-that-scale-using-gpu-compute/

Link to comment
Share on other sites

Ok, not big deal to run VM with GPU on Azure, or AWS, but how I can run WebGL and Babylon on Linux machine? If Headless browsers are explicitly does not support WebGL. And we don't have real browser on linux server.

The only thing that I found is ThreeJs has some kind of library for NodeJS to get WebGL on server side: http://ox86.tumblr.com/post/129341221225/look-ma-no-canvas-server-side-3d-rendering-with  

Continue to search...

Link to comment
Share on other sites

I have good experience with webgl rendering using remote selenium test servers. Both browserstack and sauce labs offer such servers, but they are more testing-oriented. You might be more successful with hosting your own selenium-enabled environment on the cloud (on a GPU instance) and connecting to selenium using node.js's selenium drivers. 

I am not sure about performance thou! Just a suggestion for a general direction you might be able to check.

 

Link to comment
Share on other sites

1 hour ago, RaananW said:

I have good experience with webgl rendering using remote selenium test servers. Both browserstack and sauce labs offer such servers, but they are more testing-oriented. You might be more successful with hosting your own selenium-enabled environment on the cloud (on a GPU instance) and connecting to selenium using node.js's selenium drivers. 

I am not sure about performance thou! Just a suggestion for a general direction you might be able to check.

 

Thank you so much for the advice. Definitely will read more about it and will give it a try.

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.

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

  • Recently Browsing   0 members

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