如何获取一组 Raphael 对象的 BBox 宽度和高度？

【问题标题】：How to get BBox width & height of a group of Raphael objects?如何获取一组 Raphael 对象的 BBox 宽度和高度？
【发布时间】：2011-09-16 10:26:08
【问题描述】：

在 Raphel.js 中，如何获取一组 Raphael 对象的 BBox 宽度和高度？

例如，我在我的 Rapheal 纸上渲染了几个元素，如下所示：

var paper = Raphael(10, 50, 320, 200);
var st = paper.set();

var c = paper.rect(40, 40, 50, 50, 10);
var e = paper.ellipse(50, 50, 40, 20);
var i = paper.image("apple.png", 10, 10, 80, 80);
var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!");
...

st.push(c, e, i, t ...);

我尝试使用以下方式获取BBox的一组元素的宽高：

var myBBox = st.getBBox();
var width = myBBox.width;
var height = myBBox.height;

console.log(width+','+height);

有时它会起作用，但有时我会得到 Infinity 的高度值。我猜这是Rapheal的一个错误。那么，如果我想获取画布（一组元素）的当前 BBox 大小，正确的方法是什么？

【问题讨论】：

我不是 100% 确定，但我认为这可能已在 2.0 中修复

标签： javascript raphael javascript-framework

【解决方案1】：

您可以手动完成。对于组的每个元素：

获取left 或x 坐标。获取最小值。 var MinLeft
获取right 坐标。它可以像left+width 或x2 一样计算。获取最大值。 var MaxRight
获取top 或y 坐标。获取最小值。 var MinTop
获取bottom 坐标。它可以像top+height 或y2 一样计算。获取最大值。 var MaxBottom
结果：您组的left=MinLeft；你组的top=MinTop；你组的height=MaxBottom-MinTop;你组的width=MaxRight-MinLeft

【讨论】：