How can I change the blotter canvas size?

Question

For some reason the blotter.js canvas size is not cangable. Blotter seems to generate a canvas named b-canvas by default? But I can't find where it gets it width and height from? And I am not able to set a new width and size by.style in js. Help?!

I've tried all the techniques I could find. I've also tried to set a Overflow: visible to the parent (Text) in js and in the css file, but the render is still crashing with the bounds of the canvas. What am I doing wrong?

var text = new Blotter.Text("Hello", {
        weight: 800,
        size: 80,
        fill: 'lightgray',
        paddingLeft: 80,
        paddingRight: 80,
        paddingBottom: 80,
        paddingTop: 80
    });
    /*
     * https://blotter.js.org
     */
    var blotter = new Blotter(material, {
        texts: text
    });
    var canvas = blotter.forText(text).domElement;
    canvas.style.visibility = 'visible!important';
    canvas.style = "width: 100vh !important";
    canvas.style = "height: 100vw !important";
    canvas.style = "z-index: -3 !important";
    container.appendChild(canvas);

Answer 1

You can simply wrap it inside a div and resize that. The canvas size is probably calculated based on the font-size and it is as big as the drawing itself.

<div id="wrap">
    <canvas></canvas>
</div>

<style>
    #wrap canvas {
        width: 50px !important
    } 
</style>

Take a look at the "Blotter.js" website itself and inspect its logo, see that it has this same code and how you can resize it.