In one of the documents I'm working with, there's a long stretch of pages containing nothing but tables. The tables are of variable length, and I'm using the box-tracking API to determine how much vertical whitespace is left after each set of tables, and evenly distribute it between them (i.e., so that the final table on each page is always flush with the bottom margin).

The code I'm using is as follows. This code assumes that jQuery is available, that there will always be exactly four tables per page, and that the total number of tables is known ahead of time (all of which happen to be true in this case, but adapting the code to cases where one or more of those things isn't true should be trivial):

Prince.trackBoxes = true;
Prince.registerPostLayoutFunc(function() {
	for (var i = 4; i <= 36; i = i + 4) {
		var boxes = document.querySelector('table.touchstones:nth-of-type(' + i + ')').getPrinceBoxes();
		var space = parseFloat(boxes[0].y) - parseFloat(boxes[0].h) - 56.13;
		if (space > 0) {
			var baseMargin = parseFloat(boxes[0].marginBottom);
			var equalSpacing = (space / 3) + baseMargin;
			$('table.touchstones:nth-of-type(' + (i - 3) + ')').css('margin-bottom', equalSpacing + 'pt');
			$('table.touchstones:nth-of-type(' + (i - 2) + ')').css('margin-bottom', equalSpacing + 'pt');
			$('table.touchstones:nth-of-type(' + (i - 1) + ')').css('margin-bottom', equalSpacing + 'pt');
		}
	}
});

This works well enough, but there's a hard-coded constant in there: the 56.13 representing the page's bottom margin. Ideally I'd like to be able to avoid that constant and use the box tracking API to fetch the bottom margin of whatever page each group of tables happens to be on, but I'm a bit stumped on how to reliably do that.

Edited 7 Jun 2021 by David J Prokopetz

Yes that's a bit tricky at the moment as some of the page information isn't exposed yet. How about checking the page body area height and subtracting the table height to see how much unused space is left?

var eleBox = document.body.getPrinceBoxes()[0];
var eleHeight = eleBox.h;
var pageHeight = PDF.pages[eleBox.pageNum - 1].h;
var remain = pageHeight - eleHeight;
console.log(remain);

Thanks. To be clear, then, the page object's "h" attribute includes only the printable area, excluding any margins?

Yes, at the moment the PDF.pages array actually contains the page body boxes rather than the entire paper sheets, so their dimensions don't include margins just like regular element boxes don't.

In hindsight this design is a little restrictive, it should be the complete page box with the body box and margin boxes as children of that; currently there is no way to access header/footer content at all.