Thank you for the assistance, and the graph is mostly working as expected, but I have some more queries please.
I still require if (widget.hasClass('open'))
It's use is exactly as intended, if the graphs are collapsed, I don't want it polling the server, and to only poll when open. I don't believe this is causing any issues.
despite having "advanced.dataUpdateInterval" set, the graph does not update.
The graph is fetching the last datapoint, but the time period requested is not changing.
In addition, the moving red "current time" line is also not updating
Using the events.onAnimationDone handler results in whenever moving or zooming the graph, the data period is fetched, and graph is updated. If I don't have this, it never requests the new data range, and does not update. It continues to only fetch the latest data point (and not update).
In regards to to and from being wrong,
dataLimitFrom: "1453117105"
dataLimitTo: "1453100235"
This causes an error, so a second request, from the event handler
dataLimitFrom: "1453090235"
dataLimitTo: "1453100235"
This occurs when I am panned into history only
When panned to current time, the event handler does not fire
dataLimitFrom: "1453100760"
dataLimitTo: "1453136820"
and updates from that range result as a static value of
dataLimitFrom: "1453117920"
dataLimitTo: "1453117980"
This time I am supplying the entire block of code.
This includes all commented out points as mentioned previously.
Thanks for the help so far!
try {
var aggregation = 'avg';
var steps = false;
var smoothing = true;
if(single.type == 'float'){
aggregation = 'avg';
steps = false;
smoothing = true;
} else{
aggregation = 'last';
steps = true;
smoothing = false;
}
var chart = new TimeChart({
container: document.getElementById("channel_chart_" + single.tag_id),
data: {
preloaded: {
values: points,
unit: 's'
//from: 0
},
timestampInSeconds: true,
dataFunction: function (from, to, step, success, fail) {
var widget = $(document).find(chart._impl.settings.container).parents('.widget-channel');
if (widget.hasClass('open')) {
var tag_id = widget.attr('id').replace('channel-widget-id-', '');
//if(channel_points_request_active == false){
channel_points_request_active = true;
jQuery.ajax({
data: {
from: from,//1420070400,
to: to,//1459468800,
unit: step,
tag_id: tag_id,
asset_id: asset_id
},
method: 'POST',
url: '<?php echo site_url('cadmin/channels/getchannelpoints') ?>',
success: success,
error: fail
}).done(function(){
channel_points_request_active = false;
}).error(function(){
channel_points_request_active = false;
});
//}
}
},
minimizeRequests: false
},
interaction: {
scrolling: {
limitMode: null
}
},
timeAxis: {
minUnitWidth: 1,
maxUnitWidth: 50,
unitSizePolicy: "min"
},
valueAxisDefault: {},
series: [
{
type: "line",
data: {
index: 1,
aggregation: aggregation
},
style: {
smoothing: smoothing,
lineColor: "red",
lineWidth: 2,
steps: steps,
}
}
],
navigation: {
initialDisplayUnit: "1 m",
initialDisplayPeriod: "2 h",
initialDisplayAnchor: 'newestData',
},
advanced: {
dataUpdateInterval: 6000,
},
events: {
chartUpdateDelay: 7000,
onAnimationDone: function (event) {
event.chart.reloadData();
//},
//onChartUpdate: function (event) {
// event.chart.reloadData();
}
}
});
window.setInterval(function () {
chart.updateSize();
}, 100);
if (typeof channels_cache[single.tag_id] == 'undefined') {
channels_cache[single.tag_id] = {};
}
channels_cache[single.tag_id] = {
channel: single,
chart: chart
}
}