three.js dom id of canvas element used for webgl renderer

13,495

Solution 1

var canvas = document.getElementById("canvasID");
renderer = new THREE.WebGLRenderer({ canvas: canvas });

Solution 2

If you look in the latest release (r57) in three.js/src/renderers/WebGLRenderer.js (at the very top of the file) you can see that you can actually pass a canvas argument to the renderer. If you dont pass one, then one is created for you. You would probably need to post some code that does not work or better yet a jsfiddle so we can take a look at the problem.

Share:
13,495
Dev
Author by

Dev

Updated on July 22, 2022

Comments

  • Dev
    Dev almost 2 years

    I'd like to get the id of the canvas element automatically created by three.js.

    Alternately, I would be equally happy (perhaps more so) with the ability to pass along a preexisting canvas element id during construction.

    After researching, I tried this:

    renderer = new THREE.WebGLRenderer( { canvas: my_canvas } );
    

    without success (it is from a pretty old build, but was hoping it would work). Perhaps some parameter syntax has changed since 2 years ago?

    (my_canvas being the id of the canvas, also tried passing along the context, no luck)

    Finally I tried:

    document.getElementsByTagName('canvas');
    

    which returned nothing... that was a puzzler and the proverbial straw that led me to post here.

    Any insight appreciated, thanks! (I now have voting rights)