1. FabricJS简介
FabricJS是一个强大的基于HTML5 Canvas的JavaScript图形库，它能够帮助开发者实现高性能的交互式Canvas应用。FabricJS提供了许多实用的功能，比如图形对象操作、文本渲染、滤镜效果、事件处理等。
FabricJS的主要特点如下：
可扩展性强，支持定制化组件。
轻量级框架，支持各种现代浏览器。
丰富的API和DOM，支持开发者自由发挥创造力。
支持图像处理及动画特效，可用于各种类型的Canvas图形应用。
2. 隐藏矩形控制边框的作用
在使用FabricJS绘制矩形时，我们可以看到矩形周围有四个控制边框，它们用于完成矩形的移动、缩放等操作。但在某些情况下，我们可能需要隐藏这些控制边框，例如在制作一个Canvas游戏时，为了保证游戏体验，需要隐藏控制边框。
3. 隐藏控制边框的实现方式
3.1 方案一：使用setControlVisible API
在FabricJS中，我们可以使用setControlVisible API来设置矩形的控制边框是否可见，setControlVisible API的原型如下：
object.setControlVisible(control, visible)参数解析：
control：控制器的名称，取值可以为：mt（middle top）、mb（middle bottom）、ml（middle left）、mr（middle right）、tl（top left）、tr（top right）、bl（bottom left）及br（bottom right）。
visible：控制器是否可见，取值可以为true或false。
通过设置控制边框的可见性来隐藏控制边框的方法如下：
var rect = new fabric.Rect({
left: 100,
top: 100,
width: 50,
height: 50,
fill: 'red'
});
// 隐藏所有的控制边框
rect.setControlVisible('mt', false);
rect.setControlVisible('mb', false);
rect.setControlVisible('ml', false);
rect.setControlVisible('mr', false);
rect.setControlVisible('tl', false);
rect.setControlVisible('tr', false);
rect.setControlVisible('bl', false);
rect.setControlVisible('br', false);
canvas.add(rect);
使用这种方法隐藏控制边框时，需要将所有的控制边框的可见性都设置为false，否则还会留下部分控制边框。
3.2 方案二：使用hasControls属性
除了使用setControlVisible API外，我们还可以使用hasControls属性来控制控制边框的显示与隐藏。hasControls属性是指在对象选择时是否显示旋转、调整大小的控制点。默认情况下，当我们使用对象选择器选中某个对象时，控制边框是会出现的。如果将hasControls属性设置为false，那么控制边框也会被隐藏。
var rect = new fabric.Rect({
left: 100,
top: 100,
width: 50,
height: 50,
fill: 'red',
hasControls: false
});
canvas.add(rect);
使用这种方法隐藏控制边框时，只需要将hasControls属性设置为false即可。这种方法比较简单，但是需要在创建对象时进行设置。
4. 总结
通过使用setControlVisible API和hasControls属性，我们可以实现FabricJS矩形控制边框的隐藏。这些方法在某些过程中非常有用，既可以提高交互性能，还可以提高Canvas游戏用户体验。在实际应用中，可以根据不同需要灵活选用。