update arduino/Betas/RGB_V1.1.1/main/data/index.html.
慕炎
Gitee
parent
22db9b46cc
commit
90ea3f6b25
|
|
@ -4,40 +4,44 @@ HW:Ver 1.5
|
|||
FW:Ver 1.2
|
||||
-->
|
||||
<html lang="zh-cn">
|
||||
|
||||
<head>
|
||||
<title>自平衡莱洛三角形</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>自平衡莱洛三角形</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<meta http-equiv="Cache-Control" content="max-age=7200" />
|
||||
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
|
||||
<style>
|
||||
/*input框*/
|
||||
input, button {
|
||||
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
|
||||
<style>
|
||||
/*input框*/
|
||||
input,
|
||||
button {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
.tl-input{
|
||||
|
||||
.tl-input {
|
||||
width: 100%;
|
||||
border: 1px solid #ccc;
|
||||
padding: 7px 0;
|
||||
background: #F4F4F7;
|
||||
text-align: center;
|
||||
border-radius: 3px;
|
||||
padding-left:5px;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
||||
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
|
||||
-webkit-transition: border-color ease-in-out .15s,-webkit-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
|
||||
}
|
||||
.tl-input:focus{
|
||||
padding-left: 5px;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
|
||||
-webkit-transition: border-color ease-in-out .15s, -webkit-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
|
||||
}
|
||||
|
||||
.tl-input:focus {
|
||||
border-color: #66afe9;
|
||||
outline: 0;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
|
||||
box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)
|
||||
}
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6)
|
||||
}
|
||||
|
||||
.ant-btn {
|
||||
.ant-btn {
|
||||
line-height: 1.499;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
|
@ -46,8 +50,8 @@ input, button {
|
|||
text-align: center;
|
||||
background-image: none;
|
||||
border: 1px solid transparent;
|
||||
-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.015);
|
||||
box-shadow: 0 2px 0 rgba(0,0,0,0.015);
|
||||
-webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
|
||||
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
|
||||
cursor: pointer;
|
||||
-webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
|
||||
transition: all .3s cubic-bezier(.645, .045, .355, 1);
|
||||
|
|
@ -61,46 +65,47 @@ input, button {
|
|||
padding: 0 15px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
color: rgba(0,0,0,0.65);
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
background-color: #fff;
|
||||
border-color: #d9d9d9;
|
||||
}
|
||||
}
|
||||
|
||||
.ant-btn-primary {
|
||||
.ant-btn-primary {
|
||||
color: #fff;
|
||||
background-color: #1890ff;
|
||||
border-color: #1890ff;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.12);
|
||||
-webkit-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 {
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
|
||||
-webkit-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 {
|
||||
color: #fff;
|
||||
background-color: #FF5A44;
|
||||
border-color: #FF5A44;
|
||||
text-shadow: 0 -1px 0 rgba(0,0,0,0.12);
|
||||
-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.045);
|
||||
box-shadow: 0 2px 0 rgba(0,0,0,0.045);
|
||||
}
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
|
||||
-webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
|
||||
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
|
||||
}
|
||||
|
||||
/* 这里不考虑浏览器的兼容性 */
|
||||
#control input {
|
||||
/* 这里不考虑浏览器的兼容性 */
|
||||
#control input {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
margin: 20px 0;
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
#control input[type="text"] {
|
||||
#control input[type="text"] {
|
||||
width: 100%;
|
||||
font-size: 25px;
|
||||
appearance: none;
|
||||
padding-bottom: 5px;
|
||||
border-bottom: 3px solid #ededed;
|
||||
color: #ededed;
|
||||
}
|
||||
}
|
||||
|
||||
#control input[type="range"] {
|
||||
#control input[type="range"] {
|
||||
width: 100%;
|
||||
-webkit-appearance: none;
|
||||
/* background-color: silver; */
|
||||
|
|
@ -108,30 +113,31 @@ input, button {
|
|||
border-radius: 4px;
|
||||
background: -webkit-linear-gradient(#ffa200, #ffa200) no-repeat white;
|
||||
background-size: 50% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#control input[type="range"]::-webkit-slider-thumb {
|
||||
#control input[type="range"]::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
background-color: #aaa;
|
||||
width: 8px;
|
||||
height: 20px;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
#control input[type="range"]::-webkit-slider-thumb:hover {
|
||||
#control input[type="range"]::-webkit-slider-thumb:hover {
|
||||
background: #666;
|
||||
}
|
||||
}
|
||||
|
||||
#control #voltage {
|
||||
#control #voltage {
|
||||
background-size: 0% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#control #speed {
|
||||
#control #speed {
|
||||
background: linear-gradient(to right, #ffa200, white 0%, white);
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
#control input[type="button"] {
|
||||
}
|
||||
|
||||
#control input[type="button"] {
|
||||
padding: 5px;
|
||||
margin: 5px 0;
|
||||
background: linear-gradient(to bottom right, red 10%, white 90%);
|
||||
|
|
@ -139,58 +145,47 @@ input, button {
|
|||
width: 100%;
|
||||
color: white;
|
||||
font-weight: white;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript" src="jquery.js"></script>
|
||||
<script type="text/javascript" src="highcharts.js"></script>
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript" src="jquery.js"></script>
|
||||
<script type="text/javascript" src="highcharts.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var ShaftVelocity;
|
||||
|
||||
var HighchartsData = new Array(8);
|
||||
$(function () {
|
||||
$(document).ready(function() {
|
||||
Highcharts.setOptions({global: {useUTC: false} });
|
||||
var chart;
|
||||
$('#container').highcharts({
|
||||
chart: {type: 'spline', animation: Highcharts.svg, marginRight: 10, events: {
|
||||
load: function() {
|
||||
// set up the updating of the chart each second
|
||||
var series = this.series[0];
|
||||
setInterval(function() {
|
||||
var x = (new Date()).getTime(), y = parseFloat(ShaftVelocity);
|
||||
series.addPoint([x, y], true, true);
|
||||
$(document).ready(function () {
|
||||
Highcharts.setOptions({ global: { useUTC: false } });
|
||||
var chart, time = new Date().getTime();
|
||||
$("#container").highcharts({
|
||||
chart: { type: "spline", animation: Highcharts.svg, marginRight: 10, events: { load: function () {
|
||||
var series = this.series;
|
||||
setInterval(function () {
|
||||
var x = new Date().getTime();
|
||||
for(i=0; i<HighchartsData.length;i++){
|
||||
series[i].addPoint([x, HighchartsData[i]], true, true);
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
},
|
||||
title: {text: '动态走势图' },
|
||||
xAxis: {type: 'datetime', tickPixelInterval: 100 },
|
||||
yAxis: {title: {text: '动态走势图' }, plotLines: [{value: 0, width: 1, color: '#808080' }] },
|
||||
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},
|
||||
series: [{name: 'ShaftVelocity',
|
||||
data: (function() {
|
||||
// generate an array of random data
|
||||
var data = [], time = (new Date()).getTime(), i;
|
||||
for (i = -30; i <= 0; i++) {
|
||||
data.push({
|
||||
x: time + i * 1000,
|
||||
y: 0
|
||||
title: { text: "自平衡莱洛三角形" }, xAxis: { type: "datetime", tickPixelInterval: 100 }, yAxis: { title: { text: "Value" }, plotLines: [{ value: 0, width: 1, color: "#808080" }] },
|
||||
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: true },
|
||||
exporting: { enabled: false },
|
||||
plotOptions: { spline: { marker: { radius: 4, lineColor: "#666666", lineWidth: 1} } },
|
||||
series: [
|
||||
{name: "轴速度",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;})()},
|
||||
{name: "目标速度",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;})()},
|
||||
{name: "目标角",data: (function () {var data = [], i; for (i = -30; i <= 0; i++) { data.push({x: time + i * 1000, y: 0});}return data;})()},
|
||||
{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;
|
||||
})()
|
||||
}]
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<script>
|
||||
function loadXMLDoc(path,element)
|
||||
|
|
@ -220,14 +215,9 @@ function loadXMLDoc(path,element)
|
|||
function UpdateInfo()
|
||||
{
|
||||
var xmlhttp;
|
||||
if (window.XMLHttpRequest)
|
||||
{
|
||||
// IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
|
||||
if (window.XMLHttpRequest){ // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码
|
||||
xmlhttp=new XMLHttpRequest();
|
||||
}
|
||||
else
|
||||
{
|
||||
// IE6, IE5 浏览器执行代码
|
||||
} else { // IE6, IE5 浏览器执行代码
|
||||
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
|
||||
}
|
||||
xmlhttp.onreadystatechange=function()
|
||||
|
|
@ -235,7 +225,6 @@ function UpdateInfo()
|
|||
if (xmlhttp.readyState==4 && xmlhttp.status==200)
|
||||
{
|
||||
var arr=xmlhttp.responseText.split(",");
|
||||
|
||||
document.getElementById('TimeDiv').innerHTML=arr[0];
|
||||
document.getElementById('CurrentMillis').innerHTML=arr[1];
|
||||
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('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('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;
|
||||
|
|
@ -291,53 +282,48 @@ function UpdateInfo()
|
|||
xmlhttp.send();
|
||||
}
|
||||
|
||||
function MyAutoRun()
|
||||
{
|
||||
function MyAutoRun() {
|
||||
UpdateInfo();
|
||||
}
|
||||
setInterval("MyAutoRun()",1000);
|
||||
}
|
||||
setInterval("MyAutoRun()", 1000);
|
||||
|
||||
function clearLog()
|
||||
{
|
||||
document.getElementById('Shaft_Velocity').innerHTML ="";
|
||||
document.getElementById('motor_voltage_q').innerHTML ="";
|
||||
document.getElementById('target_velocity').innerHTML ="";
|
||||
document.getElementById('pendulum_angle').innerHTML ="";
|
||||
document.getElementById('target_angle').innerHTML ="";
|
||||
document.getElementById('pitch').innerHTML ="";
|
||||
document.getElementById('kalAngleZ').innerHTML ="";
|
||||
document.getElementById('gyroZrate').innerHTML ="";
|
||||
}
|
||||
function clearDebugLog()
|
||||
{
|
||||
document.getElementById('debug_log').value ="";
|
||||
}
|
||||
function clearLog() {
|
||||
document.getElementById("Shaft_Velocity").innerHTML = "";
|
||||
document.getElementById("motor_voltage_q").innerHTML = "";
|
||||
document.getElementById("target_velocity").innerHTML = "";
|
||||
document.getElementById("pendulum_angle").innerHTML = "";
|
||||
document.getElementById("target_angle").innerHTML = "";
|
||||
document.getElementById("pitch").innerHTML = "";
|
||||
document.getElementById("kalAngleZ").innerHTML = "";
|
||||
document.getElementById("gyroZrate").innerHTML = "";
|
||||
}
|
||||
function clearDebugLog() {
|
||||
document.getElementById("debug_log").value = "";
|
||||
}
|
||||
|
||||
function checkNum(obj) {
|
||||
//检查是否是非数字值
|
||||
if (isNaN(obj.value)) {
|
||||
if (isNaN(obj.value)) { //检查是否是非数字值
|
||||
obj.value = "";
|
||||
}
|
||||
if (obj != null) {
|
||||
//检查小数点后是否对于两位
|
||||
if (obj.value.toString().split(".").length > 1 && obj.value.toString().split(".")[1].length > 2) {
|
||||
//alert("小数点后多于两位！");
|
||||
if (obj != null) { //检查小数点后是否对于两位
|
||||
if (
|
||||
obj.value.toString().split(".").length > 1 &&
|
||||
obj.value.toString().split(".")[1].length > 2
|
||||
) { //alert("小数点后多于两位！");
|
||||
obj.value = Number(obj.value).toPrecision(2);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<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>
|
||||
<span id="TimeDiv" hidden>datetime</Span>
|
||||
</font>
|
||||
</div>
|
||||
</div>
|
||||
<table border="0">
|
||||
<tr>
|
||||
<td height="50">已启动：<span id=CurrentMillis></span>
|
||||
|
|
@ -359,58 +345,59 @@ function checkNum(obj) {
|
|||
<td align="left">
|
||||
<table border="1" cellspacing="0" cellpadding="0">
|
||||
<tr>
|
||||
<td align="center"><span style="color:#398ad9;">期望角度TA</span></td>
|
||||
<td align="center"><span style="color:#5bec8d;">摇摆电压SV</span></td>
|
||||
<td align="center"><span style="color:#fd42ac;">摇摆角度SA</span></td>
|
||||
<td align="center"><span style="color:#4b8200;">速度环P1</span></td>
|
||||
<td align="center"><span style="color:#ff33ff;">速度环I1</span></td>
|
||||
<td align="center"><span style="color:#4b8200;">速度环P2</span></td>
|
||||
<td align="center"><span style="color:#ff33ff;">速度环I2</span></td>
|
||||
<td align="center"><span style="color:#398ad9;">期望角度TA</span></td>
|
||||
<td align="center"><span style="color:#5bec8d;">摇摆电压SV</span></td>
|
||||
<td align="center"><span style="color:#fd42ac;">摇摆角度SA</span></td>
|
||||
<td align="center"><span style="color:#4b8200;">速度环P1</span></td>
|
||||
<td align="center"><span style="color:#ff33ff;">速度环I1</span></td>
|
||||
<td align="center"><span style="color:#4b8200;">速度环P2</span></td>
|
||||
<td align="center"><span style="color:#ff33ff;">速度环I2</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center"><span style="color:#ff5c5c;" id="target_angle_ROM"></span></td>
|
||||
<td align="center"><span style="color:#5bec8d;" id="swing_up_voltage"></span></td>
|
||||
<td align="center"><span style="color:#fd42ac;" id="swing_up_angle"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="v_p_1"></span></td>
|
||||
<td align="center"><span style="color:#ff33ff;" id="v_i_1"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="v_p_2"></span></td>
|
||||
<td align="center"><span style="color:#ff33ff;" id="v_i_2"></span></td>
|
||||
<td align="center"><span style="color:#ff5c5c;" id="target_angle_ROM"></span></td>
|
||||
<td align="center"><span style="color:#5bec8d;" id="swing_up_voltage"></span></td>
|
||||
<td align="center"><span style="color:#fd42ac;" id="swing_up_angle"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="v_p_1"></span></td>
|
||||
<td align="center"><span style="color:#ff33ff;" id="v_i_1"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="v_p_2"></span></td>
|
||||
<td align="center"><span style="color:#ff33ff;" id="v_i_2"></span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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-red" onclick="loadXMLDoc('/Control?Type=1&Index=1&Operation='+document.getElementById('swing_up_voltage2').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="swing_up_angle" id="swing_up_angle2" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_angle2').value=Number(document.getElementById('swing_up_angle2').value)+1;">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_angle2').value=Number(document.getElementById('swing_up_angle2').value)-1;">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=2&Operation='+document.getElementById('swing_up_angle2').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_p_1" id="v_p_12" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_12').value=Number(Number(document.getElementById('v_p_12').value)+0.1).toPrecision(2);">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_12').value=Number(Number(document.getElementById('v_p_12').value)-0.1).toPrecision(2);">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=3&Operation='+document.getElementById('v_p_12').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_i_1" id="v_i_12" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_12').value=Number(document.getElementById('v_i_12').value)+0.5;">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_12').value=Number(document.getElementById('v_i_12').value)-0.5;">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=4&Operation='+document.getElementById('v_i_12').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_p_2" id="v_p_22" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_22').value=Number(Number(document.getElementById('v_p_22').value)+0.1).toPrecision(2);">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_22').value=Number(Number(document.getElementById('v_p_22').value)-0.1).toPrecision(2);">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=5&Operation='+document.getElementById('v_p_22').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_i_2" id="v_i_22" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_22').value=Number(document.getElementById('v_i_22').value)+0.5;">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_22').value=Number(document.getElementById('v_i_22').value)-0.5;">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=6&Operation='+document.getElementById('v_i_22').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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-red" onclick="loadXMLDoc('/Control?Type=1&Index=1&Operation='+document.getElementById('swing_up_voltage2').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="swing_up_angle" id="swing_up_angle2" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_angle2').value=Number(document.getElementById('swing_up_angle2').value)+1;">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('swing_up_angle2').value=Number(document.getElementById('swing_up_angle2').value)-1;">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=2&Operation='+document.getElementById('swing_up_angle2').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_p_1" id="v_p_12" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_12').value=Number(Number(document.getElementById('v_p_12').value)+0.1).toPrecision(2);">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_12').value=Number(Number(document.getElementById('v_p_12').value)-0.1).toPrecision(2);">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=3&Operation='+document.getElementById('v_p_12').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_i_1" id="v_i_12" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_12').value=Number(document.getElementById('v_i_12').value)+0.5;">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_12').value=Number(document.getElementById('v_i_12').value)-0.5;">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=4&Operation='+document.getElementById('v_i_12').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_p_2" id="v_p_22" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_22').value=Number(Number(document.getElementById('v_p_22').value)+0.1).toPrecision(2);">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_p_22').value=Number(Number(document.getElementById('v_p_22').value)-0.1).toPrecision(2);">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=5&Operation='+document.getElementById('v_p_22').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
<td align="center">
|
||||
<div style="width: 90px;float: left"><input class="tl-input" name="v_i_2" id="v_i_22" size="2" onchange="checkNum(this)"><button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_22').value=Number(document.getElementById('v_i_22').value)+0.5;">+</button>
|
||||
<button type="button" class="ant-btn ant-btn-primary" onclick="document.getElementById('v_i_22').value=Number(document.getElementById('v_i_22').value)-0.5;">-</button><br>
|
||||
<button type="button" class="ant-btn ant-btn-red" onclick="loadXMLDoc('/Control?Type=1&Index=6&Operation='+document.getElementById('v_i_22').value,'OperationHit')">发送</button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
|
|
@ -467,8 +454,10 @@ function checkNum(obj) {
|
|||
<td align="left">
|
||||
<table border="1" cellspacing="0" cellpadding="0" ID="logchart" width="100%">
|
||||
<tr>
|
||||
<td align="center"><div id="container" style="width:700px;height:400px;margin:0 auto;"></div>
|
||||
<div style="text-align:center;clear:both;"></td>
|
||||
<td align="center">
|
||||
<div id="container" style="width:700px;height:400px;margin:0 auto;"></div>
|
||||
<div style="text-align:center;clear:both;">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
|
|
@ -487,14 +476,14 @@ function checkNum(obj) {
|
|||
<td align="center"><span style="color:#4b8200;">gyroZrate</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center"><span style="color:#ff5c5c;" id="Shaft_Velocity"></span></td>
|
||||
<td align="center"><span style="color:#398ad9;" id="motor_voltage_q"></span></td>
|
||||
<td align="center"><span style="color:#ff5c5c;" id="target_velocity"></span></td>
|
||||
<td align="center"><span style="color:#5bec8d;" id="pendulum_angle"></span></td>
|
||||
<td align="center"><span style="color:#fd42ac;" id="target_angle"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="pitch"></span></td>
|
||||
<td align="center"><span style="color:#ff33ff;" id="kalAngleZ"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="gyroZrate"></span></td>
|
||||
<td align="center"><span style="color:#ff5c5c;" id="Shaft_Velocity"></span></td>
|
||||
<td align="center"><span style="color:#398ad9;" id="motor_voltage_q"></span></td>
|
||||
<td align="center"><span style="color:#ff5c5c;" id="target_velocity"></span></td>
|
||||
<td align="center"><span style="color:#5bec8d;" id="pendulum_angle"></span></td>
|
||||
<td align="center"><span style="color:#fd42ac;" id="target_angle"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="pitch"></span></td>
|
||||
<td align="center"><span style="color:#ff33ff;" id="kalAngleZ"></span></td>
|
||||
<td align="center"><span style="color:#4b8200;" id="gyroZrate"></span></td>
|
||||
</tr>
|
||||
</table>
|
||||
</td>
|
||||
|
|
@ -502,31 +491,31 @@ function checkNum(obj) {
|
|||
</table>
|
||||
|
||||
<script>
|
||||
const voltage = document.getElementById('voltage');
|
||||
const speed = document.getElementById('speed');
|
||||
const voltage = document.getElementById('voltage');
|
||||
const speed = document.getElementById('speed');
|
||||
|
||||
function changeV() {
|
||||
function changeV() {
|
||||
voltageVal = parseFloat(voltage.value);
|
||||
spdVal = parseFloat(speed.value);
|
||||
const voltagePercent = Math.abs(parseFloat(voltageVal/12, 2) * 50)
|
||||
const speedPercent = Math.abs(parseFloat((spdVal/100), 2) * 100)*1.5
|
||||
if (voltageVal<0)
|
||||
const voltagePercent = Math.abs(parseFloat(voltageVal / 12, 2) * 50)
|
||||
const speedPercent = Math.abs(parseFloat((spdVal / 100), 2) * 100) * 1.5
|
||||
if (voltageVal < 0)
|
||||
voltage.style.background = `linear-gradient(to right, #ffa200 ${voltagePercent}%, white ${voltagePercent}%`
|
||||
else
|
||||
voltage.style.background = `linear-gradient(to left, #ffa200 ${voltagePercent}%, white ${voltagePercent}%`
|
||||
if (spdVal<0)
|
||||
if (spdVal < 0)
|
||||
speed.style.background = `linear-gradient(to right, #ffa200, white ${speedPercent}%`
|
||||
else
|
||||
speed.style.background = `linear-gradient(to left, #ffa200, white ${speedPercent}%`
|
||||
document.getElementById('voltageNum').innerHTML = voltageVal;
|
||||
document.getElementById('speedNum').innerHTML = spdVal;
|
||||
if( document.getElementById('test_flag').value=='1' ){
|
||||
loadXMLDoc('/Control?Type=1&Index=7&Operation='+voltageVal,'OperationHit');
|
||||
if (document.getElementById('test_flag').value == '1') {
|
||||
loadXMLDoc('/Control?Type=1&Index=7&Operation=' + voltageVal, 'OperationHit');
|
||||
}
|
||||
if( document.getElementById('test_flag').value=='2' ){
|
||||
loadXMLDoc('/Control?Type=1&Index=8&Operation='+spdVal,'OperationHit');
|
||||
if (document.getElementById('test_flag').value == '2') {
|
||||
loadXMLDoc('/Control?Type=1&Index=8&Operation=' + spdVal, 'OperationHit');
|
||||
}
|
||||
};
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue