使用 Fabric.js 将背景图像拉伸到画布大小

2023-12-28

我在用Fabric.js and Canvas设计一些卡片。我需要将背景图像拉伸到画布大小。但它不起作用。下面是我的代码。

SCRIPT

    <script src="/fabric/dist/fabric.js"></script>
    ...
    <script>
    function myBg(){
      var canvas =  this.__canvas = new fabric.Canvas('myCanvas');

        canvas.setBackgroundImage('images/download.jpg', canvas.renderAll.bind(canvas), 
        {
            backgroundImageOpacity: 0.5,
            backgroundImageStretch: true
        });

        //this.__canvases.push(canvas); this gives me 'Uncaught TypeError: Cannot read property 'push' of undefined'
        canvas.renderAll();
    }

    </script>

HTML

    <canvas id="myCanvas" width="544px" height="682px">
    <div id="Layer4"  onclick="myBg();"><img src="images/Layer4.png"> </div>

它正在加载图像但没有拉伸!有什么线索吗?


None

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Fabric.js 将背景图像拉伸到画布大小 的相关文章