用于绘制图像的画布库

Question

HTML5画布为使用 javascript 绘制图像提供了很大的灵活性。我们需要根据用户的输入生成 javascript 代码（比如 10 个蓝色球、5 个绿色方块和特定大小......）。是否有提供适当的 Javascript API 的库，以便更轻松地生成画布以及满足上面列出的要求的 javascript 代码？

Answer 1

使用Fabric.js在画布上绘制简单的形状（圆形、矩形等）非常简单。它还支持图像导入和操作。

例如，显示矩形非常简单：

var canvas = new fabric.Canvas('id_of_canvas_element');

var rect = new fabric.Rect({
  top: 100,
  left: 100,
  width: 60,
  height: 70,
  fill: 'red'
});

canvas.add(rect);

看看演示。