Javascript Fabric Js：如何通过编程创建只有左上角和右下角两个点的矩形？

矩形可以使用如下所示的top、left、width和height来创建

var rect = new fabric.Rect({
   left: 50,
   top: 50,
   width: 50,
   height: 50,
   fill: 'rgba(255,127,39,1)',
});

是否可以通过设置左上角和右下角来创建矩形？是否有任何方法可以创建只有这两个点的矩形

对于矩形

width = difference between top-left x and right-bottom x,
height = difference between top-left y and right-bottom y.

演示

var canvas=newfabric.canvas（'c'）；
函数getValue（id）{
返回文档.getElementById（id）.value
}
函数r（）{
返回Math.floor（Math.random（）*255）
}
函数getColor（）{
返回'rgb（'+r（）+“，“+r（）+”，“+r（）+”）'；
}
函数addRect（）{
var tlx=getValue（'tlx'），
tly=getValue（'tly'），
brx=getValue（'brx'），
bry=getValue（'bry'）；
如果（tlx=''| | tly=''| | brx=''| | bry=''）{
警报（“输入所有值”）；
返回false；
}
变量宽度=数学绝对值（+tlx-+brx），
高度=数学绝对值（+tly-+bry）；
var rect=new fabric.rect({
左：+tlx，
顶呱呱，
宽度：宽度，
高度:高度,，
fill:getColor（）
});
canvas.add（rect）；
}

画布{
边框：1px实心#000；
}

左上角x:

左上角y:

右下角x:

右下角x:

添加

对于矩形

width = difference between top-left x and right-bottom x,
height = difference between top-left y and right-bottom y.

演示

var canvas=newfabric.canvas（'c'）；
函数getValue（id）{
返回文档.getElementById（id）.value
}
函数r（）{
返回Math.floor（Math.random（）*255）
}
函数getColor（）{
返回'rgb（'+r（）+“，“+r（）+”，“+r（）+”）'；
}
函数addRect（）{
var tlx=getValue（'tlx'），
tly=getValue（'tly'），
brx=getValue（'brx'），
bry=getValue（'bry'）；
如果（tlx=''| | tly=''| | brx=''| | bry=''）{
警报（“输入所有值”）；
返回false；
}
变量宽度=数学绝对值（+tlx-+brx），
高度=数学绝对值（+tly-+bry）；
var rect=new fabric.rect({
左：+tlx，
顶呱呱，
宽度：宽度，
高度:高度,，
fill:getColor（）
});
canvas.add（rect）；
}

画布{
边框：1px实心#000；
}

左上角x:

左上角y:

右下角x:

右下角x:

添加