Fabric.js:查找组中对象(矩形)的中心
Fabric.js:查找组中对象(矩形)的中心
提问于 2014-05-05 01:27:34
我需要找到已被放入组中的对象的中心点。L尝试过的东西：
·getCenterPoint()：返回中心点，就像对象在0,0处一样。
·使用组和对象的getTop()和getLeft()计算中心点。不幸的是，当组值起作用时，发现对象返回负值。
·使用对象的高度/宽度计算值。在下面列出的情况下，这很接近，但这只是因为我的示例的非常特定的属性，并且不会泛化。
下面的对象是我目前正在使用的对象，特别是我正在寻找rect2的中心：
// create a rectangle object
var rect = new fabric.Rect({
top: 10,
fill: 'white',
stroke: 'black',
width: 20,
height: 20
});
// create a rectangle object
var rect2 = new fabric.Rect({
top: 10,
left: 20,
fill: 'white',
stroke: 'black',
width: 20,
height: 20
});
var line = new fabric.Line([ 20, 20, 40, 20],
{
top: 0,
left: 0,
stroke: 'black'
});
var group = new fabric.Group([ rect, rect2, line ],{
top: 100,
left: 100,
hasRotatingPoint: false
});回答 3
Stack Overflow用户
发布于 2014-06-24 14:04:39
使用像items = group._objects;这样的东西
在组中的项目中运行循环，找到您的对象，并获得组中对象的坐标。
例如：items[i].oCoords.tr.x剩下的就是数学了，tr.x和br.x = center x的中点同样可以找到y。
如果你想找到画布的中心:将group.top，group.left添加到这些值中。
Stack Overflow用户
发布于 2018-09-20 13:26:02
您仍然可以对已添加到组的对象使用obj.getCenterPoint()；但是，将对象添加到组会从原始obj引用中删除getCenterPoint方法。
如果您像下面这样重新分配obj引用，则可以在每个引用上使用getCenterPoint。
var allObjs = group.getObjects(),
rect1 = allObjs[0],
rect2 = allObjs[1],
line = allObjs[2];
return rect2.getCenterPoint();下面是一个有效的示例：https://jsfiddle.net/ns9zLxeu/25/
Stack Overflow用户
发布于 2019-05-28 02:14:13
下面是我用来计算给定矩形中心的数学方法
var x1 = e.target.oCoords.oCoords.mt.x;
var y1 = e.target.oCoords.oCoords.mt.y;
var x2 = e.target.oCoords.oCoords.mb.x;
var y2 = e.target.oCoords.oCoords.mb.y;
var centerX = (x1 + x2) / 2;
var centerY = (y1 + y2) / 2;然后在我的例子中，我使用中心坐标创建了一条直线，使用：
var line = makeLine([centerx, centery, 250, 175]);
canvas.add(line);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/23459254
复制相关文章
相似问题