2017-07-01 08:17:15 +00:00
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html>
|
|
|
|
|
|
<head>
|
2017-12-12 20:34:32 +00:00
|
|
|
|
<link rel="stylesheet" href="ina2.css">
|
2017-07-01 08:17:15 +00:00
|
|
|
|
<title>Get data INA219</title>
|
2017-12-12 20:34:32 +00:00
|
|
|
|
<script type="text/javascript" src="dygraph.js"></script>
|
2017-07-01 08:17:15 +00:00
|
|
|
|
</head>
|
|
|
|
|
|
<body>
|
2017-12-12 20:34:32 +00:00
|
|
|
|
<div style="width:1000px; height:500px;">
|
|
|
|
|
|
<div id="div_v" style="width:100%; height:400px;"></div>
|
|
|
|
|
|
<p style="text-align: center;">
|
|
|
|
|
|
<input type="button" id="butOnOff" value="Stop">
|
|
|
|
|
|
<input type="radio" name='rm1' id="FixEnd"/>
|
|
|
|
|
|
<label for="FixEnd">Fixed</label>
|
|
|
|
|
|
<input type="radio" checked name='rm1' id="FixNone"/>
|
|
|
|
|
|
<label for="FixNone">Float</label><br>
|
|
|
|
|
|
Window: <span id='wdsize'>?</span> sec<br>
|
|
|
|
|
|
Sample Rate: <span id='smprate'>?</span> smps
|
|
|
|
|
|
</p>
|
|
|
|
|
|
<div id='labdiv' style="text-align: center;"></div>
|
|
|
|
|
|
</div>
|
2017-07-01 08:17:15 +00:00
|
|
|
|
|
2017-12-12 20:34:32 +00:00
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
var $ = function(id) {
|
|
|
|
|
|
return document.getElementById(id);
|
|
|
|
|
|
}
|
|
|
|
|
|
var stg = 0;
|
2018-03-04 11:05:52 +00:00
|
|
|
|
var smprate = 963.4; // 1819;
|
2017-12-12 20:34:32 +00:00
|
|
|
|
var smps = smprate;
|
|
|
|
|
|
var samples = 10*smprate;
|
|
|
|
|
|
var rend = 1;
|
2017-07-01 08:17:15 +00:00
|
|
|
|
var oldblkid = 0;
|
|
|
|
|
|
var rdnextflg = false;
|
|
|
|
|
|
var cur_idx = 0;
|
2017-12-12 20:34:32 +00:00
|
|
|
|
var sttim = 0;
|
|
|
|
|
|
$("butOnOff").onclick = function() {
|
|
|
|
|
|
if(rend) {
|
|
|
|
|
|
rend = 0;
|
|
|
|
|
|
$("butOnOff").value = "Run";
|
|
|
|
|
|
} else {
|
|
|
|
|
|
rend = 1;
|
|
|
|
|
|
$("butOnOff").value = "Stop";
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
var datau = [];
|
|
|
|
|
|
var gu;
|
|
|
|
|
|
//window.onresize= function(){// alert('<27><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> div #Test <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>.');}
|
|
|
|
|
|
function wsping() {
|
|
|
|
|
|
clearTimeout(wstt);
|
|
|
|
|
|
ws.send('ina219');
|
|
|
|
|
|
wstt = setTimeout(wsping, 500);
|
|
|
|
|
|
}
|
2017-07-01 08:17:15 +00:00
|
|
|
|
ws = new WebSocket('ws://rtl871x0/web.cgi');
|
|
|
|
|
|
ws.binaryType = 'arraybuffer';
|
2017-10-17 14:42:32 +00:00
|
|
|
|
ws.onopen = function(){ ws.send('user=rtl871x:supervisor'); ws.send('sys_debug=0'); wstt = setTimeout(wsping, 50);};
|
2017-07-01 08:17:15 +00:00
|
|
|
|
ws.onmessage = function (event) {
|
|
|
|
|
|
if(event.data instanceof ArrayBuffer) {
|
2017-10-17 14:42:32 +00:00
|
|
|
|
clearTimeout(wstt);
|
2017-07-01 08:17:15 +00:00
|
|
|
|
var wordarray = new Int16Array(event.data);
|
|
|
|
|
|
if(wordarray.length > 2) {
|
|
|
|
|
|
var blksz = wordarray[0];
|
|
|
|
|
|
if(wordarray.length == blksz*2 + 2) {
|
2017-12-12 20:34:32 +00:00
|
|
|
|
if(!sttim) {
|
|
|
|
|
|
sttim = new Date().getTime();
|
|
|
|
|
|
setInterval(function(){wsSmpRate()}, 500);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
var blkid = wordarray[1] & 0xFFFF;
|
|
|
|
|
|
if(rdnextflg) {
|
|
|
|
|
|
cur_idx += (blkid - oldblkid) & 0xFFFF;
|
|
|
|
|
|
} else rdnextflg = true;
|
|
|
|
|
|
oldblkid = blkid + blksz;
|
|
|
|
|
|
for (var i=2; i<wordarray.length; i+=2) {
|
|
|
|
|
|
if(rend) {
|
|
|
|
|
|
if(cur_idx >= samples ) datau.shift();
|
|
|
|
|
|
if(wordarray[i] & 2) datau.push([cur_idx/smprate, wordarray[i]*0.0005, wordarray[i+1]*0.1]);
|
|
|
|
|
|
else datau.push([cur_idx/smprate]);
|
2018-03-04 11:05:52 +00:00
|
|
|
|
}
|
2017-12-12 20:34:32 +00:00
|
|
|
|
cur_idx++;
|
|
|
|
|
|
}
|
|
|
|
|
|
if(!stg) {
|
|
|
|
|
|
gu = new Dygraph(
|
|
|
|
|
|
$("div_v"),
|
|
|
|
|
|
datau,
|
|
|
|
|
|
{
|
|
|
|
|
|
title: 'U & I (INA219)',
|
|
|
|
|
|
// rightGap: 250,
|
|
|
|
|
|
showRangeSelector: true,
|
|
|
|
|
|
// drawPoints: true,
|
|
|
|
|
|
// rollPeriod: 10,
|
|
|
|
|
|
// errorBars: true,
|
|
|
|
|
|
// fillGraph: true,
|
|
|
|
|
|
showRoller: true,
|
|
|
|
|
|
// maxNumberWidth: 10,
|
|
|
|
|
|
xlabel: 'T(sec)',
|
|
|
|
|
|
ylabel: 'U(V)',
|
|
|
|
|
|
y2label: 'I(mA)',
|
|
|
|
|
|
colors: ['rgb(51,204,204)','rgb(255,100,100)'],
|
|
|
|
|
|
// highlightSeriesOpts: { strokeWidth: 2 },
|
|
|
|
|
|
series : { 'I': { axis: 'y2' } },
|
|
|
|
|
|
axes: {
|
2018-03-04 11:05:52 +00:00
|
|
|
|
x: {valueFormatter: function(x){return this.getLabels()[0] + ': '+ x.toPrecision(5);}},
|
2017-12-12 20:34:32 +00:00
|
|
|
|
y: {valueRange: [0,]},
|
|
|
|
|
|
y2: {valueRange: [0,]}},
|
|
|
|
|
|
labels: ['T', 'U', 'I'],
|
|
|
|
|
|
labelsDiv: $('labdiv'),
|
|
|
|
|
|
legend: 'always', // "follow"
|
2018-03-04 11:05:52 +00:00
|
|
|
|
digitsAfterDecimal: 3,
|
2017-12-12 20:34:32 +00:00
|
|
|
|
// legendFormatter: legendFormatter
|
|
|
|
|
|
});
|
|
|
|
|
|
setInterval(function(){renderChart()}, 50);
|
|
|
|
|
|
stg = 1;
|
|
|
|
|
|
}
|
|
|
|
|
|
} }
|
|
|
|
|
|
wstt = setTimeout(wsping, 40);
|
|
|
|
|
|
} } }
|
|
|
|
|
|
function wsSmpRate() {
|
|
|
|
|
|
smps = cur_idx * 1000/ (new Date().getTime() - sttim);
|
|
|
|
|
|
$('smprate').innerHTML = smps.toFixed(1);
|
|
|
|
|
|
}
|
|
|
|
|
|
var renderChart = function() {
|
|
|
|
|
|
// $('div_v').style.height = (window.innerHeight-180) + 'px';
|
|
|
|
|
|
var dl;
|
|
|
|
|
|
if (gu.dateWindow_) {
|
|
|
|
|
|
dl = gu.dateWindow_[1] - gu.dateWindow_[0];
|
|
|
|
|
|
if ($("FixEnd").checked) {
|
|
|
|
|
|
var ls = datau.length - 1;
|
|
|
|
|
|
gu.dateWindow_[1] = datau[ls][0];
|
|
|
|
|
|
gu.dateWindow_[0] = datau[ls][0] - dl;
|
|
|
|
|
|
} else if (gu.dateWindow_[0] < datau[0][0]) {
|
|
|
|
|
|
gu.dateWindow_[0] = datau[0][0];
|
|
|
|
|
|
gu.dateWindow_[1] = datau[0][0] + dl;
|
|
|
|
|
|
}
|
|
|
|
|
|
} else dl = datau.length/smprate;
|
|
|
|
|
|
$("wdsize").innerHTML = dl.toFixed(3);
|
|
|
|
|
|
if(rend) gu.updateOptions({'file': datau});
|
2017-07-01 08:17:15 +00:00
|
|
|
|
}
|
|
|
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html>
|
