我的目标是创建一些代码,在纸的中心显示(不需要动画)一组尽可能大的对象。
我当前的尝试获取一组对象或纸张的边界框并返回尺寸,然后由setViewBox
. 不幸的是,它不起作用,我不知道为什么。
这是我的代码
function GetContainingViewBoxFor(object)
{
var maxValues = { x: 0, y: 0 };
var minValues = { x: 0, y: 0 };
//Find max and min points
object.forEach(function (el) {
if (el.data("background")) return;
var bbox = el.getBBox();
if (bbox.y < minValues.y) minValues.y = bbox.y;
if (bbox.y2 < minValues.y) minValues.y = bbox.y2;
if (bbox.y > maxValues.y) maxValues.y = bbox.y;
if (bbox.y2 > maxValues.y) maxValues.y = bbox.y2;
if (bbox.x < minValues.x) minValues.x = bbox.x;
if (bbox.x2 < minValues.x) minValues.x = bbox.x2;
if (bbox.x > maxValues.x) maxValues.x = bbox.x;
if (bbox.x2 > maxValues.x) maxValues.x = bbox.x2;
});
//Padding
var padding = 50;
maxValues.x += padding;
minValues.x -= padding;
maxValues.y += padding;
minValues.y -= padding;
var w = maxValues.x - minValues.x;
var h = maxValues.y - minValues.y;
var cviewBox = {X:minValues.x - paper.width,Y:minValues.y,width:w,height:h};
return cviewBox;
}
它是这样使用的:
var containingViewBox = GetContainingViewBoxFor(paper);
paper.setViewBox(containingViewBox.X, containingViewBox.Y, containingViewBox.width, containingViewBox.height, false);