Fabric.js | Ellipse hasBorders 属性

简介

Fabric.js 是一个强大的用于创建基于 HTML5 Canvas 的交互式应用程序的前端库，在其中 Ellipse 是一个非常常用的图形对象。在 Ellipse 的使用中，我们可以通过 hasBorders 属性来设定 Ellipse 对象是否需要显示拖动缩放框。本文将为大家介绍 Ellipse 对象的 hasBorders 属性。

hasBorders 属性

hasBorders 属性是一个布尔值，用于设置 Ellipse 对象是否需要显示拖动缩放框。默认情况下，hasBorders 属性的值为 true，会显示拖动缩放框，如果将 hasBorders 属性的值设为 false，将会不显示拖动缩放框。

var canvas = new fabric.Canvas('canvas');
var ellipse = new fabric.Ellipse({
  left: 100,
  top: 100,
  rx: 50,
  ry: 30,
  fill: 'red',
  hasBorders: true // 是否显示拖动缩放框
});
canvas.add(ellipse);

在上述代码中，我们创建了一个 Ellipse 对象，并将 hasBorders 的值设为 true，可以看到在画布上该 Ellipse 对象将会显示拖动缩放框。

如果将 hasBorders 的值设为 false，那么该 Ellipse 对象就不会显示拖动缩放框了。

var canvas = new fabric.Canvas('canvas');
var ellipse = new fabric.Ellipse({
  left: 100,
  top: 100,
  rx: 50,
  ry: 30,
  fill: 'red',
  hasBorders: false // 不显示拖动缩放框
});
canvas.add(ellipse);

总结

通过本文对 Ellipse 的 hasBorders 属性的介绍，我们可以知道这个属性的作用和使用方法，并可以在实际开发中灵活运用。