brianchirls / Seriously.js

A real-time, node-based video effects compositor for the web built with HTML5, Javascript and WebGL
MIT License
3.87k stars 354 forks source link

How to output the image to a canvas not attached to DOM? #130

Open windofsoltia opened 7 years ago

windofsoltia commented 7 years ago

If I set target like this

var target = seriously.target("#catcanvas");

it can output the right image in the web browser;

but if I use

var canvas = document.createElement("canvas"); var target = seriously.target(canvas); .... seriously.go();

var img = document.createElement("img"); img.src= canvas.toDataURL()

I got nothing!The image is blank!

how to fix it?

felipebrahm commented 7 years ago

This is not really directly related to Seriously.js, so a better place for these questions would be Stackoverflow (or just a quick google search).

Try adding a width and height to your canvas before using it:

var canvas = document.createElement("canvas");
canvas.width = 1280;
canvas.height = 720;