如何更改吸墨紙 canvas 尺寸？

Question

由於某種原因，blotter.js canvas 大小不可更改。 Blotter 好像默認會生成一個名為 b-canvas 的 canvas？ 但我找不到它從哪里得到寬度和高度？ 而且我無法在 js 中通過.style 設置新的寬度和大小。 幫助？！

我已經嘗試了所有我能找到的技術。 我還嘗試在 js 和 css 文件中設置溢出：對父級（文本）可見，但渲染仍然在 canvas 的范圍內崩潰。 我究竟做錯了什么？

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

您可以簡單地將其包裝在 div 中並調整其大小。 canvas 的大小可能是根據字體大小計算出來的，它與圖紙本身一樣大。

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

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

查看“Blotter.js”網站本身並檢查其徽標，看看它是否具有相同的代碼以及如何調整它的大小。