You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
108 lines
4.4 KiB
108 lines
4.4 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
button
|
|
{
|
|
width: 190px;
|
|
height: 40px;
|
|
}
|
|
#navs
|
|
{
|
|
height: 40px;
|
|
width: 400px;
|
|
position: relative;
|
|
}
|
|
footer
|
|
{
|
|
height: 5%;
|
|
text-align: center;
|
|
width: 100%;
|
|
margin-top: 100px;
|
|
}
|
|
.clear
|
|
{
|
|
clear: left;
|
|
}
|
|
#hbs_text
|
|
{
|
|
text-align: left;
|
|
width: 400px;
|
|
text-indent: 20px;
|
|
}
|
|
</style>
|
|
<meta charset="UTF-8">
|
|
</head>
|
|
<body>
|
|
|
|
<div id="main_block" align="center">
|
|
<h1>Лабораторная работа</h1>
|
|
<h2>Акселерометр ADW22035Z - Cемейство ADXL103</h2>
|
|
<p id="hbs_text">Акселерометр подает на выход данные по одной оси.</p>
|
|
<p id="hbs_text">Частота обновления графика - 1 раз в секунду. Данные с сенсора снимаются
|
|
с частотой в 50Hz. </p>
|
|
<canvas id="myCanvas" width="440" height="240" style="border:0px solid #000000;">
|
|
Браузер устарел!
|
|
</canvas>
|
|
<script>
|
|
var socket = new WebSocket("ws://192.168.1.1:81");
|
|
var i, data;
|
|
var c = document.getElementById("myCanvas");
|
|
var context = c.getContext("2d");
|
|
var maxX = 400, maxY = 200;
|
|
var biasX = 20, biasY = 20;
|
|
|
|
function iY(y) {
|
|
return maxY + biasY - y;
|
|
}
|
|
// отрисовка OY шкалы
|
|
context.moveTo(20, iY(0));
|
|
for (i = 0; i <= 200; i+=20) {
|
|
context.lineTo(20, iY(i));
|
|
context.lineTo(15, iY(i));
|
|
context.moveTo(20, iY(i));
|
|
textY = i/200*3.3;
|
|
context.fillText(textY.toFixed(1), 0, iY(i-2.5));
|
|
}
|
|
// отрисовка OX шкалы
|
|
context.moveTo(20, iY(0));
|
|
for (i = 20; i <= 420; i+=40) {
|
|
context.lineTo(i, iY(0));
|
|
context.lineTo(i, iY(-5));
|
|
context.moveTo(i, iY(0));
|
|
textX = (i-20)/400*4 ;
|
|
context.fillText(textX.toFixed(1), i-10, iY(-20));
|
|
}
|
|
context.stroke();
|
|
|
|
socket.onopen = function () {
|
|
alert('Соединение установлено.');
|
|
};
|
|
socket.onclose = function (event) {
|
|
if (!event.wasClean) {
|
|
alert('Обрыв соединения');
|
|
}
|
|
};
|
|
socket.onmessage = function (event) {
|
|
context.clearRect(biasX, biasY, maxX, maxY);
|
|
context.beginPath();
|
|
data = JSON.parse(event.data);
|
|
context.moveTo(biasX, data.data[0]+biasY);
|
|
for (i = 0; i < 200; i++) {
|
|
context.lineTo(i*2 + biasX, data.data[i] + biasY);
|
|
}
|
|
context.stroke();
|
|
};
|
|
function calibrateDevice() {
|
|
var calibrating = 10;
|
|
socket.send(JSON.stringify(calibrating));
|
|
document.getElementById("calibrate_text").innerHTML = "Калибровка в течении 10 секунд - Сделайте несколько оборотов устройством перпендикулярно оси Х";
|
|
}
|
|
</script>
|
|
<div class="clear"></div>
|
|
</div>
|
|
<footer>
|
|
<hr \>Тамбовский Государственный Технический Университет 2017-2018 г.
|
|
</footer>
|
|
</body>
|
|
</html>
|