zcy
/
foc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update arduino/Betas/RGB_V1.1.1/main/data/index.html.

master
慕炎 2022-01-04 07:40:19 +00:00 committed by Gitee
parent 22db9b46cc
commit 90ea3f6b25
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
1 changed files with 405 additions and 416 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

133
arduino/Betas/RGB_V1.1.1/main/data/index.html
View File

@ -4,6 +4,7 @@ HW:Ver 1.5
FW:Ver 1.2 FW:Ver 1.2
--> -->
<html lang="zh-cn"> <html lang="zh-cn">
<head> <head>
<title>自平衡莱洛三角形</title> <title>自平衡莱洛三角形</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
@ -12,10 +13,12 @@ FW:Ver 1.2
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"> <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<style> <style>
/*input框*/ /*input框*/
input, button { input,
button {
border: none; border: none;
outline: none; outline: none;
} }
.tl-input { .tl-input {
width: 100%; width: 100%;
border: 1px solid #ccc; border: 1px solid #ccc;
@ -30,6 +33,7 @@ input, button {
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
} }
.tl-input:focus { .tl-input:focus {
border-color: #66afe9; border-color: #66afe9;
outline: 0; outline: 0;
@ -74,6 +78,7 @@ input, button {
-webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045); -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045); box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
} }
.ant-btn-red { .ant-btn-red {
color: #fff; color: #fff;
background-color: #FF5A44; background-color: #FF5A44;
@ -131,6 +136,7 @@ input, button {
background: linear-gradient(to right, #ffa200, white 0%, white); background: linear-gradient(to right, #ffa200, white 0%, white);
background-size: 100% 100%; background-size: 100% 100%;
} }
#control input[type="button"] { #control input[type="button"] {
padding: 5px; padding: 5px;
margin: 5px 0; margin: 5px 0;
@ -145,49 +151,38 @@ input, button {
<script type="text/javascript" src="highcharts.js"></script> <script type="text/javascript" src="highcharts.js"></script>
<script type="text/javascript"> <script type="text/javascript">
var ShaftVelocity; var HighchartsData = new Array(8);
$(function () { $(function () {
$(document).ready(function () { $(document).ready(function () {
Highcharts.setOptions({ global: { useUTC: false } }); Highcharts.setOptions({ global: { useUTC: false } });
var chart; var chart, time = new Date().getTime();
$('#container').highcharts({ $("#container").highcharts({
chart: {type: 'spline', animation: Highcharts.svg, marginRight: 10, events: { chart: { type: "spline", animation: Highcharts.svg, marginRight: 10, events: { load: function () {
load: function() { var series = this.series;
// set up the updating of the chart each second
var series = this.series[0];
setInterval(function () { setInterval(function () {
var x = (new Date()).getTime(), y = parseFloat(ShaftVelocity); var x = new Date().getTime();
series.addPoint([x, y], true, true); for(i=0; i<HighchartsData.length;i++){
series[i].addPoint([x, HighchartsData[i]], true, true);
}
}, 1000); }, 1000);
} }
} }
}, },
title: {text: '动态走势图' }, title: { text: "自平衡莱洛三角形" }, xAxis: { type: "datetime", tickPixelInterval: 100 }, yAxis: { title: { text: "Value" }, plotLines: [{ value: 0, width: 1, color: "#808080" }] },
xAxis: {type: 'datetime', tickPixelInterval: 100 }, tooltip: { formatter: function () { return ( "<b>" + this.series.name + "</b><br/>" + Highcharts.dateFormat("%Y-%m-%d %H:%M:%S", this.x) + "<br/>" + Highcharts.numberFormat(this.y, 2) ); } },
yAxis: {title: {text: '动态走势图' }, plotLines: [{value: 0, width: 1, color: '#808080' }] }, legend: { enabled: true },
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+
Highcharts.numberFormat(this.y, 2);
}
},
legend: { enabled: false },
exporting: { enabled: false }, exporting: { enabled: false },
series: [{name: 'ShaftVelocity', plotOptions: { spline: { marker: { radius: 4, lineColor: "#666666", lineWidth: 1} } },
data: (function() { series: [
// generate an array of random data {name: "轴速度",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
var data = [], time = (new Date()).getTime(), i; {name: "电机电压",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
for (i = -30; i <= 0; i++) { {name: "目标速度",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
data.push({ {name: "摆角",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
x: time + i * 1000, {name: "目标角",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
y: 0 {name: "pitch",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
}); {name: "kalAngleZ",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
} {name: "回旋速率",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()}
return data; ]
})()
}]
}); });
}); });
}); });
@ -220,14 +215,9 @@ function loadXMLDoc(path,element)
function UpdateInfo() function UpdateInfo()
{ {
var xmlhttp; var xmlhttp;
if (window.XMLHttpRequest) if (window.XMLHttpRequest){ // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
{
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
xmlhttp=new XMLHttpRequest(); xmlhttp=new XMLHttpRequest();
} } else { // IE6, IE5 浏览器执行代码
else
{
// IE6, IE5 浏览器执行代码
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
} }
xmlhttp.onreadystatechange=function() xmlhttp.onreadystatechange=function()
@ -235,7 +225,6 @@ function UpdateInfo()
if (xmlhttp.readyState==4 && xmlhttp.status==200) if (xmlhttp.readyState==4 && xmlhttp.status==200)
{ {
var arr=xmlhttp.responseText.split(","); var arr=xmlhttp.responseText.split(",");
document.getElementById('TimeDiv').innerHTML=arr[0]; document.getElementById('TimeDiv').innerHTML=arr[0];
document.getElementById('CurrentMillis').innerHTML=arr[1]; document.getElementById('CurrentMillis').innerHTML=arr[1];
document.getElementById('log_control').value=arr[2]; document.getElementById('log_control').value=arr[2];
@ -270,7 +259,9 @@ function UpdateInfo()
if(document.getElementById('v_p_22').value=="") document.getElementById('v_p_22').value=arr[12]; if(document.getElementById('v_p_22').value=="") document.getElementById('v_p_22').value=arr[12];
if(document.getElementById('log_control').value=="1" && arr[13]!=""){ if(document.getElementById('log_control').value=="1" && arr[13]!=""){
ShaftVelocity = arr[13]; for(i=0; i<HighchartsData.length;i++){
HighchartsData[i] = parseFloat(arr[i+13]);
}
document.getElementById('Shaft_Velocity').innerHTML =arr[13]+"<br>"+document.getElementById('Shaft_Velocity').innerHTML; document.getElementById('Shaft_Velocity').innerHTML =arr[13]+"<br>"+document.getElementById('Shaft_Velocity').innerHTML;
document.getElementById('motor_voltage_q').innerHTML=arr[14]+"<br>"+document.getElementById('motor_voltage_q').innerHTML; document.getElementById('motor_voltage_q').innerHTML=arr[14]+"<br>"+document.getElementById('motor_voltage_q').innerHTML;
document.getElementById('target_velocity').innerHTML=arr[15]+"<br>"+document.getElementById('target_velocity').innerHTML; document.getElementById('target_velocity').innerHTML=arr[15]+"<br>"+document.getElementById('target_velocity').innerHTML;
@ -291,49 +282,44 @@ function UpdateInfo()
xmlhttp.send(); xmlhttp.send();
} }
function MyAutoRun() function MyAutoRun() {
{
UpdateInfo(); UpdateInfo();
} }
setInterval("MyAutoRun()", 1000); setInterval("MyAutoRun()", 1000);
function clearLog() function clearLog() {
{ document.getElementById("Shaft_Velocity").innerHTML = "";
document.getElementById('Shaft_Velocity').innerHTML =""; document.getElementById("motor_voltage_q").innerHTML = "";
document.getElementById('motor_voltage_q').innerHTML =""; document.getElementById("target_velocity").innerHTML = "";
document.getElementById('target_velocity').innerHTML =""; document.getElementById("pendulum_angle").innerHTML = "";
document.getElementById('pendulum_angle').innerHTML =""; document.getElementById("target_angle").innerHTML = "";
document.getElementById('target_angle').innerHTML =""; document.getElementById("pitch").innerHTML = "";
document.getElementById('pitch').innerHTML =""; document.getElementById("kalAngleZ").innerHTML = "";
document.getElementById('kalAngleZ').innerHTML =""; document.getElementById("gyroZrate").innerHTML = "";
document.getElementById('gyroZrate').innerHTML ="";
} }
function clearDebugLog() function clearDebugLog() {
{ document.getElementById("debug_log").value = "";
document.getElementById('debug_log').value ="";
} }
function checkNum(obj) { function checkNum(obj) {
//检查是否是非数字值 if (isNaN(obj.value)) { //检查是否是非数字值
if (isNaN(obj.value)) {
obj.value = ""; obj.value = "";
} }
if (obj != null) { if (obj != null) { //检查小数点后是否对于两位
//检查小数点后是否对于两位 if (
if (obj.value.toString().split(".").length > 1 && obj.value.toString().split(".")[1].length > 2) { obj.value.toString().split(".").length > 1 &&
//alert("小数点后多于两位！"); obj.value.toString().split(".")[1].length > 2
) { //alert("小数点后多于两位！");
obj.value = Number(obj.value).toPrecision(2); obj.value = Number(obj.value).toPrecision(2);
} }
} }
}; }
</script> </script>
</head> </head>
<body style="background-color:black;color:white"> <body style="background-color:black;color:white">
<font size="6" onclick="(document.getElementById('debug_hidden').value%6==5)?(document.getElementById('debug_show').style.display='block'):document.getElementById('debug_hidden').value++;">自平衡莱洛三角形
<font size=6 onclick="(document.getElementById('debug_hidden').value%6==5)?(document.getElementById('debug_show').style.display='block'):document.getElementById('debug_hidden').value++;">自平衡莱洛三角形
<input id="debug_hidden" hidden> <input id="debug_hidden" hidden>
<span id="TimeDiv" hidden>datetime</Span> <span id="TimeDiv" hidden>datetime</Span>
</font> </font>
@ -380,7 +366,8 @@ function checkNum(obj) {
<td align="center"> <td align="center">
<div style="width: 90px;float: left"><input class="tl-input" type="text" name="target_angle_ROM" id="target_angle_ROM2" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('target_angle_ROM2').value=Number(document.getElementById('target_angle_ROM2').value)+0.5;">+</button> <div style="width: 90px;float: left"><input class="tl-input" type="text" name="target_angle_ROM" id="target_angle_ROM2" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('target_angle_ROM2').value=Number(document.getElementById('target_angle_ROM2').value)+0.5;">+</button>
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('target_angle_ROM2').value=Number(document.getElementById('target_angle_ROM2').value)-0.5;">-</button><br> <button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('target_angle_ROM2').value=Number(document.getElementById('target_angle_ROM2').value)-0.5;">-</button><br>
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=0&Operation='+document.getElementById('target_angle_ROM2').value,'OperationHit')">发送</button></td> <button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=0&Operation='+document.getElementById('target_angle_ROM2').value,'OperationHit')">发送</button>
</td>
<td align="center"> <td align="center">
<div style="width: 90px;float: left"><input class="tl-input" name="swing_up_voltage" id="swing_up_voltage2" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_voltage2').value=Number(Number(document.getElementById('swing_up_voltage2').value)+0.10).toPrecision(2);">+</button> <div style="width: 90px;float: left"><input class="tl-input" name="swing_up_voltage" id="swing_up_voltage2" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_voltage2').value=Number(Number(document.getElementById('swing_up_voltage2').value)+0.10).toPrecision(2);">+</button>
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_voltage2').value=Number(Number(document.getElementById('swing_up_voltage2').value)-0.10).toPrecision(2);">-</button><br> <button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_voltage2').value=Number(Number(document.getElementById('swing_up_voltage2').value)-0.10).toPrecision(2);">-</button><br>
@ -467,8 +454,10 @@ function checkNum(obj) {
<td align="left"> <td align="left">
<table border="1" cellspacing="0" cellpadding="0" ID="logchart" width="100%"> <table border="1" cellspacing="0" cellpadding="0" ID="logchart" width="100%">
<tr> <tr>
<td align="center"><div id="container" style="width:700px;height:400px;margin:0 auto;"></div> <td align="center">
<div style="text-align:center;clear:both;"></td> <div id="container" style="width:700px;height:400px;margin:0 auto;"></div>
<div style="text-align:center;clear:both;">
</td>
</tr> </tr>
</table> </table>
</td> </td>