如何从fabric.js开始

How to start with fabric.js

本文关键字：js 开始 fabric      更新时间：2023-09-26

我是学习JS的初学者。现在我遇到了一个问题，要从fabric.js开始，它需要您的帮助

<!DOCTYPE HTML>
<html>
<head>
    <title>fabric_test</title>
    <script type="text/javascript" src="all.js"></script>
</head>
<body>
    <canvas id="canvas" width="512" height="512" style="background-color: rgb(222, 222, 222)">
        Your browser does not support canvas tag!
    </canvas>
    <script type="text/javascript">
        var canvas = new fabric.Canvas('canvas');
        // create a rectangle object
        var rect = new fabric.Rect({
          left: 100,
          top: 100,
          fill: 'red',
          width: 20,
          height: 20
        });
        // "add" rectangle onto canvas
        canvas.add(rect);
    </script>
</body>
</html>

我的问题是：

  1. 当我打开保存的html文件时，为什么矩形不在画布上绘制
  2. 我下载的结构是一个文件夹，其中包含几个文件夹和文件。我只是在当前位置复制all.js文件。这是对的吗

这个问题是因为您在画布对象中放置了背景。所以，颜色在内部元素之上。从画布中删除背景样式。

当您下载fabric zip文件时，在提取时，您应该找到一个文件夹fabric.js-14.4.4/dist。从那里复制fabric.js文件或fabric.min.js文件并将其包括在内，而不是all.js。请告诉我这是否有效。

相关文章：