Can't get it to work on dynamically created canvas element

[Vemb]

I create my canvas element in JS like this:

let newgauge = document.createElement('canvas')
[target].insertAdjacentElement("afterbegin", newgauge)
var gauge = new Gauge(newgauge).setOptions(opts) 

The element is inserted just fine and I get no error messages — but the gauge does not show.

For some reason the rendered HTML has a width and height attribute of 0 and I can't override it by using gauge.width and gauge.height, as this is ignored. The rendered HTML element always has a width and height of 0.

If I target a static canvas element in my HTML there are no problems (and the width and height is not set to 0). But I can't get it to work when the element has been dynamically created.

Any ideas? Thanks.

[Vemb]

To anyone coming here and experiencing something similar:

The issue was that on a specific user action, I duplicate some hidden HTML and put this into a DIV that is visible to the user. This duplicated the canvas element just fine, but the gauge was not copied with it.

That's because the gauge must be drawn after the copied canvas element is inserted. So to solve the issue, I created a function to force the gauge to be drawn only after the user has performed the action.