OK, here you go:
Code:
<div init="var tablepagename = 'summary'; // replace this with the real page name that has the table
var sitedata = [];
var fields = [ 'Diary', 'Chart', 'PM', 'IM' ];
foreach (var p in list.sort(map.values(page.subpages),'title')) {
var x = p.subpages[tablepagename].xml;
var data = { name:p.title };
foreach (var f in fields) {
let data ..= { (f):xml.text(x,'//tr[normalize-space(td)=\''.. f ..'\']/td[2]') };
}
let sitedata ..= [ data ];
}">
<table cellspacing="0" cellpadding="3" border="1">
<tbody>
<tr>
<td> </td>
<td foreach="var d in sitedata" style="background-color: #c3c3c3; ">{{ d.name }}</td>
</tr>
<tr foreach="var f in fields">
<td style="background-color: #c3c3c3; ">{{ f }}</td>
<td foreach="var d in sitedata">{{ d[f] }}</td>
</tr>
</tbody>
</table>
</div>
You can see it in action here.
Notes:
1) In the first line, set the "tablepagename" variable to the name of the page in each site that contains the table. I called it 'summary'. Don't forget to use single quotes!
2) The code assumes correct capitalization of the row names in each table (Diary, Chart, PM, IM).
3) I assume this code will live on the parent page of all the sites. If not, some tweaks will be necessary.
Other than that, it's pretty straightforward. If you need any further help with it, let me know.