Here is how I achieved the time slices display. Instead of replacing the table generated by the template & the subscribed data set, I created a new table. It's a bit more manual, but here it is.
On the server, I just expose a method called gethistory, that takes the upper and lower limit of the slice, fetch() the new data set and return the fetched data if the slice period is less than 30 minutes, otherwise returns false:
Meteor.methods({
gethistory: function(utcfrom, utcto) {
// If interval is lower than 30 minutes
if ((utcto - utcfrom) < 1800 * 1000) {
query = Mon.find({
"$and": [{
"utctime": {
"$gt": (new Date(utcfrom))
}
}, {
"utctime": {
"$lt": (new Date(utcto))
}
}]
}, {
sort: {
utctime: 1
},
limit: 500
})
res = query.fetch()
return res
} else {
return false
}
}
})
When I need a new slice of data to be displayed, I use the following code from the client (e.min & e.max contains the slice boundaries). In my code, this is called form the afterSetExtremes(e) section of a highchart displaying a full year, (check http://www.highcharts.com/stock/demo/lazy-loading if you're insterested in the highchart part)
Meteor.call('gethistory', e.min, e.max, function(error, data) {
Session.set('histdata', data)
});
I have a template:
Template.hist.historylines = function () {
return Session.get('histdata')
}
And an html part:
<body>
{{> hist}}
</body>
<template name="hist">
<div>
{{#if historylines}}
<table>
{{#each historylines}}
{{> line}}
{{/each}}
{{else}}
<p>You must select a period smaller than 30 minutes to get the details.</p>
{{/if}}
</table>
</div>
</template>
<template name="line">
<tr>
<td>{{val1}}</td>
<td>{{val2}}</td>
</tr>
</template>